survey-core 1.9.101 → 1.9.103

package/defaultV2.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.101
+ * surveyjs - Survey JavaScript library v1.9.103
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -470,6 +470,7 @@ sv-popup {
 
 .sv-popup__container {
   box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
+  border-radius: calc(1 * var(--sjs-corner-radius, 4px));
   position: absolute;
   padding: 0;
 }
@@ -477,7 +478,7 @@ sv-popup {
 .sv-popup__shadow {
   width: 100%;
   height: 100%;
-  border-radius: calc(2 * var(--sjs-corner-radius, 4px));
+  border-radius: calc(1 * var(--sjs-corner-radius, 4px));
 }
 
 .sv-popup__body-content {
@@ -1122,8 +1123,8 @@ sv-popup {
   text-overflow: ellipsis;
   white-space: nowrap;
   color: var(--sjs-general-forecolor, var(--foreground, #161616));
-  font-size: calc(1 * var(--sjs-font-size, 16px));
-  line-height: calc(1.5 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   margin: 0 calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
@@ -1388,6 +1389,7 @@ sv-popup {
 
 .sv-list__item-icon {
   float: left;
+  flex-shrink: 0;
   width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
   height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
@@ -1863,7 +1865,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 }
 
 .sd-question__erbox--above-question {
-  border-radius: calc(1 * var(--sjs-corner-radius, 4px)) calc(1 * var(--sjs-corner-radius, 4px)) 0 0;
   margin-bottom: calc(var(--sd-base-vertical-padding) - var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
@@ -1871,6 +1872,10 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
+.sd-element--with-frame > .sd-question__erbox--above-question {
+  border-radius: calc(1 * var(--sjs-corner-radius, 4px)) calc(1 * var(--sjs-corner-radius, 4px)) 0 0;
+}
+
 .sd-element--with-frame > .sd-question__erbox--below-question {
   position: relative;
   margin-top: 0;
@@ -1990,8 +1995,8 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   gap: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   justify-content: center;
   min-height: calc(24 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  line-height: calc(1.5 * var(--sjs-font-size, 16px));
-  font-size: calc(1 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 .sd-question__placeholder > div .sv-string-viewer, .sd-question__placeholder > span .sv-string-viewer {
@@ -2153,12 +2158,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   position: relative;
 }
 
-.sd-panel.sd-panel--as-page {
-  margin-top: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
-}
-.sd-panel.sd-panel--as-page > .sd-panel__content {
-  padding-top: 0;
-}
 .sd-panel.sd-panel--as-page > .sd-panel__header.sd-panel__header {
   padding-top: 0;
   padding-bottom: 0;
@@ -2189,7 +2188,13 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   color: var(--sjs-font-pagedescription-color, var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45)));
   position: static;
   line-height: calc(1.5 * var(--sjs-font-pagedescription-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
-  margin: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0px;
+  margin: 0 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
+}
+.sd-panel.sd-panel--as-page .sd-panel__header + .sd-panel__content {
+  margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sd-panel.sd-panel--as-page > .sd-panel__content {
+  padding-top: 0;
 }
 
 .sd-row ~ .sd-row .sd-panel--as-page {
@@ -2217,6 +2222,8 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 
 .sjs_sp_placeholder {
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
 }
 
 .sjs_sp_container {
@@ -2366,13 +2373,30 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 
 .sd-table__cell {
   font-weight: normal;
-  font-size: calc(1 * var(--sjs-font-size, 16px));
-  line-height: calc(1.5 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
   color: var(--sjs-general-forecolor, var(--foreground, #161616));
   text-align: center;
 }
 
+.sd-table__cell--error {
+  padding: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sd-table__cell--error .sd-question__erbox--outside-question {
+  margin: 0;
+}
+
+.sd-table__cell--error-top {
+  vertical-align: bottom;
+  padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+
+.sd-table__cell--error-bottom {
+  vertical-align: top;
+  padding-bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+
 .sd-table__cell--item .sd-selectbase__item {
   text-align: center;
 }
@@ -2388,6 +2412,17 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   opacity: 1;
 }
 
+.sd-table__cell--header .sv-vue-title-additional-div,
+.sd-table__cell--header {
+  font-size: 0;
+  line-height: 0;
+}
+
+.sd-table__cell--header span {
+  font-size: calc(1 * var(--sjs-font-size, 16px));
+  line-height: calc(1.5 * var(--sjs-font-size, 16px));
+}
+
 .sd-table__cell--header {
   font-weight: 600;
   vertical-align: top;
@@ -2567,27 +2602,20 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   margin: auto;
 }
 
-.sd-body--responsive .sd-page {
-  padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) var(--sd-page-vertical-padding) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
-}
-.sd-body--responsive .sd-page.sd-page__empty-header {
-  padding-top: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
-}
-
-.sd-root-modern--mobile .sd-page {
-  padding-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
-}
-
 .sd-page {
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
-  padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding: 0 calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   width: 100%;
   box-sizing: border-box;
 }
 
+.sd-root-modern--mobile .sd-page {
+  padding: 0;
+}
+
 .sd-page .sd-page__title {
   font-family: var(--sjs-font-pagetitle-family, var(--font-family));
   font-weight: var(--sjs-font-pagetitle-weight, 700);
@@ -2596,6 +2624,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   position: static;
   line-height: calc(1.33 * var(--sjs-font-pagetitle-size, calc(1.5 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   margin: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0px;
+  margin-top: 0;
 }
 
 .sd-page .sd-page__description {
@@ -2605,7 +2634,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   color: var(--sjs-font-pagedescription-color, var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45)));
   position: static;
   line-height: calc(1.5 * var(--sjs-font-pagedescription-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
-  margin: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0px;
+  margin: 0 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
 }
 
 .sd-row {
@@ -2616,14 +2645,22 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   margin-top: var(--sd-base-vertical-padding);
 }
 
+.sd-row.sd-page__row {
+  margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+
+.sd-page__row.sd-row--compact {
+  margin-top: var(--sd-base-vertical-padding);
+}
+
 .sd-row:first-of-type {
   margin-top: 0;
 }
 
-.sd-row.sd-page__row {
+.sd-page__title ~ .sd-row.sd-page__row {
   margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
-.sd-row.sd-page__row.sd-row--compact {
+.sd-page__title ~ .sd-row.sd-page__row.sd-row--compact {
   margin-top: var(--sd-base-vertical-padding);
 }
 
@@ -2721,10 +2758,10 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 
 .sd-root-modern .sd-container-modern__title .sd-header__text h3 {
   margin: 0;
-  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 .sd-root-modern .sd-container-modern__title .sd-description {
   margin: 0;
+  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 
 .sd-title .sv-title-actions {
@@ -2757,7 +2794,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   font-style: normal;
   font-family: var(--sjs-font-questiondescription-family, var(--font-family));
   font-weight: var(--sjs-font-questiondescription-weight, 400);
-  color: var(--sjs-font-questiondescription-color, var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45)));
+  color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
   font-size: var(--sjs-font-questiondescription-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
   line-height: calc(1.5 * var(--sjs-font-questiondescription-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   white-space: normal;
@@ -2813,7 +2850,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 .sd-item__control-label {
   font-family: var(--sjs-font-editorfont-family, var(--font-family));
   font-style: normal;
-  font-weight: normal;
+  font-weight: var(--sjs-font-editorfont-weight, 400);
   line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
   color: var(--sjs-font-editorfont-color, var(--sjs-general-forecolor, rgba(0, 0, 0, 0.91)));
@@ -3005,7 +3042,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 
 .sd-rating__item {
   position: relative;
-  background: transparent;
+  background: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
   box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
   border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   white-space: nowrap;
@@ -3474,6 +3511,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sv-tagbox__item {
   position: relative;
   display: flex;
+  align-items: center;
   padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
   border-radius: calc(0.5 * var(--sjs-corner-radius, 4px));
@@ -3670,8 +3708,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 
 .sd-imagepicker__text {
-  font-size: calc(1 * var(--sjs-font-size, 16px));
-  line-height: calc(1.5 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
   color: var(--sjs-general-forecolor, var(--foreground, #161616));
 }
@@ -3811,6 +3849,14 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
+.sd-boolean.sd-boolean--checked .sd-boolean__label--true,
+.sd-boolean:not(.sd-boolean--checked):not(sd-boolean--indeterminate) .sd-boolean__label--false {
+  color: transparent;
+  transition-duration: 0.15s;
+  transition-property: color;
+  transition-timing-function: linear;
+}
+
 .sd-boolean.sd-boolean--indeterminate .sd-boolean__switch {
   display: none;
 }
@@ -3948,7 +3994,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 
 .sd-paneldynamic__progress-text {
-  font-size: calc(1 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
   margin: 0;
   margin-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
@@ -4036,7 +4083,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   background-color: transparent;
   cursor: pointer;
   font-family: var(--font-family, var(--font-family));
-  font-size: calc(1 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
   overflow-x: hidden;
   white-space: nowrap;
@@ -4158,6 +4206,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   word-break: break-word;
   white-space: normal;
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
 }
 
 .sd-file__choose-btn--text {
@@ -4343,6 +4393,15 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 
 .sd-body__navigation .sd-btn {
   padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  font-size: var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
+}
+
+.sd-root--compact .sd-body__navigation .sd-btn:not(.sd-btn--action) {
+  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
+}
+.sd-root--compact .sd-body__navigation .sd-btn:not(.sd-btn--action):hover {
+  background-color: var(--sjs-editorpanel-hovercolor, var(--sjs-general-backcolor-dim-dark, rgb(243, 243, 243)));
 }
 
 .sd-root-modern--mobile .sd-body__navigation .sv-action:not(.sv-action--hidden),
@@ -4417,9 +4476,11 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   box-sizing: border-box;
 }
 .sd-body.sd-body--static {
-  max-width: calc(84 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  max-width: calc(90 * var(--sjs-base-unit, var(--base-unit, 8px)));
   margin-left: auto;
   margin-right: auto;
+  padding-top: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-bottom: calc(10 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 .sd-body.sd-body--static .sd-body__timer,
 .sd-body.sd-body--static .sd-body__navigation,
@@ -4427,15 +4488,33 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   margin-left: 0;
   margin-right: 0;
 }
+.sd-body.sd-body--static .sd-body__navigation {
+  padding-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sd-body.sd-body--static .sd-body__navigation.sd-action-bar {
+  padding-left: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-right: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
 .sd-body.sd-body--responsive {
   max-width: initial;
+  padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  box-sizing: border-box;
+}
+.sd-body.sd-body--responsive .sd-page {
+  padding: 0;
+}
+.sd-body.sd-body--responsive .sd-page.sd-page__empty-header {
+  padding-top: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 .sd-body.sd-body--responsive .sd-body__timer,
 .sd-body.sd-body--responsive .sd-body__navigation {
-  padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) var(--sd-page-vertical-padding);
+  padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
+}
+.sd-body.sd-body--responsive .sd-body__navigation {
+  padding-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 .sd-body.sd-body--responsive.sd-body--with-timer {
-  max-width: calc(100% + var(--sd-timer-size) * ( -1 - 64 / 144 ) + 6 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  max-width: calc(100% + var(--sd-timer-size) * (-1 - 64 / 144) + 6 * var(--sjs-base-unit, var(--base-unit, 8px)));
   margin-left: auto;
   margin-right: auto;
 }
@@ -4445,6 +4524,14 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   margin-left: 0;
   margin-right: 0;
 }
+.sd-root-modern--mobile .sd-body.sd-body--responsive, .sd-root-modern--mobile .sd-body.sd-body--static {
+  padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sd-root-modern--mobile .sd-body.sd-body--responsive .sd-body__navigation, .sd-root-modern--mobile .sd-body.sd-body--static .sd-body__navigation {
+  padding-left: 0;
+  padding-right: 0;
+  padding-bottom: 0;
+}
 
 .sd-body__navigation.sd-action-bar {
   box-sizing: border-box;
@@ -4471,6 +4558,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 
 .sd-root_background-image {
+  background-position-x: center;
   position: absolute;
   top: 0;
   bottom: 0;
@@ -4565,8 +4653,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   font-weight: 600;
   font-family: var(--font-family, var(--font-family));
   font-style: normal;
-  font-size: calc(1 * var(--sjs-font-size, 16px));
-  line-height: calc(1.5 * var(--sjs-font-size, 16px));
+  font-size: var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
+  line-height: calc(1.5 * var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
   outline: none;
 }
 
@@ -5069,10 +5157,14 @@ sv-components-container,
   padding-bottom: 0;
   text-align: left;
 }
-.sd-root-modern.sd-root-modern--mobile .sd-table__cell:not(.sd-matrix__cell):not(:first-of-type) {
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell {
   margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
-.sd-root-modern.sd-root-modern--mobile .sd-table__cell:not(.sd-matrix__cell):not(.sd-table__cell--actions):not(.sd-table__cell--row-text)::before {
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell:first-of-type,
+.sd-root-modern.sd-root-modern--mobile .sd-matrix__cell {
+  margin-top: 0;
+}
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell::before {
   padding-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
   padding-bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
   content: attr(data-responsive-title);
@@ -5080,6 +5172,12 @@ sv-components-container,
   display: block;
   text-align: left;
 }
+.sd-root-modern.sd-root-modern--mobile .sd-matrix__cell::before,
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell--actions::before,
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell--row-text::before,
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell--error::before {
+  content: none;
+}
 .sd-root-modern.sd-root-modern--mobile .sd-table__cell.sd-table__cell--actions {
   width: auto;
 }
@@ -5115,6 +5213,19 @@ sv-components-container,
 .sd-root-modern.sd-root-modern--mobile .sd-matrixdropdown.sd-table tr:last-child:after {
   content: none;
 }
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell.sd-table__cell--error-top {
+  margin-top: 0;
+}
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell--error-top:first-of-type ~ .sd-table__cell:nth-of-type(2) {
+  margin-top: 0;
+}
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell--error-top .sd-question__erbox {
+  margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  margin-bottom: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sd-root-modern.sd-root-modern--mobile .sd-table__cell--error-top:first-of-type .sd-question__erbox {
+  margin-bottom: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
 .sd-root-modern.sd-root-modern--mobile .sv-ranking-item__icon-container {
   margin-left: 0;
   margin-right: 0;
@@ -5160,10 +5271,6 @@ body {
   background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 
-.sd-container-modern {
-  margin-bottom: calc(10 * var(--sjs-base-unit, var(--base-unit, 8px)));
-}
-
 .sd-root-modern--mobile {
   --sd-timer-size: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }