@simplybusiness/theme-simplybusiness 0.4.1 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,34 @@
1
1
  # @simplybusiness/theme-simplybusiness
2
2
 
3
+ ## 0.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 12a7443: Add `CoverageSummary` component
8
+
9
+ ### Patch Changes
10
+
11
+ - 3f02903: Upgrade dependencies
12
+ - af09896: Update CSS imports to not import from outside their own package directory
13
+ - Updated dependencies [3f02903]
14
+ - Updated dependencies [00fe4f6]
15
+ - Updated dependencies [e166ef7]
16
+ - Updated dependencies [2973f98]
17
+ - Updated dependencies [7c79f01]
18
+ - Updated dependencies [61d44d8]
19
+ - Updated dependencies [77ff096]
20
+ - Updated dependencies [63a5682]
21
+ - Updated dependencies [0249d06]
22
+ - Updated dependencies [af09896]
23
+ - Updated dependencies [3d1f7b8]
24
+ - Updated dependencies [9c886ca]
25
+ - Updated dependencies [12a7443]
26
+ - Updated dependencies [ffb1bbe]
27
+ - @simplybusiness/mobius-datepicker@6.0.5
28
+ - @simplybusiness/mobius-journey@6.5.0
29
+ - @simplybusiness/theme-core@7.1.3
30
+ - @simplybusiness/mobius@5.2.0
31
+
3
32
  ## 0.4.1
4
33
 
5
34
  ### Patch Changes
package/dist/index.css CHANGED
@@ -40,17 +40,25 @@
40
40
  text-decoration:underline;
41
41
  text-underline-offset:6px;
42
42
  }
43
- .mobius-accordion__link:hover,
44
- .mobius-accordion__link:active{
43
+ .mobius-accordion__link:hover,.mobius-accordion__link:active{
45
44
  color:var(--color-secondary-hover);
46
45
  }
47
46
  .mobius-accordion__link:focus-visible{
48
47
  outline:none;
49
48
  box-shadow:var(--box-shadow-default);
50
49
  }
50
+ h1.mobius-accordion__link-text,
51
+ h2.mobius-accordion__link-text,
52
+ h3.mobius-accordion__link-text,
53
+ h4.mobius-accordion__link-text,
54
+ h5.mobius-accordion__link-text,
55
+ h6.mobius-accordion__link-text,
51
56
  .mobius-accordion__link-text{
57
+ margin:0;
52
58
  margin-right:var(--size-xs);
53
59
  line-height:var(--line-height-normal);
60
+ font-size:var(--font-size-regular);
61
+ font-weight:var(--font-weight-normal);
54
62
  }
55
63
  .mobius-accordion__link-icon{
56
64
  transition:transform var(--transition-duration);
@@ -119,8 +127,7 @@
119
127
  padding:0;
120
128
  flex-wrap:wrap;
121
129
  }
122
- .mobius-breadcrumb ul,
123
- .mobius-breadcrumb ol{
130
+ .mobius-breadcrumb ul,.mobius-breadcrumb ol{
124
131
  box-sizing:border-box;
125
132
  display:flex;
126
133
  align-items:center;
@@ -188,8 +195,7 @@
188
195
  --button-variant-primary-font-variation-settings
189
196
  );
190
197
  }
191
- .mobius-button:where(.--variant-primary):where(:active),
192
- .mobius-button:where(.--variant-primary):where(:hover){
198
+ .mobius-button:where(.--variant-primary):where(:active),.mobius-button:where(.--variant-primary):where(:hover){
193
199
  background-color:var(--button-variant-primary-hover-color);
194
200
  }
195
201
  .mobius-button:where(.--variant-primary):where(:focus-visible){
@@ -205,8 +211,7 @@
205
211
  background-color:transparent;
206
212
  border-color:var(--color-secondary);
207
213
  }
208
- .mobius-button:where(.--variant-secondary):where(:active),
209
- .mobius-button:where(.--variant-secondary):where(:hover){
214
+ .mobius-button:where(.--variant-secondary):where(:active),.mobius-button:where(.--variant-secondary):where(:hover){
210
215
  --button-content-color:var(--color-text-inverted);
211
216
  background-color:var(--color-secondary-hover);
212
217
  border-color:var(--color-secondary-hover);
@@ -264,7 +269,7 @@
264
269
  border-color:var(--color-valid);
265
270
  color:transparent;
266
271
  }
267
- .mobius-button:where(.--is-success) > :not(.mobius-button__icon-wrapper){
272
+ .mobius-button:where(.--is-success) > :not(.mobius-button__icon-wrapper){
268
273
  opacity:0;
269
274
  visibility:hidden;
270
275
  }
@@ -290,7 +295,7 @@
290
295
  .mobius-button:where(.--is-loading){
291
296
  color:transparent;
292
297
  }
293
- .mobius-button:where(.--is-loading) > :not(.mobius-button__icon-wrapper){
298
+ .mobius-button:where(.--is-loading) > :not(.mobius-button__icon-wrapper){
294
299
  opacity:0;
295
300
  visibility:hidden;
296
301
  }
@@ -310,8 +315,7 @@
310
315
  -webkit-text-decoration:underline;
311
316
  text-decoration:underline;
312
317
  }
313
- .mobius-button:where(.--variant-link):hover,
314
- .mobius-button:where(.--variant-link):active{
318
+ .mobius-button:where(.--variant-link):hover,.mobius-button:where(.--variant-link):active{
315
319
  --button-content-color:var(--color-secondary-hover);
316
320
  cursor:pointer;
317
321
  }
@@ -400,8 +404,7 @@ a.mobius-button:focus-visible,
400
404
  border-color:var(--color-error);
401
405
  color:var(--color-error);
402
406
  }
403
- .mobius-checkbox__label.--is-invalid:not(.--is-disabled):hover,
404
- .mobius-checkbox__label.--is-invalid:not(.--is-disabled):focus-within{
407
+ .mobius-checkbox__label.--is-invalid:not(.--is-disabled):hover,.mobius-checkbox__label.--is-invalid:not(.--is-disabled):focus-within{
405
408
  background-color:var(--color-error-background);
406
409
  }
407
410
  .mobius-checkbox__label.--is-invalid:not(.--is-disabled) .mobius-checkbox__icon{
@@ -429,8 +432,7 @@ a.mobius-button:focus-visible,
429
432
  display:grid;
430
433
  margin-bottom:var(--size-sm);
431
434
  }
432
- .mobius-checkbox-group .mobius-checkbox,
433
- .mobius-checkbox-group .mobius-checkbox-group__wrapper{
435
+ .mobius-checkbox-group .mobius-checkbox,.mobius-checkbox-group .mobius-checkbox-group__wrapper{
434
436
  margin-bottom:0;
435
437
  }
436
438
  .mobius-checkbox-group.--is-horizontal .mobius-checkbox-group__wrapper{
@@ -505,7 +507,7 @@ a.mobius-button:focus-visible,
505
507
  opacity:0;
506
508
  transition:opacity var(--drawer-transition-duration) ease-in-out;
507
509
  }
508
- .mobius-drawer + .backdrop{
510
+ .mobius-drawer + .backdrop{
509
511
  position:fixed;
510
512
  top:0;
511
513
  right:0;
@@ -514,23 +516,21 @@ a.mobius-button:focus-visible,
514
516
  background-color:var(--color-neutral-700);
515
517
  opacity:0.3;
516
518
  }
517
- :is(.mobius-drawer + .backdrop) + ._dialog_overlay{
519
+ :is(.mobius-drawer + .backdrop) + ._dialog_overlay{
518
520
  position:fixed;
519
521
  top:0;
520
522
  right:0;
521
523
  bottom:0;
522
524
  left:0;
523
525
  }
524
- .mobius-drawer.--top,
525
- .mobius-drawer.--bottom{
526
+ .mobius-drawer.--top,.mobius-drawer.--bottom{
526
527
  width:100vw;
527
528
  max-width:100vw;
528
529
  height:var(--drawer-height);
529
530
  max-height:var(--drawer-height);
530
531
  transition:transform var(--drawer-transition-duration) ease-in-out;
531
532
  }
532
- .mobius-drawer.--left,
533
- .mobius-drawer.--right{
533
+ .mobius-drawer.--left,.mobius-drawer.--right{
534
534
  bottom:0;
535
535
  width:100%;
536
536
  max-width:var(--drawer-width);
@@ -758,8 +758,7 @@ a.mobius-button:focus-visible,
758
758
  outline:none;
759
759
  border-radius:var(--radius-1);
760
760
  }
761
- .mobius-link:hover,
762
- .mobius-link:active{
761
+ .mobius-link:hover,.mobius-link:active{
763
762
  -webkit-text-decoration:underline;
764
763
  -webkit-text-decoration:underline;
765
764
  text-decoration:underline;
@@ -867,7 +866,7 @@ a.mobius-button:focus-visible,
867
866
  opacity:0;
868
867
  transition:opacity var(--modal-transition-duration) ease-in-out;
869
868
  }
870
- .mobius-modal + .backdrop{
869
+ .mobius-modal + .backdrop{
871
870
  position:fixed;
872
871
  top:0;
873
872
  right:0;
@@ -876,7 +875,7 @@ a.mobius-button:focus-visible,
876
875
  background-color:var(--color-neutral-700);
877
876
  opacity:0.3;
878
877
  }
879
- :is(.mobius-modal + .backdrop) + ._dialog_overlay{
878
+ :is(.mobius-modal + .backdrop) + ._dialog_overlay{
880
879
  position:fixed;
881
880
  top:0;
882
881
  right:0;
@@ -1037,11 +1036,11 @@ a.mobius-button:focus-visible,
1037
1036
  transition:var(--transition-standard);
1038
1037
  user-select:none;
1039
1038
  }
1040
- .mobius-password-field :where(.mobius-password-field__show-button):focus-visible{
1039
+ :is(.mobius-password-field :where(.mobius-password-field__show-button)):focus-visible{
1041
1040
  box-shadow:var(--box-shadow-default);
1042
1041
  outline:none;
1043
1042
  }
1044
- .mobius-password-field :where(.mobius-password-field__show-button):hover{
1043
+ :is(.mobius-password-field :where(.mobius-password-field__show-button)):hover{
1045
1044
  background-color:var(--color-background-highlight);
1046
1045
  }
1047
1046
  .mobius-popover__container{
@@ -1186,7 +1185,7 @@ a.mobius-button:focus-visible,
1186
1185
  .mobius-radio__label.--is-selected:not(.--is-invalid .mobius-radio__label):not(.--is-disabled) .mobius-radio__input{
1187
1186
  outline-color:var(--color-primary-light);
1188
1187
  }
1189
- .mobius-radio__label.--is-selected:not(.--is-invalid .mobius-radio__label):not(.--is-disabled) .mobius-radio__input:checked::after{
1188
+ :is(.mobius-radio__label.--is-selected:not(.--is-invalid .mobius-radio__label):not(.--is-disabled) .mobius-radio__input):checked::after{
1190
1189
  background-color:var(--color-primary-light);
1191
1190
  }
1192
1191
  .mobius-radio__label:hover:not(.--is-disabled):not(.--is-invalid .mobius-radio__label){
@@ -1196,7 +1195,7 @@ a.mobius-button:focus-visible,
1196
1195
  .mobius-radio__label:hover:not(.--is-disabled):not(.--is-invalid .mobius-radio__label) .mobius-radio__input{
1197
1196
  outline-color:var(--color-primary);
1198
1197
  }
1199
- .mobius-radio__label:hover:not(.--is-disabled):not(.--is-invalid .mobius-radio__label) .mobius-radio__input:checked::after{
1198
+ :is(.mobius-radio__label:hover:not(.--is-disabled):not(.--is-invalid .mobius-radio__label) .mobius-radio__input):checked::after{
1200
1199
  background-color:var(--color-primary);
1201
1200
  }
1202
1201
  .mobius-radio__label:focus-within:not(.--is-disabled){
@@ -1209,7 +1208,7 @@ a.mobius-button:focus-visible,
1209
1208
  .mobius-radio__label:focus-within:not(.--is-disabled):not(.--is-invalid .mobius-radio__label:focus-within:not(.--is-disabled)) .mobius-radio__input{
1210
1209
  outline-color:var(--color-primary);
1211
1210
  }
1212
- .mobius-radio__label:focus-within:not(.--is-disabled):not(.--is-invalid .mobius-radio__label:focus-within:not(.--is-disabled)) .mobius-radio__input:checked::after{
1211
+ :is(.mobius-radio__label:focus-within:not(.--is-disabled):not(.--is-invalid .mobius-radio__label:focus-within:not(.--is-disabled)) .mobius-radio__input):checked::after{
1213
1212
  background-color:var(--color-primary);
1214
1213
  }
1215
1214
  .mobius-radio__label.--is-multiline{
@@ -1219,15 +1218,14 @@ a.mobius-button:focus-visible,
1219
1218
  border-color:var(--color-error);
1220
1219
  color:var(--color-error);
1221
1220
  }
1222
- .--is-invalid .mobius-radio__label:not(.--is-disabled):hover,
1223
- .--is-invalid .mobius-radio__label:not(.--is-disabled):focus-within{
1221
+ :is(.--is-invalid .mobius-radio__label:not(.--is-disabled)):hover,:is(.--is-invalid .mobius-radio__label:not(.--is-disabled)):focus-within{
1224
1222
  border-color:var(--color-error);
1225
1223
  background-color:var(--color-error-background);
1226
1224
  }
1227
- .--is-invalid .mobius-radio__label:not(.--is-disabled) .mobius-radio__input{
1225
+ :is(.--is-invalid .mobius-radio__label:not(.--is-disabled)) .mobius-radio__input{
1228
1226
  outline-color:var(--color-error);
1229
1227
  }
1230
- .--is-invalid .mobius-radio__label:not(.--is-disabled) .mobius-radio__input:checked::after{
1228
+ :is(:is(.--is-invalid .mobius-radio__label:not(.--is-disabled)) .mobius-radio__input):checked::after{
1231
1229
  background-color:var(--color-error);
1232
1230
  }
1233
1231
  .mobius-radio__content{
@@ -1257,54 +1255,46 @@ a.mobius-button:focus-visible,
1257
1255
  .mobius-segment-group.--is-horizontal{
1258
1256
  flex-direction:row;
1259
1257
  }
1260
- .mobius-segment-group .mobius-segment-group.gap-size-xs,
1261
- .mobius-segment-group.gap-size-xs{
1258
+ .mobius-segment-group .mobius-segment-group.gap-size-xs,.mobius-segment-group.gap-size-xs{
1262
1259
  margin:var(--size-xs);
1263
1260
  }
1264
- .mobius-segment-group .mobius-segment-group.gap-size-s,
1265
- .mobius-segment-group.gap-size-s{
1261
+ .mobius-segment-group .mobius-segment-group.gap-size-s,.mobius-segment-group.gap-size-s{
1266
1262
  margin:var(--size-sm);
1267
1263
  }
1268
- .mobius-segment-group .mobius-segment-group.gap-size-m,
1269
- .mobius-segment-group.gap-size-m{
1264
+ .mobius-segment-group .mobius-segment-group.gap-size-m,.mobius-segment-group.gap-size-m{
1270
1265
  margin:var(--size-md);
1271
1266
  }
1272
- .mobius-segment-group .mobius-segment-group.gap-size-l,
1273
- .mobius-segment-group.gap-size-l{
1267
+ .mobius-segment-group .mobius-segment-group.gap-size-l,.mobius-segment-group.gap-size-l{
1274
1268
  margin:var(--size-lm);
1275
1269
  }
1276
- .mobius-segment-group .mobius-segment-group.gap-size-xl,
1277
- .mobius-segment-group.gap-size-xl{
1270
+ .mobius-segment-group .mobius-segment-group.gap-size-xl,.mobius-segment-group.gap-size-xl{
1278
1271
  margin:var(--size-xl);
1279
1272
  }
1280
- .mobius-segment-group .mobius-segment-group.gap-size-xxl,
1281
- .mobius-segment-group.gap-size-xxl{
1273
+ .mobius-segment-group .mobius-segment-group.gap-size-xxl,.mobius-segment-group.gap-size-xxl{
1282
1274
  margin:var(--size-xxl);
1283
1275
  }
1284
1276
  .mobius-segment-group > .mobius-segment{
1285
1277
  border:none;
1286
1278
  border-top:var(--segment-border);
1287
1279
  }
1288
- .mobius-segment-group:not(.--is-horizontal) > .mobius-segment:first-child{
1280
+ :is(.mobius-segment-group:not(.--is-horizontal) > .mobius-segment):first-child{
1289
1281
  border-top:none;
1290
1282
  border-radius:var(--radius-2);
1291
1283
  }
1292
- .mobius-segment-group:not(.--is-horizontal) > .mobius-segment:not(:first-child):not(:last-child){
1284
+ :is(.mobius-segment-group:not(.--is-horizontal) > .mobius-segment):not(:first-child):not(:last-child){
1293
1285
  border-radius:0;
1294
1286
  border-bottom:0;
1295
1287
  }
1296
- .mobius-segment-group:not(.--is-horizontal) > .mobius-segment:last-child{
1288
+ :is(.mobius-segment-group:not(.--is-horizontal) > .mobius-segment):last-child{
1297
1289
  border-top-left-radius:0;
1298
1290
  border-top-right-radius:0;
1299
1291
  }
1300
- .mobius-segment-group.--is-horizontal > .mobius-segment,
1301
- .mobius-segment-group.--is-horizontal > .mobius-segment-group{
1292
+ .mobius-segment-group.--is-horizontal > .mobius-segment,.mobius-segment-group.--is-horizontal > .mobius-segment-group{
1302
1293
  border:none;
1303
1294
  border-radius:0;
1304
1295
  border-left:var(--segment-border);
1305
1296
  }
1306
- .mobius-segment-group.--is-horizontal > .mobius-segment:first-child,
1307
- .mobius-segment-group.--is-horizontal > .mobius-segment-group:first-child{
1297
+ .mobius-segment-group.--is-horizontal > .mobius-segment:first-child,.mobius-segment-group.--is-horizontal > .mobius-segment-group:first-child{
1308
1298
  border-left:0;
1309
1299
  border-top-right-radius:0;
1310
1300
  border-bottom-right-radius:0;
@@ -1323,15 +1313,13 @@ a.mobius-button:focus-visible,
1323
1313
  margin-bottom:0;
1324
1314
  flex:1;
1325
1315
  }
1326
- .mobius-segment-group .mobius-segment-group > .mobius-segment-group.--is-horizontal{
1316
+ :is(.mobius-segment-group .mobius-segment-group) > .mobius-segment-group.--is-horizontal{
1327
1317
  border-radius:0;
1328
1318
  border:0;
1329
1319
  border-top:var(--segment-border);
1330
1320
  margin:0;
1331
1321
  }
1332
- .mobius-segment-group .mobius-segment-group:not(.--is-horizontal)
1333
- > .mobius-segment-group:not(.--is-horizontal)
1334
- .mobius-segment:first-child{
1322
+ :is(.mobius-segment-group .mobius-segment-group):not(.--is-horizontal) > .mobius-segment-group:not(.--is-horizontal) .mobius-segment:first-child{
1335
1323
  border-top:var(--segment-border);
1336
1324
  }
1337
1325
  .mobius-segment{
@@ -1344,25 +1332,17 @@ a.mobius-button:focus-visible,
1344
1332
  border-radius:var(--radius-2);
1345
1333
  padding:var(--size-sm);
1346
1334
  }
1347
- .mobius-segment .mobius-text,
1348
- .mobius-segment .mobius-text.--is-h1,
1349
- .mobius-segment .mobius-text.--is-h2,
1350
- .mobius-segment .mobius-text.--is-h3,
1351
- .mobius-segment .mobius-text.--is-h4{
1335
+ .mobius-segment .mobius-text,.mobius-segment .mobius-text.--is-h1,.mobius-segment .mobius-text.--is-h2,.mobius-segment .mobius-text.--is-h3,.mobius-segment .mobius-text.--is-h4{
1352
1336
  margin:0;
1353
1337
  }
1354
- .mobius-segment h1,
1355
- .mobius-segment h2,
1356
- .mobius-segment h3,
1357
- .mobius-segment h4,
1358
- .mobius-segment p{
1338
+ .mobius-segment h1,.mobius-segment h2,.mobius-segment h3,.mobius-segment h4,.mobius-segment p{
1359
1339
  margin:0;
1360
1340
  }
1361
1341
  .mobius-segment .mobius-text.--is-p{
1362
1342
  line-height:var(--font-size-lead);
1363
1343
  }
1364
1344
  .mobius-segment.subtle{
1365
- background-color:var(--color-background-highlight);
1345
+ background-color:var(--color-border-light);
1366
1346
  }
1367
1347
  .mobius-segment.grey{
1368
1348
  background-color:var(--color-background-light);
@@ -1376,11 +1356,7 @@ a.mobius-button:focus-visible,
1376
1356
  .mobius-segment.inverted{
1377
1357
  color:var(--color-text-inverted);
1378
1358
  }
1379
- .mobius-segment .mobius-text-field:last-child,
1380
- .mobius-segment .mobius-checkbox:last-child,
1381
- .mobius-segment .mobius-radio-group:last-child,
1382
- .mobius-segment .mobius-text-area:last-child,
1383
- .mobius-segment .mobius-select__outer:last-child{
1359
+ .mobius-segment .mobius-text-field:last-child,.mobius-segment .mobius-checkbox:last-child,.mobius-segment .mobius-radio-group:last-child,.mobius-segment .mobius-text-area:last-child,.mobius-segment .mobius-select__outer:last-child{
1384
1360
  margin-bottom:0 !important;
1385
1361
  }
1386
1362
  .mobius-segment .mobius-segment-group{
@@ -1401,7 +1377,7 @@ a.mobius-button:focus-visible,
1401
1377
  box-sizing:border-box;
1402
1378
  width:100%;
1403
1379
  }
1404
- .mobius-select__outer > :where(.mobius-label.--is-optional)::after{
1380
+ .mobius-select__outer > :where(.mobius-label.--is-optional)::after{
1405
1381
  content:" (optional)";
1406
1382
  }
1407
1383
  .mobius-select__wrapper{
@@ -1657,6 +1633,7 @@ a.mobius-button:focus-visible,
1657
1633
  font-size:var(--font-size-regular);
1658
1634
  font-weight:var(--font-weight-normal);
1659
1635
  line-height:var(--line-height-normal);
1636
+ text-wrap:pretty;
1660
1637
  }
1661
1638
  .mobius-text:where(.--is-h1){
1662
1639
  box-sizing:border-box;
@@ -1665,6 +1642,7 @@ a.mobius-button:focus-visible,
1665
1642
  font-weight:var(--font-weight-bold);
1666
1643
  line-height:1.25;
1667
1644
  margin:0.35em 0;
1645
+ text-wrap:balance;
1668
1646
  }
1669
1647
  .mobius-text:where(.--is-h2){
1670
1648
  box-sizing:border-box;
@@ -1673,6 +1651,7 @@ a.mobius-button:focus-visible,
1673
1651
  font-weight:var(--font-weight-bold);
1674
1652
  line-height:var(--line-height-tight);
1675
1653
  margin:0.45em 0;
1654
+ text-wrap:balance;
1676
1655
  }
1677
1656
  .mobius-text:where(.--is-h3){
1678
1657
  box-sizing:border-box;
@@ -1681,6 +1660,7 @@ a.mobius-button:focus-visible,
1681
1660
  font-weight:var(--font-weight-bold);
1682
1661
  line-height:1.2;
1683
1662
  margin:0.5em 0;
1663
+ text-wrap:balance;
1684
1664
  }
1685
1665
  .mobius-text:where(.--is-h4){
1686
1666
  box-sizing:border-box;
@@ -1689,6 +1669,7 @@ a.mobius-button:focus-visible,
1689
1669
  font-weight:var(--font-weight-bold);
1690
1670
  line-height:var(--line-height-normal);
1691
1671
  margin:0.55em 0;
1672
+ text-wrap:balance;
1692
1673
  }
1693
1674
  .mobius-text:where(.--is-span){
1694
1675
  box-sizing:border-box;
@@ -1782,7 +1763,7 @@ a.mobius-button:focus-visible,
1782
1763
  flex-wrap:wrap;
1783
1764
  align-items:stretch;
1784
1765
  }
1785
- .mobius-text-field__prefix-outside.mobius-text, .mobius-text-field__suffix-outside.mobius-text{
1766
+ .mobius-text:is(.mobius-text-field__prefix-outside,.mobius-text-field__suffix-outside){
1786
1767
  margin-top:0;
1787
1768
  margin-bottom:0;
1788
1769
  align-self:center;
@@ -1791,7 +1772,7 @@ a.mobius-button:focus-visible,
1791
1772
  border-top-right-radius:0;
1792
1773
  border-bottom-right-radius:0;
1793
1774
  }
1794
- .mobius-text-field__prefix-outside.mobius-button + .mobius-text-field__input-wrapper{
1775
+ .mobius-text-field__prefix-outside.mobius-button + .mobius-text-field__input-wrapper{
1795
1776
  border-top-left-radius:0;
1796
1777
  border-bottom-left-radius:0;
1797
1778
  }
@@ -1810,12 +1791,12 @@ a.mobius-button:focus-visible,
1810
1791
  display:flex;
1811
1792
  color:var(--color-primary-light);
1812
1793
  }
1813
- .mobius-text-field__prefix-inside.mobius-button, .mobius-text-field__suffix-inside.mobius-button{
1794
+ .mobius-button:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside){
1814
1795
  min-height:100%;
1815
1796
  border-radius:0;
1816
1797
  align-self:stretch;
1817
1798
  }
1818
- .mobius-text-field__prefix-inside.mobius-text, .mobius-text-field__suffix-inside.mobius-text{
1799
+ .mobius-text:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside){
1819
1800
  margin-top:0;
1820
1801
  margin-bottom:0;
1821
1802
  }
@@ -1837,7 +1818,7 @@ a.mobius-button:focus-visible,
1837
1818
  .mobius-text-field__input-wrapper:not(.--is-hidden){
1838
1819
  border:var(--border-default);
1839
1820
  }
1840
- .mobius-text-field__input-wrapper:has(+ .mobius-button){
1821
+ .mobius-text-field__input-wrapper:has( + .mobius-button){
1841
1822
  border-top-right-radius:0;
1842
1823
  border-bottom-right-radius:0;
1843
1824
  }
@@ -1846,16 +1827,14 @@ a.mobius-button:focus-visible,
1846
1827
  background-color:var(--color-background-input-active);
1847
1828
  box-shadow:var(--box-shadow-default);
1848
1829
  }
1849
- .mobius-text-field__input-wrapper:focus-within .mobius-text-field__prefix-inside,
1850
- .mobius-text-field__input-wrapper:focus-within .mobius-text-field__suffix-inside{
1830
+ .mobius-text-field__input-wrapper:focus-within .mobius-text-field__prefix-inside,.mobius-text-field__input-wrapper:focus-within .mobius-text-field__suffix-inside{
1851
1831
  color:var(--color-primary);
1852
1832
  }
1853
1833
  .mobius-text-field__input-wrapper:hover:not(.--is-disabled):not(.mobius-text-field__input-wrapper.--is-invalid){
1854
1834
  border-color:var(--color-primary);
1855
1835
  background-color:var(--color-background-input-active);
1856
1836
  }
1857
- .mobius-text-field__input-wrapper:hover:not(.--is-disabled):not(.mobius-text-field__input-wrapper.--is-invalid) .mobius-text-field__prefix-inside,
1858
- .mobius-text-field__input-wrapper:hover:not(.--is-disabled):not(.mobius-text-field__input-wrapper.--is-invalid) .mobius-text-field__suffix-inside{
1837
+ .mobius-text-field__input-wrapper:hover:not(.--is-disabled):not(.mobius-text-field__input-wrapper.--is-invalid) .mobius-text-field__prefix-inside,.mobius-text-field__input-wrapper:hover:not(.--is-disabled):not(.mobius-text-field__input-wrapper.--is-invalid) .mobius-text-field__suffix-inside{
1859
1838
  color:var(--color-primary);
1860
1839
  }
1861
1840
  .mobius-text-field__input-wrapper.--is-disabled{
@@ -2373,15 +2352,13 @@ svg:not(:host).svg-inline--mobius-icon{
2373
2352
  --box-shadow-default:0 0 0 var(--size-focus-ring) var(--color-focus);
2374
2353
  --popover-max-width:260px;
2375
2354
  --popover-z-index:2147483647;
2376
- --color-background-popover:var(--color-neutral-700);
2355
+ --color-background-popover:var(--color-azure-700);
2377
2356
  --color-text-popover:#fff;
2378
2357
  }
2379
2358
  .mobius{
2380
2359
  font-family:var(--font-family);
2381
2360
  }
2382
- .mobius *,
2383
- .mobius *::before,
2384
- .mobius *::after{
2361
+ .mobius *,.mobius *::before,.mobius *::after{
2385
2362
  box-sizing:border-box;
2386
2363
  }
2387
2364
  .mobius-actions{
@@ -2431,7 +2408,7 @@ svg:not(:host).svg-inline--mobius-icon{
2431
2408
  max-width:var(--percentage-max-width);
2432
2409
  margin-bottom:0;
2433
2410
  }
2434
- .mobius-percentage-totals-question__items .mobius-number-field input{
2411
+ :is(.mobius-percentage-totals-question__items .mobius-number-field) input{
2435
2412
  max-width:var(--percentage-max-width);
2436
2413
  }
2437
2414
  .mobius-percentage-totals-question__items .mobius-number-field__input{
@@ -2502,13 +2479,13 @@ svg:not(:host).svg-inline--mobius-icon{
2502
2479
  background-color:var(--color-background-light);
2503
2480
  padding:var(--size-sm) var(--size-sm) var(--size-xxs) var(--size-lg);
2504
2481
  }
2505
- .mobius-question-group .mobius-question:hover{
2482
+ :is(.mobius-question-group .mobius-question):hover{
2506
2483
  background-color:var(--color-background-highlight);
2507
2484
  }
2508
- .mobius-question-group .mobius-question .mobius-radio-group{
2485
+ :is(.mobius-question-group .mobius-question) .mobius-radio-group{
2509
2486
  width:50%;
2510
2487
  }
2511
- .mobius-question-group .mobius-question .mobius-question__label{
2488
+ :is(.mobius-question-group .mobius-question) .mobius-question__label{
2512
2489
  padding-right:var(--size-lg);
2513
2490
  }
2514
2491
  .mobius-question-group__header{
@@ -2546,8 +2523,7 @@ svg:not(:host).svg-inline--mobius-icon{
2546
2523
  border-radius:50%;
2547
2524
  color:var(--color-text-inverted);
2548
2525
  }
2549
- .mobius-question-help__trigger:hover,
2550
- .mobius-question-help__trigger:focus-visible{
2526
+ .mobius-question-help__trigger:hover,.mobius-question-help__trigger:focus-visible{
2551
2527
  background-color:var(--color-primary-hover);
2552
2528
  }
2553
2529
  .mobius-question-help__trigger > span{
@@ -2659,6 +2635,36 @@ svg:not(:host).svg-inline--mobius-icon{
2659
2635
  .mobius-agent-resources .mobius-link-button{
2660
2636
  text-align:center;
2661
2637
  }
2638
+ .mobius-coverage-summary__list{
2639
+ margin-bottom:var(--size-md);
2640
+ }
2641
+ .mobius-payment-summary{
2642
+ border:1px solid var(--color-border);
2643
+ }
2644
+ .mobius-payment-summary .mobius-segment{
2645
+ border-top:1px solid var(--color-border);
2646
+ }
2647
+ .mobius-payment-summary .mobius-flex{
2648
+ width:100%;
2649
+ }
2650
+ .mobius-payment-summary__total strong{
2651
+ font-size:var(--font-size-lead);
2652
+ }
2653
+ :is(.mobius-quote-summary .mobius-payment-info__multi-product-text) strong{
2654
+ font-size:var(--font-size-lead);
2655
+ }
2656
+ .mobius-quote-summary .mobius-quote-card__coverage{
2657
+ border-right:none;
2658
+ border-top:1px solid var(--color-border-light);
2659
+ margin:var(--size-md) 0 var(--size-sm);
2660
+ padding-right:0;
2661
+ padding-top:var(--size-sm);
2662
+ }
2663
+ .mobius-quote-summary .mobius-quote-card__modal-trigger{
2664
+ background:transparent;
2665
+ font-weight:var(--font-weight-normal);
2666
+ padding:0;
2667
+ }
2662
2668
  .mobius-footer{
2663
2669
  background-color:var(--color-background-light);
2664
2670
  padding:64px var(--size-sm) var(--size-lg);
@@ -2747,7 +2753,7 @@ svg:not(:host).svg-inline--mobius-icon{
2747
2753
  color:var(--color-primary);
2748
2754
  transition:var(--transition-standard);
2749
2755
  }
2750
- .mobius-footer__opening-hours-toggle:hover .mobius-footer__opening-hours-toggle-icon, .mobius-footer__opening-hours-toggle:active .mobius-footer__opening-hours-toggle-icon, .mobius-footer__opening-hours-toggle:focus-visible .mobius-footer__opening-hours-toggle-icon{
2756
+ :is(.mobius-footer__opening-hours-toggle:hover,.mobius-footer__opening-hours-toggle:active,.mobius-footer__opening-hours-toggle:focus-visible) .mobius-footer__opening-hours-toggle-icon{
2751
2757
  color:var(--color-primary-hover);
2752
2758
  }
2753
2759
  .mobius-footer__opening-hours-list{
@@ -2962,17 +2968,12 @@ svg:not(:host).svg-inline--mobius-icon{
2962
2968
  .mobius-next-coverage{
2963
2969
  border:1px solid var(--color-border);
2964
2970
  border-radius:var(--radius-2);
2971
+ height:max-content;
2965
2972
  padding:var(--size-lg) var(--size-sm);
2966
2973
  }
2967
2974
  .mobius-next-coverage__text{
2968
2975
  margin-bottom:var(--size-lg);
2969
2976
  }
2970
- .mobius-payment-summary .mobius-flex{
2971
- width:100%;
2972
- }
2973
- .mobius-payment-summary__total strong{
2974
- font-size:var(--font-size-lead);
2975
- }
2976
2977
  .mobius-insurance-benefits{
2977
2978
  padding:var(--size-lg) var(--size-sm);
2978
2979
  background-color:var(--color-background-highlight);
@@ -3077,7 +3078,7 @@ svg:not(:host).svg-inline--mobius-icon{
3077
3078
  background-color:var(--progress-steps-tertiary-color);
3078
3079
  border-color:var(--progress-steps-tertiary-color);
3079
3080
  }
3080
- .mobius-progress-steps__item.--is-active .mobius-progress-steps__item-shape::after{
3081
+ :is(.mobius-progress-steps__item.--is-active .mobius-progress-steps__item-shape)::after{
3081
3082
  background-color:var(--progress-steps-secondary-color);
3082
3083
  }
3083
3084
  .mobius-progress-steps__item.--is-active .mobius-progress-steps__item-number{
@@ -3086,17 +3087,17 @@ svg:not(:host).svg-inline--mobius-icon{
3086
3087
  .mobius-progress-steps__item.--is-complete::after{
3087
3088
  background-color:var(--progress-steps-primary-color);
3088
3089
  }
3089
- .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link:hover .mobius-progress-steps__item-shape, .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link:focus-visible .mobius-progress-steps__item-shape{
3090
+ :is(:is(.mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link):hover,:is(.mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link):focus-visible) .mobius-progress-steps__item-shape{
3090
3091
  background-color:var(--progress-steps-primary-color);
3091
3092
  }
3092
- .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link:hover .mobius-progress-steps__item-icon, .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link:focus-visible .mobius-progress-steps__item-icon{
3093
+ :is(:is(.mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link):hover,:is(.mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-link):focus-visible) .mobius-progress-steps__item-icon{
3093
3094
  color:var(--color-text-inverted);
3094
3095
  }
3095
3096
  .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-shape{
3096
3097
  border-color:var(--progress-steps-primary-color);
3097
3098
  background-color:var(--color-background);
3098
3099
  }
3099
- .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-shape::after{
3100
+ :is(.mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-shape)::after{
3100
3101
  background-color:var(--progress-steps-primary-color);
3101
3102
  }
3102
3103
  .mobius-progress-steps__item.--is-complete .mobius-progress-steps__item-number{
@@ -3111,7 +3112,7 @@ svg:not(:host).svg-inline--mobius-icon{
3111
3112
  .mobius-progress-steps__item.--is-incomplete .mobius-progress-steps__item-shape{
3112
3113
  border-color:var(--progress-steps-secondary-color);
3113
3114
  }
3114
- .mobius-progress-steps__item.--is-incomplete .mobius-progress-steps__item-shape::after{
3115
+ :is(.mobius-progress-steps__item.--is-incomplete .mobius-progress-steps__item-shape)::after{
3115
3116
  background-color:var(--progress-steps-secondary-color);
3116
3117
  }
3117
3118
  .mobius-progress-steps__item.--is-incomplete .mobius-progress-steps__item-number{
@@ -3220,7 +3221,7 @@ svg:not(:host).svg-inline--mobius-icon{
3220
3221
  padding:var(--size-lg) var(--size-lg) 0;
3221
3222
  }
3222
3223
  }
3223
- .mobius-edit-limits__modal.mobius-modal .mobius-modal__header button{
3224
+ :is(.mobius-edit-limits__modal.mobius-modal .mobius-modal__header) button{
3224
3225
  padding:4px;
3225
3226
  scale:150%;
3226
3227
  translate:4px -4px;
@@ -3357,6 +3358,7 @@ svg:not(:host).svg-inline--mobius-icon{
3357
3358
  .mobius-payment-toggle{
3358
3359
  position:relative;
3359
3360
  display:grid;
3361
+ flex-shrink:0;
3360
3362
  grid-template-columns:repeat(2, 1fr);
3361
3363
  justify-items:center;
3362
3364
  margin-left:auto;
@@ -3380,18 +3382,16 @@ svg:not(:host).svg-inline--mobius-icon{
3380
3382
  transform:translateX(2px);
3381
3383
  transition:all var(--duration) ease-in-out;
3382
3384
  }
3383
- .mobius-payment-toggle:active,
3384
- .mobius-payment-toggle:hover,
3385
- .mobius-payment-toggle:focus-visible{
3385
+ .mobius-payment-toggle:active,.mobius-payment-toggle:hover,.mobius-payment-toggle:focus-visible{
3386
3386
  border-color:var(--color-primary-hover);
3387
3387
  }
3388
- .mobius-payment-toggle:active .mobius-payment-toggle__text.--yearly, .mobius-payment-toggle:hover .mobius-payment-toggle__text.--yearly, .mobius-payment-toggle:focus-visible .mobius-payment-toggle__text.--yearly{
3388
+ .--yearly:is(:is(.mobius-payment-toggle:active,.mobius-payment-toggle:hover,.mobius-payment-toggle:focus-visible) .mobius-payment-toggle__text){
3389
3389
  color:var(--color-primary-hover);
3390
3390
  }
3391
- .mobius-payment-toggle:active::before, .mobius-payment-toggle:hover::before, .mobius-payment-toggle:focus-visible::before{
3391
+ :is(.mobius-payment-toggle:active,.mobius-payment-toggle:hover,.mobius-payment-toggle:focus-visible)::before{
3392
3392
  background-color:var(--color-primary-hover);
3393
3393
  }
3394
- .mobius-payment-toggle.--is-toggled:active .mobius-payment-toggle__text.--monthly, .mobius-payment-toggle.--is-toggled:hover .mobius-payment-toggle__text.--monthly, .mobius-payment-toggle.--is-toggled:focus-visible .mobius-payment-toggle__text.--monthly{
3394
+ .--monthly:is(.--is-toggled:is(.mobius-payment-toggle:active,.mobius-payment-toggle:hover,.mobius-payment-toggle:focus-visible) .mobius-payment-toggle__text){
3395
3395
  color:var(--color-primary-hover);
3396
3396
  }
3397
3397
  .mobius-payment-toggle:focus-visible{
@@ -3401,10 +3401,10 @@ svg:not(:host).svg-inline--mobius-icon{
3401
3401
  .mobius-payment-toggle.--is-toggled::before{
3402
3402
  transform:translate(100%);
3403
3403
  }
3404
- .mobius-payment-toggle.--is-toggled .mobius-payment-toggle__text.--monthly{
3404
+ .--monthly:is(.mobius-payment-toggle.--is-toggled .mobius-payment-toggle__text){
3405
3405
  color:var(--color-primary);
3406
3406
  }
3407
- .mobius-payment-toggle.--is-toggled .mobius-payment-toggle__text.--yearly{
3407
+ .--yearly:is(.mobius-payment-toggle.--is-toggled .mobius-payment-toggle__text){
3408
3408
  color:var(--color-text-inverted);
3409
3409
  }
3410
3410
  .mobius-payment-toggle__text{
@@ -3435,7 +3435,7 @@ svg:not(:host).svg-inline--mobius-icon{
3435
3435
  padding:0 0 0 var(--size-md);
3436
3436
  list-style:outside;
3437
3437
  }
3438
- .mobius-additional-coverage-info ul li{
3438
+ :is(.mobius-additional-coverage-info ul) li{
3439
3439
  margin:0 0 var(--size-sm);
3440
3440
  }
3441
3441
  .mobius-additional-coverage-info__title.mobius-text{
@@ -3552,10 +3552,10 @@ svg:not(:host).svg-inline--mobius-icon{
3552
3552
  padding:1rem;
3553
3553
  margin-top:1rem;
3554
3554
  }
3555
- .mobius-payment-info__multi-product .mobius-payment-info__multi-product-text.--general-liability{
3555
+ .--general-liability:is(.mobius-payment-info__multi-product .mobius-payment-info__multi-product-text){
3556
3556
  padding-bottom:var(--size-xs);
3557
3557
  }
3558
- .mobius-payment-info__multi-product .mobius-payment-info__multi-product-text.--professional-liability{
3558
+ .--professional-liability:is(.mobius-payment-info__multi-product .mobius-payment-info__multi-product-text){
3559
3559
  position:relative;
3560
3560
  border:1px solid var(--color-border-light);
3561
3561
  padding-top:var(--size-xs);
@@ -3591,10 +3591,10 @@ svg:not(:host).svg-inline--mobius-icon{
3591
3591
  .mobius-payment-info__multi-product-iterated .mobius-payment-info__multi-product-text{
3592
3592
  margin:0;
3593
3593
  }
3594
- .mobius-payment-info__multi-product-iterated .mobius-payment-info__multi-product-text.--general-liability{
3594
+ .--general-liability:is(.mobius-payment-info__multi-product-iterated .mobius-payment-info__multi-product-text){
3595
3595
  padding-bottom:var(--size-xs);
3596
3596
  }
3597
- .mobius-payment-info__multi-product-iterated .mobius-payment-info__multi-product-text.--professional-liability{
3597
+ .--professional-liability:is(.mobius-payment-info__multi-product-iterated .mobius-payment-info__multi-product-text){
3598
3598
  position:relative;
3599
3599
  border-top:1px solid var(--color-border-light);
3600
3600
  padding-top:var(--size-xs);
@@ -3605,12 +3605,7 @@ svg:not(:host).svg-inline--mobius-icon{
3605
3605
  margin-top:var(--size-sm);
3606
3606
  margin-bottom:var(--size-sm);
3607
3607
  }
3608
- .mobius-payment-info__total-outer-container span,
3609
- .mobius-payment-info__multi-product span,
3610
- .mobius-payment-info__total-outer-container strong,
3611
- .mobius-payment-info__multi-product strong,
3612
- .mobius-payment-info__total-outer-container p,
3613
- .mobius-payment-info__multi-product p{
3608
+ :is(.mobius-payment-info__total-outer-container,.mobius-payment-info__multi-product) span,:is(.mobius-payment-info__total-outer-container,.mobius-payment-info__multi-product) strong,:is(.mobius-payment-info__total-outer-container,.mobius-payment-info__multi-product) p{
3614
3609
  font-size:var(--font-size-2);
3615
3610
  }
3616
3611
  .mobius-payment-info__total-container{
@@ -3639,7 +3634,7 @@ svg:not(:host).svg-inline--mobius-icon{
3639
3634
  padding-left:var(--size-md);
3640
3635
  margin:6px 0;
3641
3636
  }
3642
- .price-details .card-modal__explainer-title .card-modal__info-icon{
3637
+ :is(.price-details .card-modal__explainer-title) .card-modal__info-icon{
3643
3638
  color:var(--color-primary);
3644
3639
  }
3645
3640
  .price-details .info__popover .phone{
@@ -3650,7 +3645,7 @@ svg:not(:host).svg-inline--mobius-icon{
3650
3645
  vertical-align:middle;
3651
3646
  margin-right:4px;
3652
3647
  }
3653
- .price-details .phone span{
3648
+ :is(.price-details .phone) span{
3654
3649
  -webkit-text-decoration:underline;
3655
3650
  text-decoration:underline;
3656
3651
  text-underline-offset:6px;
@@ -3693,7 +3688,7 @@ svg:not(:host).svg-inline--mobius-icon{
3693
3688
  }
3694
3689
  }
3695
3690
  @supports (-webkit-touch-callout: none) and (not (translate: none)){
3696
- .mobius-quote-card__body > *:not(:last-child){
3691
+ .mobius-quote-card__body > *:not(:last-child){
3697
3692
  margin-bottom:33px;
3698
3693
  }
3699
3694
  }
@@ -3747,8 +3742,8 @@ svg:not(:host).svg-inline--mobius-icon{
3747
3742
  }
3748
3743
  .mobius-quote-card__cover{
3749
3744
  color:var(--color-text-medium);
3750
- margin-top:var(--size-xxs);
3751
- margin-bottom:var(--size-xxs);
3745
+ margin-top:var(--size-xs);
3746
+ margin-bottom:var(--size-xs);
3752
3747
  padding-left:var(--size-md);
3753
3748
  align-items:center;
3754
3749
  }
@@ -3799,7 +3794,7 @@ svg:not(:host).svg-inline--mobius-icon{
3799
3794
  .mobius-quote-card__extra-coverage-item .mobius-quote-card__explainer-title{
3800
3795
  color:var(--color-text);
3801
3796
  }
3802
- .mobius-quote-card__extra-coverage-item .mobius-quote-card__explainer-title .mobius-quote-card__explainer-icon{
3797
+ :is(.mobius-quote-card__extra-coverage-item .mobius-quote-card__explainer-title) .mobius-quote-card__explainer-icon{
3803
3798
  color:var(--color-text);
3804
3799
  }
3805
3800
  .mobius-quote-card__extra-coverage-item .mobius-quote-card__cover{
@@ -3834,7 +3829,7 @@ svg:not(:host).svg-inline--mobius-icon{
3834
3829
  margin-top:var(--size-xs);
3835
3830
  margin-bottom:var(--size-xxs);
3836
3831
  }
3837
- .mobius-quote-card__coverage-item .mobius-accordion div[aria-hidden]{
3832
+ :is(.mobius-quote-card__coverage-item .mobius-accordion) div[aria-hidden]{
3838
3833
  width:100%;
3839
3834
  }
3840
3835
  .mobius-quote-card__coverage-item .mobius-accordion__link{
@@ -3863,7 +3858,7 @@ svg:not(:host).svg-inline--mobius-icon{
3863
3858
  margin-top:var(--size-xxs);
3864
3859
  margin-bottom:0;
3865
3860
  }
3866
- .mobius-quote-card__coverage-item .mobius-accordion__content .mobius-quote-card__cover:last-child{
3861
+ :is(.mobius-quote-card__coverage-item .mobius-accordion__content) .mobius-quote-card__cover:last-child{
3867
3862
  margin-bottom:0;
3868
3863
  }
3869
3864
  .mobius-quote-card__deductibles-title.--is-p{
@@ -3927,8 +3922,7 @@ svg:not(:host).svg-inline--mobius-icon{
3927
3922
  width:12px;
3928
3923
  margin-left:var(--size-xxs);
3929
3924
  }
3930
- :is(.mobius-quote-card,.mobius-quote-card__modal-container.mobius-drawer) .mobius-quote-card__modal-trigger,
3931
- :is(.mobius-quote-card,.mobius-quote-card__modal-container.mobius-drawer) .mobius-popover__toggle{
3925
+ :is(.mobius-quote-card,.mobius-quote-card__modal-container.mobius-drawer) .mobius-quote-card__modal-trigger,:is(.mobius-quote-card,.mobius-quote-card__modal-container.mobius-drawer) .mobius-popover__toggle{
3932
3926
  border:none;
3933
3927
  padding:0;
3934
3928
  font-weight:var(--font-weight-normal);
@@ -3950,7 +3944,7 @@ svg:not(:host).svg-inline--mobius-icon{
3950
3944
  padding:var(--size-sm) var(--size-sm) var(--size-xs) var(--size-sm);
3951
3945
  font-size:var(--font-size-lead);
3952
3946
  }
3953
- .mobius-quote-card__modal-container.mobius-drawer .mobius-modal__header button{
3947
+ :is(.mobius-quote-card__modal-container.mobius-drawer .mobius-modal__header) button{
3954
3948
  font-size:var(--font-size-regular);
3955
3949
  padding:var(--size-xxs);
3956
3950
  scale:150%;
@@ -3973,7 +3967,7 @@ svg:not(:host).svg-inline--mobius-icon{
3973
3967
  padding-left:var(--size-md);
3974
3968
  margin:6px 0;
3975
3969
  }
3976
- .mobius-quote-card__price-details .mobius-quote-card__explainer-title .mobius-quote-card__explainer-icon{
3970
+ :is(.mobius-quote-card__price-details .mobius-quote-card__explainer-title) .mobius-quote-card__explainer-icon{
3977
3971
  color:var(--color-primary);
3978
3972
  }
3979
3973
  .mobius-quote-card__price-details .mobius-quote-card__info-popover .mobius-quote-card__price-details-phone{
@@ -3988,7 +3982,7 @@ svg:not(:host).svg-inline--mobius-icon{
3988
3982
  -webkit-text-decoration:none;
3989
3983
  text-decoration:none;
3990
3984
  }
3991
- .mobius-quote-card__price-details .mobius-quote-card__price-details-phone span{
3985
+ :is(.mobius-quote-card__price-details .mobius-quote-card__price-details-phone) span{
3992
3986
  -webkit-text-decoration:underline;
3993
3987
  text-decoration:underline;
3994
3988
  text-underline-offset:6px;
@@ -4009,7 +4003,7 @@ svg:not(:host).svg-inline--mobius-icon{
4009
4003
  font-weight:var(--font-weight-bold);
4010
4004
  text-align:right;
4011
4005
  }
4012
- .mobius-quote-card__pricing-amount-due.mobius-text, .mobius-quote-card__pricing-unavailable-installment.mobius-text{
4006
+ .mobius-text:is(.mobius-quote-card__pricing-amount-due,.mobius-quote-card__pricing-unavailable-installment){
4013
4007
  color:var(--color-text);
4014
4008
  margin-top:0;
4015
4009
  margin-bottom:var(--size-xxs);
@@ -4053,14 +4047,17 @@ svg:not(:host).svg-inline--mobius-icon{
4053
4047
  color:var(--color-text);
4054
4048
  }
4055
4049
  .mobius-quote-card__ratings{
4050
+ display:flex;
4051
+ flex-direction:column;
4052
+ justify-content:flex-end;
4056
4053
  margin-top:0;
4057
4054
  margin-bottom:var(--size-sm);
4055
+ min-height:86px;
4058
4056
  }
4059
4057
  .mobius-quote-card__ratings.--has-reinsurer-text{
4060
4058
  padding-top:var(--size-sm);
4061
4059
  }
4062
- .mobius-quote-card__ratings .mobius-quote-card__explainer-title,
4063
- .mobius-quote-card__ratings .mobius-quote-card__explainer-icon{
4060
+ .mobius-quote-card__ratings .mobius-quote-card__explainer-title,.mobius-quote-card__ratings .mobius-quote-card__explainer-icon{
4064
4061
  color:var(--color-text);
4065
4062
  }
4066
4063
  .mobius-quote-card__ratings-text.--is-p{
@@ -4099,7 +4096,7 @@ svg:not(:host).svg-inline--mobius-icon{
4099
4096
  --column-count:2;
4100
4097
  }
4101
4098
 
4102
- .mobius-quote-cards__grid:has(> *:nth-child(3)){
4099
+ .mobius-quote-cards__grid:has( > *:nth-child(3)){
4103
4100
  --column-count:3;
4104
4101
  }
4105
4102
  }
@@ -4147,15 +4144,11 @@ svg:not(:host).svg-inline--mobius-icon{
4147
4144
  margin-right:0;
4148
4145
  }
4149
4146
  }
4150
- .mobius-quote-details__drawer.mobius-drawer .mobius-drawer__content,
4151
- .mobius-quote-details__drawer.mobius-drawer .mobius-drawer__header,
4152
- .mobius-quote-details__drawer.mobius-drawer .mobius-quote-details-drawer__footer{
4147
+ .mobius-quote-details__drawer.mobius-drawer .mobius-drawer__content,.mobius-quote-details__drawer.mobius-drawer .mobius-drawer__header,.mobius-quote-details__drawer.mobius-drawer .mobius-quote-details-drawer__footer{
4153
4148
  padding:var(--size-sm);
4154
4149
  }
4155
4150
  @media (min-width: 850px){
4156
- .mobius-quote-details__drawer.mobius-drawer .mobius-drawer__content,
4157
- .mobius-quote-details__drawer.mobius-drawer .mobius-drawer__header,
4158
- .mobius-quote-details__drawer.mobius-drawer .mobius-quote-details-drawer__footer{
4151
+ .mobius-quote-details__drawer.mobius-drawer .mobius-drawer__content,.mobius-quote-details__drawer.mobius-drawer .mobius-drawer__header,.mobius-quote-details__drawer.mobius-drawer .mobius-quote-details-drawer__footer{
4159
4152
  padding:var(--size-lg);
4160
4153
  }
4161
4154
  }
@@ -4250,7 +4243,6 @@ svg:not(:host).svg-inline--mobius-icon{
4250
4243
  .mobius-quote-help__contact-container{
4251
4244
  flex-direction:column;
4252
4245
  gap:var(--size-sm);
4253
- border-bottom:1px solid var(--color-background);
4254
4246
  padding-bottom:var(--size-xs);
4255
4247
  }
4256
4248
  @media (min-width: 640px){
@@ -4260,7 +4252,6 @@ svg:not(:host).svg-inline--mobius-icon{
4260
4252
  }
4261
4253
 
4262
4254
  .mobius-quote-help__contact-container .mobius-quote-help__chat-link{
4263
- border-left:1px solid var(--color-background);
4264
4255
  border-radius:0;
4265
4256
  padding-left:var(--size-xs);
4266
4257
  }
@@ -4274,7 +4265,7 @@ svg:not(:host).svg-inline--mobius-icon{
4274
4265
  column-gap:var(--size-xl);
4275
4266
  row-gap:var(--size-sm);
4276
4267
  margin-bottom:var(--size-lg);
4277
- grid-template-areas:"referralText" "nextCoverage" "trustSection";
4268
+ grid-template-areas:"referralText" "coverageSummary" "nextCoverage" "trustSection";
4278
4269
  }
4279
4270
  @media (min-width: 960px){
4280
4271
  .mobius-referral{
@@ -4283,6 +4274,12 @@ svg:not(:host).svg-inline--mobius-icon{
4283
4274
  row-gap:0;
4284
4275
  }
4285
4276
  }
4277
+ @media (min-width: 960px){
4278
+ .mobius-cross-sell{
4279
+ grid-template-columns:2fr 1.25fr;
4280
+ grid-template-areas:"referralText coverageSummary" "nextCoverage coverageSummary" "nextCoverage trustSection";
4281
+ }
4282
+ }
4286
4283
  .mobius-trust-section{
4287
4284
  grid-area:trustSection;
4288
4285
  }
@@ -4292,6 +4289,9 @@ svg:not(:host).svg-inline--mobius-icon{
4292
4289
  .mobius-referral__text{
4293
4290
  grid-area:referralText;
4294
4291
  }
4292
+ .mobius-coverage-summary{
4293
+ grid-area:coverageSummary;
4294
+ }
4295
4295
  .mobius-trade-selector{
4296
4296
  display:inline-flex;
4297
4297
  flex-direction:column;
@@ -4367,8 +4367,7 @@ svg:not(:host).svg-inline--mobius-icon{
4367
4367
  border-color:var(--color-primary);
4368
4368
  background-color:var(--color-background-highlight);
4369
4369
  }
4370
- .mobius-trade-selector__option:focus-visible,
4371
- .mobius-trade-selector__option.--is-selected{
4370
+ .mobius-trade-selector__option:focus-visible,.mobius-trade-selector__option.--is-selected{
4372
4371
  color:var(--color-primary);
4373
4372
  background-color:var(--color-background-highlight);
4374
4373
  }
@@ -4428,8 +4427,7 @@ svg:not(:host).svg-inline--mobius-icon{
4428
4427
  border-bottom-left-radius:0;
4429
4428
  border-bottom-right-radius:var(--radius-1);
4430
4429
  }
4431
- .mobius-date-picker__field-button:hover:not(.--is-disabled):not(.mobius-date-picker__field-button.--is-valid):not(.mobius-date-picker__field-button.--is-invalid),
4432
- .mobius-date-picker__field-button:focus-visible:not(.--is-disabled):not(.mobius-date-picker__field-button.--is-valid):not(.mobius-date-picker__field-button.--is-invalid){
4430
+ .mobius-date-picker__field-button:hover:not(.--is-disabled):not(.mobius-date-picker__field-button.--is-valid):not(.mobius-date-picker__field-button.--is-invalid),.mobius-date-picker__field-button:focus-visible:not(.--is-disabled):not(.mobius-date-picker__field-button.--is-valid):not(.mobius-date-picker__field-button.--is-invalid){
4433
4431
  background-color:var(--color-primary-hover);
4434
4432
  }
4435
4433
  .mobius-date-picker__field-button.--is-invalid:not(.--is-disabled){
@@ -4525,7 +4523,7 @@ svg:not(:host).svg-inline--mobius-icon{
4525
4523
  color:var(--color-text-inverted);
4526
4524
  border-radius:var(--radius-1);
4527
4525
  }
4528
- .mobius-date-picker__day.--is-outside .mobius-date-picker__day-button, .mobius-date-picker__day.--is-disabled .mobius-date-picker__day-button{
4526
+ :is(.mobius-date-picker__day.--is-outside,.mobius-date-picker__day.--is-disabled) .mobius-date-picker__day-button{
4529
4527
  opacity:0.3;
4530
4528
  cursor:not-allowed;
4531
4529
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@simplybusiness/theme-simplybusiness",
3
- "version": "0.4.1",
3
+ "version": "0.5.0",
4
4
  "main": "dist/index.css",
5
5
  "simplyBusiness": {
6
6
  "publishToPublicNpm": true
@@ -26,24 +26,24 @@
26
26
  "./fonts": "./dist/fonts.css"
27
27
  },
28
28
  "dependencies": {
29
- "@simplybusiness/mobius": "^5.1.2",
30
- "@simplybusiness/mobius-datepicker": "^6.0.4",
31
- "@simplybusiness/mobius-journey": "^6.4.1",
32
- "@simplybusiness/theme-core": "^7.1.2"
29
+ "@simplybusiness/mobius": "^5.2.0",
30
+ "@simplybusiness/mobius-datepicker": "^6.0.5",
31
+ "@simplybusiness/mobius-journey": "^6.5.0",
32
+ "@simplybusiness/theme-core": "^7.1.3"
33
33
  },
34
34
  "devDependencies": {
35
35
  "css-loader": "^7.1.2",
36
- "mini-css-extract-plugin": "^2.9.0",
37
- "postcss": "^8.4.40",
38
- "postcss-discard-comments": "^7.0.2",
36
+ "mini-css-extract-plugin": "^2.9.1",
37
+ "postcss": "^8.4.47",
38
+ "postcss-discard-comments": "^7.0.3",
39
39
  "postcss-import": "^16.1.0",
40
40
  "postcss-loader": "^8.1.1",
41
41
  "postcss-nested": "^6.2.0",
42
- "postcss-preset-env": "^9.6.0",
42
+ "postcss-preset-env": "^10.0.5",
43
43
  "postcss-url": "^10.1.3",
44
44
  "resolve-url-loader": "^5.0.0",
45
45
  "ts-loader": "^9.5.1",
46
- "typescript": "^5.5.4",
46
+ "typescript": "^5.6.2",
47
47
  "webpack": "^5.94.0",
48
48
  "webpack-cli": "^5.1.4"
49
49
  }
package/src/index.css CHANGED
@@ -2,40 +2,42 @@
2
2
  @import "@simplybusiness/theme-core";
3
3
 
4
4
  /* @simplybusiness/mobius-journey */
5
- @import "../../mobius-journey/src/archived/Actions/Actions.css";
6
- @import "../../mobius-journey/src/archived/PaymentConfirmation/PaymentConfirmation.css";
7
- @import "../../mobius-journey/src/archived/PercentageTotalsQuestion/PercentageTotalsQuestion.css";
8
- @import "../../mobius-journey/src/archived/Question/Question.css";
9
- @import "../../mobius-journey/src/archived/QuestionGroup/QuestionGroup.css";
10
- @import "../../mobius-journey/src/archived/QuestionHelp/QuestionHelp.css";
11
- @import "../../mobius-journey/src/archived/Section/Section.css";
12
- @import "../../mobius-journey/src/archived/Testimonial/Testimonial.css";
13
- @import "../../mobius-journey/src/components/AgentResources/AgentResources.css";
14
- @import "../../mobius-journey/src/components/Footer/Footer.css";
15
- @import "../../mobius-journey/src/components/ErrorBoundary/ErrorBoundary.css";
16
- @import "../../mobius-journey/src/components/Header/Header.css";
17
- @import "../../mobius-journey/src/components/InfoCard/InfoCard.css";
18
- @import "../../mobius-journey/src/components/NextCoverage/NextCoverage.css";
19
- @import "../../mobius-journey/src/components/PaymentSummary/PaymentSummary.css";
20
- @import "../../mobius-journey/src/components/PreFooter/InsuranceBenefits.css";
21
- @import "../../mobius-journey/src/components/PreFooter/PreFooter.css";
22
- @import "../../mobius-journey/src/components/ProgressSteps/ProgressSteps.css";
23
- @import "../../mobius-journey/src/components/QuoteComparison/CoverSummary/CoverSummary.css";
24
- @import "../../mobius-journey/src/components/QuoteComparison/CoverTogglesContainer/CoverTogglesContainer.css";
25
- @import "../../mobius-journey/src/components/QuoteComparison/Headline/ExperimentIteratedQCP/EditLimitsExperimentIteratedQCP.css";
26
- @import "../../mobius-journey/src/components/QuoteComparison/Headline/ExperimentIteratedQCP/QuoteHeadlineExperimentIteratedQCP.css";
27
- @import "../../mobius-journey/src/components/QuoteComparison/Headline/QuoteHeadline.css";
28
- @import "../../mobius-journey/src/components/QuoteComparison/PaymentToggle/PaymentToggle.css";
29
- @import "../../mobius-journey/src/components/QuoteComparison/QuoteCards/QuoteCards.css";
30
- @import "../../mobius-journey/src/components/QuoteHelp/QuoteHelp.css";
31
- @import "../../mobius-journey/src/components/Referral/Referral.css";
32
- @import "../../mobius-journey/src/components/TradeSelector/TradeSelector.css";
33
- @import "../../mobius-journey/src/components/TrustSection/TrustSection.css";
34
- @import "../../mobius-journey/src/pages/AgentReferralPage/AgentReferralContainer.css";
35
- @import "../../mobius-journey/src/pages/Main.css";
5
+ @import "@simplybusiness/mobius-journey/src/archived/Actions/Actions.css";
6
+ @import "@simplybusiness/mobius-journey/src/archived/PaymentConfirmation/PaymentConfirmation.css";
7
+ @import "@simplybusiness/mobius-journey/src/archived/PercentageTotalsQuestion/PercentageTotalsQuestion.css";
8
+ @import "@simplybusiness/mobius-journey/src/archived/Question/Question.css";
9
+ @import "@simplybusiness/mobius-journey/src/archived/QuestionGroup/QuestionGroup.css";
10
+ @import "@simplybusiness/mobius-journey/src/archived/QuestionHelp/QuestionHelp.css";
11
+ @import "@simplybusiness/mobius-journey/src/archived/Section/Section.css";
12
+ @import "@simplybusiness/mobius-journey/src/archived/Testimonial/Testimonial.css";
13
+ @import "@simplybusiness/mobius-journey/src/components/AgentResources/AgentResources.css";
14
+ @import "@simplybusiness/mobius-journey/src/components/CoverageSummary/CoverageSummary.css";
15
+ @import "@simplybusiness/mobius-journey/src/components/CoverageSummary/PaymentSummary/PaymentSummary.css";
16
+ @import "@simplybusiness/mobius-journey/src/components/CoverageSummary/QuoteSummary/QuoteSummary.css";
17
+ @import "@simplybusiness/mobius-journey/src/components/Footer/Footer.css";
18
+ @import "@simplybusiness/mobius-journey/src/components/ErrorBoundary/ErrorBoundary.css";
19
+ @import "@simplybusiness/mobius-journey/src/components/Header/Header.css";
20
+ @import "@simplybusiness/mobius-journey/src/components/InfoCard/InfoCard.css";
21
+ @import "@simplybusiness/mobius-journey/src/components/NextCoverage/NextCoverage.css";
22
+ @import "@simplybusiness/mobius-journey/src/components/PreFooter/InsuranceBenefits.css";
23
+ @import "@simplybusiness/mobius-journey/src/components/PreFooter/PreFooter.css";
24
+ @import "@simplybusiness/mobius-journey/src/components/ProgressSteps/ProgressSteps.css";
25
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/CoverSummary/CoverSummary.css";
26
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/CoverTogglesContainer/CoverTogglesContainer.css";
27
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/Headline/ExperimentIteratedQCP/EditLimitsExperimentIteratedQCP.css";
28
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/Headline/ExperimentIteratedQCP/QuoteHeadlineExperimentIteratedQCP.css";
29
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/Headline/QuoteHeadline.css";
30
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/PaymentToggle/PaymentToggle.css";
31
+ @import "@simplybusiness/mobius-journey/src/components/QuoteComparison/QuoteCards/QuoteCards.css";
32
+ @import "@simplybusiness/mobius-journey/src/components/QuoteHelp/QuoteHelp.css";
33
+ @import "@simplybusiness/mobius-journey/src/components/Referral/Referral.css";
34
+ @import "@simplybusiness/mobius-journey/src/components/TradeSelector/TradeSelector.css";
35
+ @import "@simplybusiness/mobius-journey/src/components/TrustSection/TrustSection.css";
36
+ @import "@simplybusiness/mobius-journey/src/pages/AgentReferralPage/AgentReferralContainer.css";
37
+ @import "@simplybusiness/mobius-journey/src/pages/Main.css";
36
38
 
37
39
  /* @simplybusiness/mobius-datepicker */
38
- @import "../../mobius-datepicker/src/components/DatePicker/DatePicker.css";
40
+ @import "@simplybusiness/mobius-datepicker/src/components/DatePicker/DatePicker.css";
39
41
 
40
42
  /* Base customisation */
41
43
  @import "./fonts.css";