diff --git a/src/addons/blog/pages/edit-entry/edit-entry.html b/src/addons/blog/pages/edit-entry/edit-entry.html
index 2c516a75a..5ab20704f 100644
--- a/src/addons/blog/pages/edit-entry/edit-entry.html
+++ b/src/addons/blog/pages/edit-entry/edit-entry.html
@@ -14,9 +14,7 @@
         <form [formGroup]="form">
             <ion-item>
                 <ion-input labelPlacement="stacked" formControlName="subject" type="text"
-                    [placeholder]="'addon.blog.entrytitle' | translate" name="title">
-                    <p>{{ 'addon.blog.entrytitle' | translate }}</p>
-                </ion-input>
+                    [placeholder]="'addon.blog.entrytitle' | translate" name="title" [label]="'addon.blog.entrytitle' | translate" />
             </ion-item>
 
             <ion-item>
@@ -27,7 +25,7 @@
                     [elementId]="entry?.id ?? 'new_entry'" />
             </ion-item>
 
-            <ion-item>
+            <ion-item lines="none">
                 <core-combobox name="addon_blog_publish_to" formControlName="publishState" [label]="'addon.blog.publishto' | translate">
                     <ion-select-option class="core-select-option-title" [value]="publishState.draft">
                         {{ 'addon.blog.publishtonoone' | translate }}
@@ -54,7 +52,7 @@
             </ion-item>
             <div id="addon-blog-associations">
                 @if (associationsExpanded) {
-                <ion-item class="ion-no-validation">
+                <ion-item lines="none">
                     @if (associatedModule) {
                     <ion-toggle formControlName="associateWithModule">
                         <core-format-text [text]="'addon.blog.associatewithmodule' | translate: {
diff --git a/src/addons/blog/pages/index/index.html b/src/addons/blog/pages/index/index.html
index f0eba0d08..6b63caa67 100644
--- a/src/addons/blog/pages/index/index.html
+++ b/src/addons/blog/pages/index/index.html
@@ -20,7 +20,7 @@
 
     <core-loading [hideUntil]="loaded">
         @if (showMyEntriesToggle) {
-        <ion-item class="ion-no-validation">
+        <ion-item lines="none" class="ion-text-wrap">
             <ion-toggle [(ngModel)]="onlyMyEntries" (ionChange)="onlyMyEntriesToggleChanged(onlyMyEntries)">
                 {{ 'addon.blog.showonlyyourentries' | translate }}
             </ion-toggle>
diff --git a/src/addons/calendar/components/filter/filter.html b/src/addons/calendar/components/filter/filter.html
index dcd796e44..b2a1e326c 100644
--- a/src/addons/calendar/components/filter/filter.html
+++ b/src/addons/calendar/components/filter/filter.html
@@ -9,7 +9,7 @@
 </ion-header>
 <ion-content [fullscreen]="true">
     <ion-list>
-        <ion-item *ngFor="let type of types" class="addon-calendar-event ion-no-validation" [ngClass]="['addon-calendar-eventtype-'+type]">
+        <ion-item *ngFor="let type of types" class="addon-calendar-event" [ngClass]="['addon-calendar-eventtype-'+type]" lines="none">
             <ion-icon [name]="typeIcons[type]" slot="start" aria-hidden="true" />
             <ion-toggle [(ngModel)]="filter[type]" (ionChange)="onChange()">
                 {{ 'addon.calendar.' + type + 'events' | translate}}
diff --git a/src/addons/calendar/components/filter/filter.scss b/src/addons/calendar/components/filter/filter.scss
index 2023335f6..27f31231d 100644
--- a/src/addons/calendar/components/filter/filter.scss
+++ b/src/addons/calendar/components/filter/filter.scss
@@ -1,14 +1,16 @@
 @use "theme/globals" as *;
 
 :host {
-    ion-item {
-        ion-icon, ion-radio {
+    .item {
+        ion-radio {
             @include margin-horizontal(null, 8px);
         }
 
-        > ion-icon {
-            padding: 4px;
-            font-size: var(--mdl-typography-icon-fontSize-md);
+        &.addon-calendar-event > ion-icon {
+            --margin-vertical: 8px;
+            --margin-end: 8px;
+            padding: 8px;
+            font-size: var(--mdl-typography-icon-fontSize-sm);
         }
     }
 }
diff --git a/src/addons/messageoutput/airnotifier/pages/devices/devices.html b/src/addons/messageoutput/airnotifier/pages/devices/devices.html
index a1d79e116..ea9e75d30 100644
--- a/src/addons/messageoutput/airnotifier/pages/devices/devices.html
+++ b/src/addons/messageoutput/airnotifier/pages/devices/devices.html
@@ -21,8 +21,8 @@
             </ion-item-divider>
             <ion-card>
                 <ion-list>
-                    <ion-item class="ion-text-wrap ion-no-validation" *ngFor="let device of platform.devices"
-                        [class.item-current]="device.current">
+                    <ion-item class="ion-text-wrap" *ngFor="let device of platform.devices" [class.item-current]="device.current"
+                        lines="none">
                         <ion-label>
                             <p class="item-heading" id="device-{{device.id}}">
                                 <strong>{{ device.name }} {{ device.model }}</strong> ({{platform.platform}} {{ device.version }})
diff --git a/src/addons/messages/pages/settings/settings.html b/src/addons/messages/pages/settings/settings.html
index e4d5a634c..bbf72e6f4 100644
--- a/src/addons/messages/pages/settings/settings.html
+++ b/src/addons/messages/pages/settings/settings.html
@@ -21,7 +21,7 @@
                         <h2>{{ 'core.settings.general' | translate }}</h2>
                     </ion-label>
                 </ion-item-divider>
-                <ion-item class="ion-text-wrap ion-no-validation">
+                <ion-item class="ion-text-wrap" lines="none">
                     <ion-toggle [(ngModel)]="sendOnEnter" (ngModelChange)="sendOnEnterChanged()">
                         {{ 'addon.messages.useentertosend' | translate }}
                     </ion-toggle>
@@ -31,7 +31,7 @@
 
         <!-- Contactable privacy. -->
         <ion-card>
-            <ion-item *ngIf="!advancedContactable" class="ion-text-wrap ion-no-validation">
+            <ion-item *ngIf="!advancedContactable" class="ion-text-wrap" lines="none">
                 <ion-toggle [(ngModel)]="contactablePrivacy" (ngModelChange)="saveContactablePrivacy(contactablePrivacy)">
                     {{ 'addon.messages.blocknoncontacts' | translate }}
                 </ion-toggle>
@@ -95,7 +95,7 @@
                     </ion-item-divider>
                     <!-- If notifications not disabled, show toggles.
                         If notifications are disabled, show "Disabled" instead of toggle. -->
-                    <ion-item *ngFor="let state of ['loggedin', 'loggedoff']" class="ion-text-wrap ion-no-validation">
+                    <ion-item *ngFor="let state of ['loggedin', 'loggedoff']" class="ion-text-wrap" lines="none">
                         <ion-label>
                             <p>{{ 'core.settings.' + state | translate }}</p>
                         </ion-label>
@@ -131,7 +131,7 @@
             </ion-item-divider>
             <ng-container *ngFor="let processor of notification.processors">
                 <!-- If group messaging is enabled, display a simplified view. -->
-                <ion-item class="ion-text-wrap ion-no-validation">
+                <ion-item class="ion-text-wrap" lines="none">
                     <ion-label>
                         <p>{{ processor.displayname }}</p>
                     </ion-label>
diff --git a/src/addons/mod/assign/components/submission/addon-mod-assign-submission.html b/src/addons/mod/assign/components/submission/addon-mod-assign-submission.html
index 13de238a2..9879b3565 100644
--- a/src/addons/mod/assign/components/submission/addon-mod-assign-submission.html
+++ b/src/addons/mod/assign/components/submission/addon-mod-assign-submission.html
@@ -345,7 +345,7 @@
                     </ion-item>
 
                     <!--- Apply grade to all team members. -->
-                    <ion-item class="ion-text-wrap ion-no-validation" *ngIf="assign!.teamsubmission && canSaveGrades">
+                    <ion-item class="ion-text-wrap" *ngIf="assign!.teamsubmission && canSaveGrades" lines="none">
                         <ion-toggle [(ngModel)]="grade.applyToAll">
                             <p class="item-heading">{{ 'addon.mod_assign.groupsubmissionsettings' | translate }}</p>
                             <p>{{ 'addon.mod_assign.applytoteam' | translate }}</p>
@@ -371,7 +371,7 @@
                                 </p>
                             </ion-label>
                         </ion-item>
-                        <ion-item *ngIf="canSaveGrades && allowAddAttempt" class="ion-no-validation">
+                        <ion-item *ngIf="canSaveGrades && allowAddAttempt" lines="none">
                             <ion-toggle [(ngModel)]="grade.addAttempt">
                                 <p>{{ 'addon.mod_assign.addattempt' | translate }}</p>
                             </ion-toggle>
diff --git a/src/addons/mod/assign/pages/submission-list/submission-list.html b/src/addons/mod/assign/pages/submission-list/submission-list.html
index 2dc9b43e2..4bf9c85b4 100644
--- a/src/addons/mod/assign/pages/submission-list/submission-list.html
+++ b/src/addons/mod/assign/pages/submission-list/submission-list.html
@@ -50,12 +50,12 @@
                                 </span>
                             </p>
                             <p *ngIf="submission.statusTranslated">
-                                <ion-badge class="ion-text-center ion-text-wrap" [color]="submission.statusColor">
+                                <ion-badge class="ion-text-start ion-text-wrap" [color]="submission.statusColor">
                                     {{ submission.statusTranslated }}
                                 </ion-badge>
                             </p>
                             <p *ngIf="submission.gradingStatusTranslationId">
-                                <ion-badge class="ion-text-center ion-text-wrap" [color]="submission.gradingColor">
+                                <ion-badge class="ion-text-start ion-text-wrap" [color]="submission.gradingColor">
                                     {{ submission.gradingStatusTranslationId | translate }}
                                 </ion-badge>
                             </p>
diff --git a/src/addons/mod/chat/pages/sessions/sessions.html b/src/addons/mod/chat/pages/sessions/sessions.html
index 6b307bfe8..499ee182a 100644
--- a/src/addons/mod/chat/pages/sessions/sessions.html
+++ b/src/addons/mod/chat/pages/sessions/sessions.html
@@ -16,7 +16,7 @@
         <core-loading [hideUntil]="sessions.loaded">
             <core-group-selector [groupInfo]="groupInfo" [(selected)]="groupId" (selectedChange)="reloadSessions()" [courseId]="courseId" />
 
-            <ion-item class="ion-no-validation">
+            <ion-item class="ion-text-wrap" lines="none">
                 <ion-toggle [(ngModel)]="showAll" (ionChange)="reloadSessions()">
                     {{ 'addon.mod_chat.showincompletesessions' | translate }}
                 </ion-toggle>
diff --git a/src/addons/mod/data/components/search/search.html b/src/addons/mod/data/components/search/search.html
index e855001b6..94ce975de 100644
--- a/src/addons/mod/data/components/search/search.html
+++ b/src/addons/mod/data/components/search/search.html
@@ -11,9 +11,9 @@
     </ion-toolbar>
 </ion-header>
 <ion-content>
-    <ion-item class="ion-no-validation">
+    <ion-item lines="full" class="ion-text-wrap">
         <ion-toggle [(ngModel)]="search.searchingAdvanced">
-            {{ 'addon.mod_data.advancedsearch' | translate }}
+            <p class="item-heading">{{ 'addon.mod_data.advancedsearch' | translate }}</p>
         </ion-toggle>
     </ion-item>
     <form (ngSubmit)="searchEntries($event)" [formGroup]="searchForm" #searchFormEl>
diff --git a/src/addons/mod/forum/components/post/post.scss b/src/addons/mod/forum/components/post/post.scss
index 4dfb6f53a..130d7d283 100644
--- a/src/addons/mod/forum/components/post/post.scss
+++ b/src/addons/mod/forum/components/post/post.scss
@@ -2,7 +2,7 @@
 
 :host .addon-mod_forum-post {
     background-color: var(--ion-item-background);
-    border-bottom: 1px solid var(--addon-forum-border-color);
+    border-bottom: var(--addon-forum-border-color, 1px) solid var(--addon-forum-border-color);
 
     .addon-forum-star {
         color: var(--core-star-color);
diff --git a/src/addons/mod/forum/pages/discussion/discussion.scss b/src/addons/mod/forum/pages/discussion/discussion.scss
index b68bd597b..a51ebedd7 100644
--- a/src/addons/mod/forum/pages/discussion/discussion.scss
+++ b/src/addons/mod/forum/pages/discussion/discussion.scss
@@ -1,7 +1,10 @@
 :host {
 
-    .addon-forum-reply-button .label {
-        margin: 0;
+    .addon-forum-reply-button ion-label {
+        margin: 0px;
     }
 
+    ion-card addon-mod-forum-post {
+        --addon-forum-border-color: 0px;
+    }
 }
diff --git a/src/addons/mod/forum/pages/new-discussion/new-discussion.html b/src/addons/mod/forum/pages/new-discussion/new-discussion.html
index 5ce021178..38fbec675 100644
--- a/src/addons/mod/forum/pages/new-discussion/new-discussion.html
+++ b/src/addons/mod/forum/pages/new-discussion/new-discussion.html
@@ -17,9 +17,7 @@
         <form *ngIf="showForm" #newDiscFormEl>
             <ion-item>
                 <ion-input labelPlacement="stacked" [(ngModel)]="newDiscussion.subject" type="text"
-                    [placeholder]="'addon.mod_forum.subject' | translate" name="subject">
-                    <p>{{ 'addon.mod_forum.subject' | translate }}</p>
-                </ion-input>
+                    [placeholder]="'addon.mod_forum.subject' | translate" name="subject" [label]="'addon.mod_forum.subject' | translate" />
             </ion-item>
             <ion-item>
                 <ion-label position="stacked">{{ 'addon.mod_forum.message' | translate }}</ion-label>
@@ -38,7 +36,7 @@
                 </ion-label>
             </ion-item>
             <div *ngIf="advanced" id="addon-mod-forum-new-discussion-advanced">
-                <ion-item *ngIf="showGroups && groupIds.length > 1 && accessInfo.cancanposttomygroups" class="ion-no-validation">
+                <ion-item *ngIf="showGroups && groupIds.length > 1 && accessInfo.cancanposttomygroups" class="ion-text-wrap" lines="none">
                     <ion-toggle [(ngModel)]="newDiscussion.postToAllGroups" name="postallgroups">
                         {{ 'addon.mod_forum.posttomygroups' | translate }}
                     </ion-toggle>
@@ -54,12 +52,12 @@
                         </ion-select-option>
                     </ion-select>
                 </ion-item>
-                <ion-item class="ion-text-wrap ion-no-validation">
+                <ion-item class="ion-text-wrap" lines="none">
                     <ion-toggle [(ngModel)]="newDiscussion.subscribe" name="subscribe">
                         {{ 'addon.mod_forum.discussionsubscription' | translate }}
                     </ion-toggle>
                 </ion-item>
-                <ion-item *ngIf="canPin" class="ion-text-wrap ion-no-validation">
+                <ion-item *ngIf="canPin" class="ion-text-wrap" lines="none">
                     <ion-toggle [(ngModel)]="newDiscussion.pin" name="pin">
                         {{ 'addon.mod_forum.discussionpinned' | translate }}
                     </ion-toggle>
@@ -68,7 +66,8 @@
                     [maxSize]="forum.maxbytes" [maxSubmissions]="forum.maxattachments" [component]="component" [componentId]="forum.cmid"
                     [allowOffline]="true" [courseId]="courseId" />
             </div>
-            <ion-item *ngIf="showGroups && postInGroupMessage && !newDiscussion.postToAllGroups" class="addon-forum-group-info">
+            <ion-item *ngIf="showGroups && postInGroupMessage && !newDiscussion.postToAllGroups"
+                class="addon-forum-group-info ion-text-wrap">
                 <ion-icon name="fas-circle-info" slot="start" aria-hidden="true" />
                 <ion-label>
                     <core-format-text [text]="postInGroupMessage" contextLevel="course" [contextInstanceId]="courseId"
diff --git a/src/addons/mod/forum/tests/behat/snapshots/test-basic-usage-of-forum-activity-in-app-reply-a-post_14.png b/src/addons/mod/forum/tests/behat/snapshots/test-basic-usage-of-forum-activity-in-app-reply-a-post_14.png
index 8bb8198cc..944ef731d 100644
Binary files a/src/addons/mod/forum/tests/behat/snapshots/test-basic-usage-of-forum-activity-in-app-reply-a-post_14.png and b/src/addons/mod/forum/tests/behat/snapshots/test-basic-usage-of-forum-activity-in-app-reply-a-post_14.png differ
diff --git a/src/addons/mod/glossary/pages/edit/edit.html b/src/addons/mod/glossary/pages/edit/edit.html
index ca1ad36b2..16f843b4b 100644
--- a/src/addons/mod/glossary/pages/edit/edit.html
+++ b/src/addons/mod/glossary/pages/edit/edit.html
@@ -53,17 +53,17 @@
                         <h2>{{ 'addon.mod_glossary.linking' | translate }}</h2>
                     </ion-label>
                 </ion-item-divider>
-                <ion-item class="ion-text-wrap ion-no-validation">
+                <ion-item class="ion-text-wrap" lines="none">
                     <ion-toggle [(ngModel)]="data.usedynalink" name="usedynalink">
                         {{ 'addon.mod_glossary.entryusedynalink' | translate }}
                     </ion-toggle>
                 </ion-item>
-                <ion-item class="ion-text-wrap ion-no-validation">
+                <ion-item class="ion-text-wrap" lines="none">
                     <ion-toggle [disabled]="!data.usedynalink" [(ngModel)]="data.casesensitive" name="casesensitive">
                         {{ 'addon.mod_glossary.casesensitive' | translate }}
                     </ion-toggle>
                 </ion-item>
-                <ion-item class="ion-text-wrap ion-no-validation">
+                <ion-item class="ion-text-wrap" lines="none">
                     <ion-toggle [disabled]="!data.usedynalink" [(ngModel)]="data.fullmatch" name="fullmatch">
                         {{ 'addon.mod_glossary.fullmatch' | translate }}
                     </ion-toggle>
diff --git a/src/addons/mod/workshop/pages/submission/submission.html b/src/addons/mod/workshop/pages/submission/submission.html
index 9369bd485..a683805f3 100644
--- a/src/addons/mod/workshop/pages/submission/submission.html
+++ b/src/addons/mod/workshop/pages/submission/submission.html
@@ -62,21 +62,21 @@
         </ion-list>
 
         <ion-list *ngIf="ownAssessment && !assessment">
-            <ion-item class="ion-text-wrap">
+            <ion-item-divider class="ion-text-wrap">
                 <ion-label>
                     <h2>{{ 'addon.mod_workshop.yourassessment' | translate }}</h2>
                 </ion-label>
-            </ion-item>
+            </ion-item-divider>
             <addon-mod-workshop-assessment [submission]="submission" [assessment]="ownAssessment" [courseId]="courseId" [access]="access"
                 [module]="module" [workshop]="workshop" />
         </ion-list>
 
         <ion-list *ngIf="submissionInfo && submissionInfo.reviewedby && submissionInfo.reviewedby.length && !assessment">
-            <ion-item class="ion-text-wrap">
+            <ion-item-divider class="ion-text-wrap">
                 <ion-label>
-                    <h3 class="item-heading">{{ 'addon.mod_workshop.receivedgrades' | translate }}</h3>
+                    <h2>{{ 'addon.mod_workshop.receivedgrades' | translate }}</h2>
                 </ion-label>
-            </ion-item>
+            </ion-item-divider>
             <ng-container *ngFor="let reviewer of submissionInfo.reviewedby">
                 <addon-mod-workshop-assessment *ngIf="!reviewer.ownAssessment" [submission]="submission" [assessment]="reviewer"
                     [courseId]="courseId" [access]="access" [module]="module" [workshop]="workshop" />
@@ -84,34 +84,34 @@
         </ion-list>
 
         <ion-list *ngIf="submissionInfo && submissionInfo.reviewerof && submissionInfo.reviewerof.length && !assessment">
-            <ion-item class="ion-text-wrap">
+            <ion-item-divider class="ion-text-wrap">
                 <ion-label>
-                    <h3 class="item-heading">{{ 'addon.mod_workshop.givengrades' | translate }}</h3>
+                    <h2>{{ 'addon.mod_workshop.givengrades' | translate }}</h2>
                 </ion-label>
-            </ion-item>
+            </ion-item-divider>
             <addon-mod-workshop-assessment *ngFor="let reviewer of submissionInfo.reviewerof" [assessment]="reviewer" [courseId]="courseId"
                 [module]="module" [workshop]="workshop" [access]="access" />
         </ion-list>
 
         <form [formGroup]="feedbackForm" *ngIf="canAddFeedback && submission" #feedbackFormEl>
-            <ion-item class="ion-text-wrap">
+            <ion-item-divider class="ion-text-wrap">
                 <ion-label>
-                    <h3 class="item-heading">{{ 'addon.mod_workshop.feedbackauthor' | translate }}</h3>
+                    <h2>{{ 'addon.mod_workshop.feedbackauthor' | translate }}</h2>
                 </ion-label>
-            </ion-item>
-            <ion-item class="ion-text-wrap ion-no-validation" *ngIf="access.canpublishsubmissions">
+            </ion-item-divider>
+            <ion-item class="ion-text-wrap" lines="none" *ngIf="access.canpublishsubmissions">
                 <ion-toggle formControlName="published">
                     <p class="item-heading">{{ 'addon.mod_workshop.publishsubmission' | translate }}</p>
                     <p>{{ 'addon.mod_workshop.publishsubmission_help' | translate }}</p>
                 </ion-toggle>
             </ion-item>
 
-            <ion-item class="ion-text-wrap">
+            <ion-item-divider class="ion-text-wrap">
                 <ion-label>
-                    <h3 class="item-heading">{{ 'addon.mod_workshop.gradecalculated' | translate }}</h3>
+                    <h3>{{ 'addon.mod_workshop.gradecalculated' | translate }}</h3>
                     <p>{{ submission.grade }}</p>
                 </ion-label>
-            </ion-item>
+            </ion-item-divider>
             <ion-item class="ion-text-wrap">
                 <ion-select labelPlacement="stacked" formControlName="grade" interface="action-sheet"
                     [cancelText]="'core.cancel' | translate" [interfaceOptions]="{header: 'addon.mod_workshop.gradeover' | translate}"
diff --git a/src/addons/notifications/pages/settings/settings.html b/src/addons/notifications/pages/settings/settings.html
index f14d84f42..2df95dc01 100644
--- a/src/addons/notifications/pages/settings/settings.html
+++ b/src/addons/notifications/pages/settings/settings.html
@@ -21,12 +21,12 @@
     </ion-refresher>
     <core-loading [hideUntil]="preferencesLoaded">
         <ion-card>
-            <ion-item class="ion-text-wrap ion-no-validation" *ngIf="preferences">
+            <ion-item class="ion-text-wrap" *ngIf="preferences" lines="none">
                 <ion-toggle [(ngModel)]="preferences.enableall" (ngModelChange)="enableAll(preferences.enableall)">
                     <p class="item-heading">{{ 'addon.notifications.allownotifications' | translate }}</p>
                 </ion-toggle>
             </ion-item>
-            <ion-item class="ion-text-wrap ion-no-validation" *ngIf="canChangeSound">
+            <ion-item class="ion-text-wrap" *ngIf="canChangeSound" lines="none">
                 <ion-toggle [(ngModel)]="notificationSound" (ngModelChange)="changeNotificationSound(notificationSound)">
                     <p class="item-heading">{{ 'addon.notifications.playsound' | translate }}</p>
                 </ion-toggle>
@@ -79,7 +79,7 @@
         </ion-card-header>
         <ng-container *ngFor="let notification of component.notifications">
             <!-- Tablet view -->
-            <ion-item class="ion-text-wrap ion-hide-md-down addon-notifications-table-content only-links ion-no-validation">
+            <ion-item class="ion-text-wrap ion-hide-md-down addon-notifications-table-content only-links" lines="none">
                 <ion-label>
                     <ion-row class="ion-no-padding ion-align-items-center">
                         <ion-col class="ion-margin-horizontal ion-no-padding">
@@ -116,7 +116,7 @@
                 </ion-label>
             </ion-item>
             <!-- If notifications enabled, show toggles. If disabled, show "Disabled" instead of toggle. -->
-            <ion-item *ngFor="let state of ['loggedin', 'loggedoff']" class="ion-text-wrap ion-hide-md-up">
+            <ion-item *ngFor="let state of ['loggedin', 'loggedoff']" class="ion-text-wrap ion-hide-md-up" lines="none">
                 <ion-label class="ion-margin-horizontal">
                     <p>{{ 'core.settings.' + state | translate }}</p>
                 </ion-label>
@@ -152,7 +152,7 @@
         </ion-item-divider>
         <ng-container *ngFor="let notification of component.notifications">
             <!-- If notifications enabled, show toggles. If disabled, show "Disabled" instead of toggle. -->
-            <ion-item class="ion-text-wrap">
+            <ion-item class="ion-text-wrap" lines="none">
                 <ion-label>
                     <p>{{ notification.displayname }}</p>
                 </ion-label>
diff --git a/src/core/components/context-menu/core-context-menu-popover.html b/src/core/components/context-menu/core-context-menu-popover.html
index 8e2c4ca4e..4bcb093e2 100644
--- a/src/core/components/context-menu/core-context-menu-popover.html
+++ b/src/core/components/context-menu/core-context-menu-popover.html
@@ -3,7 +3,7 @@
         <ion-list-header *ngIf="title">
             <ion-label>{{title}}</ion-label>
         </ion-list-header>
-        <ion-item class="ion-text-wrap ion-no-validation" *ngFor="let item of items" core-link [capture]="item.captureLink"
+        <ion-item class="ion-text-wrap" lines="none" *ngFor="let item of items" core-link [capture]="item.captureLink"
             [autoLogin]="item.autoLogin" [href]="item.href" (click)="itemClicked($event, item)" [attr.aria-label]="item.ariaAction"
             [hidden]="item.hidden" [detail]="!!(item.href && !item.iconAction)" role="menuitem" [button]="!!(item.href && !item.iconAction)"
             [showBrowserWarning]="item.showBrowserWarning">
diff --git a/src/core/features/rating/components/rate/core-rating-rate.html b/src/core/features/rating/components/rate/core-rating-rate.html
index f335ad756..e7f05ebe9 100644
--- a/src/core/features/rating/components/rate/core-rating-rate.html
+++ b/src/core/features/rating/components/rate/core-rating-rate.html
@@ -1,4 +1,4 @@
-<ion-item class="ion-text-wrap" *ngIf="item && (item!.canrate || item!.rating !== null) && !disabled">
+<ion-item class="ion-text-wrap" *ngIf="item && (item!.canrate || item!.rating !== null) && !disabled" lines="none">
     <ion-select class="ion-text-start" [(ngModel)]="rating" (ngModelChange)="userRatingChanged()" interface="action-sheet"
         [cancelText]="'core.cancel' | translate" [disabled]="!item!.canrate" [interfaceOptions]="{header: 'core.rating.rating' | translate}"
         [label]="'core.rating.rating' | translate">
diff --git a/src/core/features/settings/pages/dev/dev.html b/src/core/features/settings/pages/dev/dev.html
index 3de3e2c67..8968e297d 100644
--- a/src/core/features/settings/pages/dev/dev.html
+++ b/src/core/features/settings/pages/dev/dev.html
@@ -17,13 +17,13 @@
 </ion-header>
 <ion-content>
     <ion-list class="list-item-limited-width">
-        <ion-item class="ion-text-wrap ion-no-validation">
+        <ion-item class="ion-text-wrap" lines="none">
             <ion-toggle [(ngModel)]="rtl" (ionChange)="RTLChanged()">
                 <p class="item-heading">Change text direction</p>
                 <p>{{ direction }}</p>
             </ion-toggle>
         </ion-item>
-        <ion-item class="ion-text-wrap ion-no-validation">
+        <ion-item class="ion-text-wrap" lines="none">
             <ion-toggle [(ngModel)]="forceSafeAreaMargins" (ionChange)="safeAreaChanged()">
                 <p class="item-heading">Force safe area margins</p>
             </ion-toggle>
@@ -34,13 +34,13 @@
             </ion-toggle>
         </ion-item>
         <ng-container *ngIf="siteId">
-            <ion-item class="ion-text-wrap ion-no-validation">
+            <ion-item class="ion-text-wrap" lines="none">
                 <ion-toggle [(ngModel)]="remoteStyles" (ionChange)="remoteStylesChanged()">
                     <p class="item-heading">Enable remote styles <ion-badge>{{remoteStylesCount}}</ion-badge>
                     </p>
                 </ion-toggle>
             </ion-item>
-            <ion-item class="ion-text-wrap ion-no-validation">
+            <ion-item class="ion-text-wrap" lines="none">
                 <ion-toggle [(ngModel)]="pluginStyles" (ionChange)="pluginStylesChanged()">
                     <p class="item-heading">Enable site plugin styles <ion-badge>{{pluginStylesCount}}</ion-badge>
                     </p>
diff --git a/src/core/features/settings/pages/general/general.html b/src/core/features/settings/pages/general/general.html
index bd5fc3828..b9e388bea 100644
--- a/src/core/features/settings/pages/general/general.html
+++ b/src/core/features/settings/pages/general/general.html
@@ -11,14 +11,14 @@
 </ion-header>
 <ion-content>
     <ion-list class="list-item-limited-width">
-        <ion-item class="ion-text-wrap ion-no-validation" lines="none">
+        <ion-item class="ion-text-wrap" lines="none">
             <ion-select [(ngModel)]="selectedLanguage" (ionChange)="languageChanged($event)" interface="action-sheet"
                 [cancelText]="'core.cancel' | translate" [interfaceOptions]="{header: 'core.settings.language' | translate}">
                 <div slot="label" class="item-heading ion-text-wrap">{{ 'core.settings.language' | translate }}</div>
                 <ion-select-option *ngFor="let entry of languages" [value]="entry.code">{{ entry.name }}</ion-select-option>
             </ion-select>
         </ion-item>
-        <ion-item class="ion-text-wrap core-settings-general-font-size item-interactive ion-no-validation" lines="none">
+        <ion-item class="ion-text-wrap core-settings-general-font-size item-interactive" lines="none">
             <ion-label>
                 <p class="item-heading ion-text-wrap">{{ 'core.settings.fontsize' | translate }}</p>
             </ion-label>
@@ -33,7 +33,7 @@
                 </ion-segment-button>
             </ion-segment>
         </ion-item>
-        <ion-item class="ion-text-wrap core-settings-general-color-scheme ion-no-validation" *ngIf="colorSchemes.length > 0" lines="none">
+        <ion-item class="ion-text-wrap core-settings-general-color-scheme" *ngIf="colorSchemes.length > 0" lines="none">
             <ion-select [(ngModel)]="selectedScheme" (ionChange)="colorSchemeChanged($event)" interface="action-sheet"
                 [cancelText]="'core.cancel' | translate" [disabled]="colorSchemeDisabled"
                 [interfaceOptions]="{header: 'core.settings.colorscheme' | translate}">
@@ -45,18 +45,18 @@
                     {{ 'core.settings.colorscheme-' + scheme | translate }}</ion-select-option>
             </ion-select>
         </ion-item>
-        <ion-item *ngIf="colorSchemes.length> 0 && selectedScheme==='system' && isAndroid" lines="none">
+        <ion-item *ngIf="colorSchemes.length > 0 && selectedScheme === 'system' && isAndroid" lines="none">
             <ion-label class="ion-text-wrap">
                 <p class="ion-text-wrap">{{ 'core.settings.colorscheme-system-notice' | translate }}</p>
             </ion-label>
         </ion-item>
-        <ion-item class="ion-no-validation">
+        <ion-item lines="none">
             <ion-toggle [(ngModel)]="richTextEditor" (ionChange)="richTextEditorChanged($event)">
                 <p class="item-heading ion-text-wrap">{{ 'core.settings.enablerichtexteditor' | translate }}</p>
                 <p class="ion-text-wrap">{{ 'core.settings.enablerichtexteditordescription' | translate }}</p>
             </ion-toggle>
         </ion-item>
-        <ion-item *ngIf="displayIframeHelp" class="ion-no-validation">
+        <ion-item *ngIf="displayIframeHelp" lines="none">
             <ion-label>
                 <p class="item-heading ion-text-wrap">{{ 'core.settings.ioscookies' | translate }}</p>
                 <p class="ion-text-wrap">{{ 'core.settings.ioscookiesdescription' | translate }}</p>
@@ -65,13 +65,13 @@
                 </ion-button>
             </ion-label>
         </ion-item>
-        <ion-item class="ion-no-validation">
+        <ion-item lines="none">
             <ion-toggle [(ngModel)]="debugDisplay" (ionChange)="debugDisplayChanged($event)">
                 <p class="item-heading ion-text-wrap">{{ 'core.settings.debugdisplay' | translate }}</p>
                 <p class="ion-text-wrap">{{ 'core.settings.debugdisplaydescription' | translate }}</p>
             </ion-toggle>
         </ion-item>
-        <ion-item *ngIf="analyticsAvailable" class="ion-no-validation">
+        <ion-item *ngIf="analyticsAvailable" lines="none">
             <ion-label>
                 <p class="item-heading ion-text-wrap">{{ 'core.settings.enableanalytics' | translate }}</p>
                 <p class="ion-text-wrap">{{ 'core.settings.enableanalyticsdescription' | translate }}</p>
diff --git a/src/core/features/settings/pages/index/index.html b/src/core/features/settings/pages/index/index.html
index 7b6374247..ec1f4111d 100644
--- a/src/core/features/settings/pages/index/index.html
+++ b/src/core/features/settings/pages/index/index.html
@@ -15,7 +15,9 @@
             <ion-item *ngFor="let section of sections.items" [attr.aria-current]="sections.getItemAriaCurrent(section)" button
                 [detail]="true" (click)="sections.select(section)">
                 <ion-icon [name]="section.icon" slot="start" aria-hidden="true" />
-                <ion-label>{{ section.name | translate }}</ion-label>
+                <ion-label class="ion-text-wrap">
+                    <p class="item-heading">{{ section.name | translate }}</p>
+                </ion-label>
             </ion-item>
         </ion-list>
     </core-split-view>
diff --git a/src/core/features/settings/pages/site/site.html b/src/core/features/settings/pages/site/site.html
index 100d21a13..c0a20a3a2 100644
--- a/src/core/features/settings/pages/site/site.html
+++ b/src/core/features/settings/pages/site/site.html
@@ -16,7 +16,7 @@
         </ion-refresher>
         <core-loading [hideUntil]="handlers.loaded">
             <ion-list>
-                <ion-item *ngFor="let handler of handlerItems" class="core-settings-handler ion-no-validation" [ngClass]="handler.class"
+                <ion-item *ngFor="let handler of handlerItems" class="core-settings-handler" lines="none" [ngClass]="handler.class"
                     [attr.aria-label]="handler.title | translate" (click)="!handler.toggle && handlers.select(handler)"
                     [button]="!handler.toggle" [detail]="!handler.toggle" [attr.aria-current]="handlers.getItemAriaCurrent(handler)">
                     <ion-icon [name]="handler.icon" slot="start" *ngIf="handler.icon" aria-hidden="true" />
diff --git a/src/core/features/settings/pages/synchronization/synchronization.html b/src/core/features/settings/pages/synchronization/synchronization.html
index 30718da96..b83e6cde3 100644
--- a/src/core/features/settings/pages/synchronization/synchronization.html
+++ b/src/core/features/settings/pages/synchronization/synchronization.html
@@ -23,7 +23,7 @@
                     <h2>{{ 'core.settings.syncsettings' | translate }}</h2>
                 </ion-label>
             </ion-item-divider>
-            <ion-item class="ion-text-wrap ion-no-validation">
+            <ion-item class="ion-text-wrap" lines="none">
                 <ion-toggle [(ngModel)]="dataSaver" (ngModelChange)="syncOnlyOnWifiChanged()">
                     {{ 'core.settings.syncdatasaver' | translate }}
                 </ion-toggle>
diff --git a/src/theme/components/ion-item.scss b/src/theme/components/ion-item.scss
index 069efcb74..de14fcc43 100644
--- a/src/theme/components/ion-item.scss
+++ b/src/theme/components/ion-item.scss
@@ -13,15 +13,18 @@ ion-item.item {
     }
 
     &.item-lines-default {
+        /** Remove lines by default */
         --inner-border-width: 0px;
         --border-width: 0px;
     }
 
     &.ion-valid,
     &.ion-invalid {
-        --inner-border-width: 0 0 1px 0;
+        &.item-lines-default {
+            --border-width: 0 0 1px 0;
+        }
 
-        &.ion-touched:not(.ion-no-validation) {
+        &.ion-touched {
             &.ion-invalid {
                 --ion-item-border-color: var(--highlight-color-invalid);
                 --highlight-background: var(--ion-item-border-color);
@@ -35,10 +38,6 @@ ion-item.item {
         }
     }
 
-    &.ion-no-validation {
-        --inner-border-width: 0 0 1px 0;
-    }
-
     // Hide details on items to align badges.
     &.hide-detail {
         --detail-icon-opacity: 0;
@@ -185,7 +184,9 @@ ion-item .in-item {
 .item > ion-label,
 .fake-ion-item,
 .item.ion-text-wrap > ion-checkbox::part(label),
-ion-checkbox.ion-text-wrap::part(label) {
+ion-checkbox.ion-text-wrap::part(label)
+.item.ion-text-wrap ion-toggle::part(label),
+ion-toggle.ion-text-wrap::part(label) {
     core-format-text,
     core-format-text > *:not(pre) {
         white-space: nowrap;
@@ -198,7 +199,8 @@ ion-checkbox.ion-text-wrap::part(label) {
 ion-item > .in-item,
 .fake-ion-item.ion-text-wrap,
 .item.ion-text-wrap > ion-checkbox::part(label),
-ion-checkbox.ion-text-wrap::part(label) {
+ion-checkbox.ion-text-wrap::part(label),
+ion-toggle.ion-text-wrap::part(label) {
     core-format-text,
     core-format-text > *:not(pre) {
         white-space: normal;
@@ -210,7 +212,9 @@ ion-checkbox.ion-text-wrap::part(label) {
 .item.ion-text-wrap ion-checkbox::part(label),
 ion-checkbox.ion-text-wrap::part(label),
 .item.ion-text-wrap ion-radio::part(label),
-ion-radio.ion-text-wrap::part(label) {
+ion-radio.ion-text-wrap::part(label),
+.item.ion-text-wrap ion-toggle::part(label),
+ion-toggle.ion-text-wrap::part(label) {
     white-space: normal !important;
 }