/* Minification failed. Returning unminified contents. (24,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (25,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (26,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (27,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (28,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (29,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (30,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (32,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (33,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (34,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (35,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (36,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (38,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (39,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (40,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (41,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (42,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (43,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (44,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (46,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (47,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (48,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (49,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (50,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (51,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (53,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (54,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (55,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (56,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (57,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (58,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (65,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (66,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (67,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (68,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (69,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (70,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (71,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (72,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (73,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (74,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (77,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (78,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (82,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (83,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (84,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (85,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (86,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (87,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (88,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (89,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (90,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (91,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (92,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (93,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (94,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (95,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (117,23): run-time error CSS1039: Token not allowed after unary operator: '-jv-font' (118,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (128,23): run-time error CSS1039: Token not allowed after unary operator: '-jv-font' (134,23): run-time error CSS1039: Token not allowed after unary operator: '-jv-font' (139,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (141,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (147,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (151,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (156,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (160,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-lg' (165,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (225,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-app-bg' (226,52): run-time error CSS1039: Token not allowed after unary operator: '-jv-app-tint' (232,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-header-bg' (235,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (236,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xs' (255,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (257,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (258,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-sm' (259,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (259,42): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-spring' (259,76): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (259,90): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (270,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-md' (281,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (282,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-lg' (288,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (289,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (299,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (303,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (304,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-md' (313,32): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-slow' (313,51): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (330,32): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (341,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (342,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (346,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (348,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (348,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (352,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (369,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (374,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (374,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (374,69): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (374,83): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-spring' (379,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (394,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (394,53): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (394,82): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (394,96): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (404,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (405,29): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (405,43): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (415,33): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (415,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (430,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (433,46): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (433,66): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-700' (446,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (447,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (452,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (453,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (460,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (469,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (499,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-xl' (500,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-800' (501,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-md' (516,33): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (552,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-2xl' (566,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (581,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (583,32): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-slow' (583,51): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (597,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (618,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (654,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-900' (672,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (674,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (675,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (676,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-slow' (676,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (686,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (688,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (699,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (731,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (732,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (733,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (734,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (735,24): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (736,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-sm' (737,33): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (737,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (737,76): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (737,90): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (737,116): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (737,130): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (746,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-lg' (751,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-md' (768,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (768,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (768,80): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (768,99): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (768,128): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (768,147): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (768,174): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (768,188): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (768,214): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (768,233): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (768,255): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (768,274): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (786,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (786,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (821,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (822,46): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (822,66): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand-strong' (824,30): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (824,44): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (824,70): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (824,84): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (833,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (837,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (837,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (842,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link-hover' (852,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (853,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (854,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-lg' (859,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (871,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (872,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (872,58): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (872,80): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (872,99): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (882,15): run-time error CSS1039: Token not allowed after unary operator: '-bs-app-header-height' (885,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (886,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (887,34): run-time error CSS1039: Token not allowed after unary operator: '-bs-card-inner-border-radius' (888,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-card-inner-border-radius' (917,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (918,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (923,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (935,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (937,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (937,42): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (941,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (946,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (962,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (963,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (964,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (966,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (966,53): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (966,75): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (966,89): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (966,116): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (966,130): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (966,152): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (966,166): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-spring' (974,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (980,41): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (985,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (1007,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (1008,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (1014,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (1015,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1029,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (1063,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1065,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (1079,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (1080,32): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1081,37): run-time error CSS1039: Token not allowed after unary operator: '-bs-card-inner-border-radius' (1082,38): run-time error CSS1039: Token not allowed after unary operator: '-bs-card-inner-border-radius' (1090,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (1091,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1095,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-400' (1110,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1111,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (1112,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (1120,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1121,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1122,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1123,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1127,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (1128,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xl' (1133,38): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-spring' (1145,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1146,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1162,34): run-time error CSS1039: Token not allowed after unary operator: '-bs-modal-inner-border-radius' (1163,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-modal-inner-border-radius' (1175,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-lg' (1192,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1204,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1209,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1209,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1209,70): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (1209,84): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1222,46): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-800' (1232,32): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1245,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1246,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1246,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1246,81): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1246,100): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1246,133): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1246,152): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1252,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-ring' (1268,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1268,58): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1268,87): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1268,106): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1268,133): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1268,152): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1279,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (1284,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-lg' (1285,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (1298,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (1299,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (1306,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (1307,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (1321,24): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-300' (1326,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (1334,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (1335,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (1336,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1337,24): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-300' (1342,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (1343,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (1351,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1370,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1373,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1373,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (1386,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1387,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1387,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1387,81): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1387,100): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1392,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-ring' (1400,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1401,24): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-300' (1405,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (1409,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (1410,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (1411,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-lg' (1412,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (1416,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1416,58): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1416,80): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1416,99): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1420,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (1421,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-lg' (1422,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (1446,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1448,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (1450,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1450,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1450,80): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1450,99): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1454,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (1487,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1491,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (1495,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1495,58): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1495,85): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1495,104): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1499,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1517,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-100' (1518,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (1519,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (1527,34): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1528,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1532,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1533,38): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1538,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (1543,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1554,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (1559,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (1572,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (1579,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link-hover' (1586,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1587,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1593,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (1594,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1604,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1648,32): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1664,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (1665,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1673,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (1674,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1697,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1698,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (1707,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1707,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1707,80): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1707,99): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1707,126): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1707,145): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1707,171): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (1707,190): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1739,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (1740,45): run-time error CSS1039: Token not allowed after unary operator: '-jv-skeleton-a' (1740,71): run-time error CSS1039: Token not allowed after unary operator: '-jv-skeleton-b' (1740,97): run-time error CSS1039: Token not allowed after unary operator: '-jv-skeleton-a' (1771,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-slow' (1771,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (1781,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (1787,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (1804,38): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1813,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-xl' (1816,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xl' (1817,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-spring' (1836,16): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (1840,16): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-800' (1868,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (1898,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (1902,16): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (1903,18): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-800' (1942,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (1952,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (1981,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (1989,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (1996,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (1997,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-lg' (2006,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (2007,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2008,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-surface-muted' (2009,29): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-400' (2010,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2012,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2012,53): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2012,82): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2012,96): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2017,24): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2030,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2032,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (2034,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2034,53): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2038,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand-strong' (2056,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2057,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2058,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (2059,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xs' (2060,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2060,49): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (2065,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2075,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (2081,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2082,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2095,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (2097,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2099,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (2099,47): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2099,80): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (2099,99): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2122,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (2123,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2133,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2140,45): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2141,34): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (2153,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2154,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (2163,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-100' (2164,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2165,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (2189,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2190,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2191,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (2192,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2192,49): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2192,82): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2192,96): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2192,123): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2192,137): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2196,24): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-300' (2197,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xs' (2230,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2234,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (2241,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2242,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2251,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2280,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2296,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2297,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (2298,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-surface-muted' (2310,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2311,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2312,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (2313,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xs' (2318,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2319,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (2328,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2329,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2330,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xl' (2340,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2341,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2346,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (2347,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2354,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-700' (2355,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2368,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (2369,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2373,33): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-300' (2390,35): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2404,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2405,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (2406,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-surface-muted' (2407,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (2408,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-md' (2411,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2411,49): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2411,82): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2411,96): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2411,123): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur' (2411,137): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2426,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2446,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2447,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (2454,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2455,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-md' (2461,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2470,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2471,39): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-fast' (2471,58): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease' (2479,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (2483,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (2487,31): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2494,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-xl' (2495,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-xl' (2499,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2500,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xl' (2505,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2506,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-md' (2520,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2521,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2538,32): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2539,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (2559,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2565,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2574,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-app-bg' (2590,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-navy-800' (2625,38): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (2640,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-lg' (2658,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-md' (2670,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-sm' (2683,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2712,28): run-time error CSS1039: Token not allowed after unary operator: '-jv-border' (2713,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-xl' (2714,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (2715,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-shadow-lg' (2716,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (2729,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (2730,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (2738,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2739,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-2xl' (2746,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2747,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-md' (2757,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2758,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (2759,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-slow' (2759,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (2779,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (2793,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-md' (2796,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (2800,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (2801,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-800' (2816,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2845,32): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2846,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2847,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (2862,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2863,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2867,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (2872,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (2884,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-radius-lg' (2885,37): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-spring' (2923,35): run-time error CSS1039: Token not allowed after unary operator: '-jv-dur-slow' (2923,54): run-time error CSS1039: Token not allowed after unary operator: '-jv-ease-out' (2947,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-200' (2965,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-300' (2967,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-bg' (2968,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-500' (2969,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (2986,24): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2987,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-brand' (2988,22): run-time error CSS1039: Token not allowed after unary operator: '-jv-ring' (2998,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-900' (2999,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-base' (3005,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-gray-600' (3006,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-sm' (3016,17): run-time error CSS1039: Token not allowed after unary operator: '-jv-link' (3017,21): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xs' (3051,25): run-time error CSS1039: Token not allowed after unary operator: '-jv-fs-xl' */ /* ========================================================================== JVMS Vendor Portal design layer -------------------------------------------------------------------------- Loaded LAST (BundleConfig "~/Content/lib/site/css"), so it refines the Metronic 8 theme (style.bundle.css) without editing vendor files. Same tokens and motion language as the internal JVMS app (C:\...\repos\JVMS\JVMS\Content\css\Site.css) so both products feel like one. Rules for this file: - Release builds minify this through WebGrease. Keep selectors flat: no :is()/:where()/:has(), no @supports/@layer, no CSS nesting, no clamp()/min()/max(). - No relative url(): bundling serves this file from /Content/lib/site/, so relative paths break. Pass image URLs inline from Razor via Url.Content. - Animate with the individual `translate` / `scale` properties rather than `transform`, so Popper / Bootstrap inline transforms are never clobbered. - Every animation is disabled under prefers-reduced-motion (bottom of file). ========================================================================== */ /* -------------------------------------------------------------------------- 1. Design tokens -------------------------------------------------------------------------- */ :root { --jv-brand: #1B84FF; --jv-brand-rgb: 27, 132, 255; --jv-brand-strong: #0B5ED7; --jv-navy-950: #070D19; --jv-navy-900: #0A1222; --jv-navy-800: #0F1B33; --jv-navy-700: #16264A; --jv-radius-xs: 6px; --jv-radius-sm: 8px; --jv-radius-md: 10px; --jv-radius-lg: 14px; --jv-radius-xl: 18px; --jv-border: rgba(15, 23, 42, .07); --jv-shadow-xs: 0 1px 2px rgba(15, 23, 42, .05); --jv-shadow-sm: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04); --jv-shadow-md: 0 6px 16px -4px rgba(15, 23, 42, .10), 0 2px 6px -2px rgba(15, 23, 42, .05); --jv-shadow-lg: 0 16px 32px -8px rgba(15, 23, 42, .16), 0 4px 10px -4px rgba(15, 23, 42, .06); --jv-shadow-xl: 0 28px 56px -12px rgba(15, 23, 42, .30); --jv-ring: 0 0 0 3px rgba(27, 132, 255, .22); --jv-ease: cubic-bezier(.22, .61, .36, 1); --jv-ease-out: cubic-bezier(.16, 1, .3, 1); --jv-ease-spring: cubic-bezier(.34, 1.3, .64, 1); --jv-dur-fast: 150ms; --jv-dur: 220ms; --jv-dur-slow: 420ms; --jv-app-bg: #F3F6FB; --jv-app-tint: rgba(27, 132, 255, .07); --jv-header-bg: rgba(255, 255, 255, .82); --jv-surface-muted: #F8FAFD; --jv-skeleton-a: #EEF1F6; --jv-skeleton-b: #E2E7EF; /* Typography: one standard system font and one fixed scale (15px body; one step up from 14px on 2026-11-02 at the user's request). Inter (Metronic's default) is not shipped, so use the platform UI font stack. Sizes are in px on purpose: Metronic shrinks the rem root below 992px, which made body text ~12px on tablets / phones. */ --jv-font: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif; --jv-fs-xs: 13px; /* meta, uppercase labels - the minimum size */ --jv-fs-sm: 14px; /* secondary text, hints, small buttons */ --jv-fs-base: 15px; /* body, inputs, labels, table cells, buttons */ --jv-fs-md: 16px; /* section headings */ --jv-fs-lg: 17px; /* card titles, large inputs */ --jv-fs-xl: 21px; /* sub-page titles */ --jv-fs-2xl: 25px; /* page titles */ --bs-font-sans-serif: var(--jv-font); --bs-body-font-family: var(--jv-font); /* Text-safe link blue (5.7:1 on white; brand #1B84FF is only 3.6:1). */ --jv-link: #0B63CE; --jv-link-hover: #084C9E; } [data-bs-theme=dark] { --jv-border: rgba(255, 255, 255, .07); --jv-shadow-xs: 0 1px 2px rgba(0, 0, 0, .35); --jv-shadow-sm: 0 1px 3px rgba(0, 0, 0, .40), 0 1px 2px rgba(0, 0, 0, .30); --jv-shadow-md: 0 6px 16px -4px rgba(0, 0, 0, .50), 0 2px 6px -2px rgba(0, 0, 0, .35); --jv-shadow-lg: 0 16px 32px -8px rgba(0, 0, 0, .60), 0 4px 10px -4px rgba(0, 0, 0, .40); --jv-shadow-xl: 0 28px 56px -12px rgba(0, 0, 0, .70); --jv-app-bg: #0F1014; --jv-app-tint: rgba(62, 151, 255, .06); --jv-header-bg: rgba(21, 23, 28, .82); --jv-surface-muted: #1B1D24; --jv-skeleton-a: #1B1D24; --jv-skeleton-b: #262932; --jv-link: #5AA6FF; --jv-link-hover: #8CC0FF; } /* -------------------------------------------------------------------------- 1b. Typography - one font, one scale -------------------------------------------------------------------------- */ /* Root size, one step up from Metronic's 13px / 12px (pinned there with !important), as in JVMS. Metronic's rem-based utilities (fs-*), menus, badges, icons and spacing scale with it. */ html { font-size: 14px !important; } @media (max-width: 991.98px) { html { font-size: 13px !important; } } /* Metronic also pins body at 13px / 12px with !important, so the scale's body size needs it too (until 2026-11-02 plain body text stayed at 13px). */ body { font-family: var(--jv-font); font-size: var(--jv-fs-base) !important; line-height: 1.5; text-rendering: optimizeLegibility; } .select2-container, .select2-dropdown, .flatpickr-calendar, .swal2-popup, .toast { font-family: var(--jv-font); } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, input, select, textarea, button, .btn, .form-control, .form-select, .menu, .dropdown-menu, .modal, .table { font-family: var(--jv-font); } .form-label, .col-form-label { font-size: var(--jv-fs-base); font-weight: 600; color: var(--bs-gray-800); } /* Metronic's default controls are 14.3px / 12.35px; snap them to the scale. */ .form-control, .form-select { font-size: var(--jv-fs-base); } .btn { font-size: var(--jv-fs-base); font-weight: 600; } .btn.btn-sm { font-size: var(--jv-fs-sm); } .btn.btn-lg { font-size: var(--jv-fs-lg); } .menu-sub-dropdown .menu-link, .menu-sub-dropdown .menu-title { font-size: var(--jv-fs-base); } .table { font-variant-numeric: tabular-nums; } /* -------------------------------------------------------------------------- 2. Keyframes -------------------------------------------------------------------------- */ @keyframes jv-fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes jv-fade-up { from { opacity: 0; translate: 0 10px; } to { opacity: 1; translate: 0 0; } } @keyframes jv-fade-up-sm { from { opacity: 0; translate: 0 6px; } to { opacity: 1; translate: 0 0; } } @keyframes jv-pop-in { from { opacity: 0; translate: 0 6px; scale: .98; } to { opacity: 1; translate: 0 0; scale: 1; } } @keyframes jv-toast-in { from { opacity: 0; translate: 28px 0; scale: .96; } to { opacity: 1; translate: 0 0; scale: 1; } } @keyframes jv-toast-out { from { opacity: 1; translate: 0 0; scale: 1; } to { opacity: 0; translate: 28px 0; scale: .96; } } @keyframes jv-spin { to { rotate: 360deg; } } @keyframes jv-shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } } @keyframes jv-pulse-dot { 0% { box-shadow: 0 0 0 0 rgba(124, 196, 255, .55); } 100% { box-shadow: 0 0 0 7px rgba(124, 196, 255, 0); } } /* -------------------------------------------------------------------------- 3. App shell: background, header, footer, page entrance -------------------------------------------------------------------------- */ body.jv-app-bg { background-color: var(--jv-app-bg); background-image: linear-gradient(180deg, var(--jv-app-tint) 0, rgba(255, 255, 255, 0) 420px); background-repeat: no-repeat; background-attachment: fixed; } #kt_app_header { background-color: var(--jv-header-bg); -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px); border-bottom: 1px solid var(--jv-border); box-shadow: var(--jv-shadow-xs); } /* Brand lockup (header, auth pages) */ .jv-brand { display: flex; align-items: center; gap: .75rem; min-width: 0; text-decoration: none; } .jv-brand-mark { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: var(--jv-radius-md); background-color: #fff; border: 1px solid var(--jv-border); box-shadow: var(--jv-shadow-sm); transition: scale var(--jv-dur) var(--jv-ease-spring), box-shadow var(--jv-dur) var(--jv-ease); } .jv-brand-mark img { width: 30px; height: auto; border-radius: 3px; } .jv-brand:hover .jv-brand-mark { scale: 1.06; box-shadow: var(--jv-shadow-md); } .jv-brand-text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; } .jv-brand-name { color: var(--bs-gray-900); font-size: var(--jv-fs-lg); font-weight: 700; letter-spacing: .04em; } .jv-brand-caption { color: var(--bs-gray-500); font-size: var(--jv-fs-xs); font-weight: 600; letter-spacing: .02em; white-space: nowrap; } .jv-header-divider { width: 1px; height: 28px; margin: 0 1.25rem; background-color: var(--bs-gray-200); } .jv-header-title { color: var(--bs-gray-700); font-size: var(--jv-fs-md); font-weight: 600; white-space: nowrap; } /* Page entrance: top-level blocks of every page fade up, staggered. fill-mode "backwards" leaves no transform behind once finished, so fixed / Popper-positioned / sticky descendants are never trapped in a containing block. */ #kt_app_content_container > .app-main > * { animation: jv-fade-up var(--jv-dur-slow) var(--jv-ease-out) backwards; } #kt_app_content_container > .app-main > *:nth-child(2) { animation-delay: 70ms; } #kt_app_content_container > .app-main > *:nth-child(3) { animation-delay: 140ms; } #kt_app_content_container > .app-main > *:nth-child(n+4) { animation-delay: 210ms; } #kt_app_footer { background-color: transparent; border-top: 1px solid var(--jv-border); } .jv-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1.5rem; padding-top: 1.1rem; padding-bottom: 1.1rem; color: var(--bs-gray-600); font-size: var(--jv-fs-sm); } .jv-footer a { color: var(--bs-gray-700); font-weight: 600; transition: color var(--jv-dur-fast) var(--jv-ease); } .jv-footer a:hover { color: var(--jv-link); } .jv-footer-links { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; } /* -------------------------------------------------------------------------- 4. Header navbar: icon buttons, user chip, avatar -------------------------------------------------------------------------- */ .btn.jv-icon-btn { width: 40px; height: 40px; border-radius: 50%; color: var(--bs-gray-600); } .btn.jv-icon-btn i { color: inherit; transition: color var(--jv-dur-fast) var(--jv-ease), scale var(--jv-dur) var(--jv-ease-spring); } .btn.jv-icon-btn:hover, .btn.jv-icon-btn.show { color: var(--jv-brand); background-color: rgba(27, 132, 255, .08); } .btn.jv-icon-btn:hover i { scale: 1.08; } .jv-user-chip { display: flex; align-items: center; max-width: 320px; padding: .25rem .65rem .25rem .25rem; border: 1px solid transparent; border-radius: 999px; transition: background-color var(--jv-dur) var(--jv-ease), border-color var(--jv-dur) var(--jv-ease); } .jv-user-chip:hover, .jv-user-chip.show { background-color: rgba(27, 132, 255, .08); border-color: rgba(27, 132, 255, .12); } .jv-user-chip .ki-down { color: var(--bs-gray-500); transition: rotate var(--jv-dur) var(--jv-ease); } .jv-user-chip.show .ki-down { rotate: 180deg; } .jv-avatar .symbol-label { border-radius: 50% !important; box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(27, 132, 255, .25); transition: box-shadow var(--jv-dur) var(--jv-ease); } [data-bs-theme=dark] .jv-avatar .symbol-label { box-shadow: 0 0 0 2px #15171C, 0 0 0 4px rgba(27, 132, 255, .35); } .jv-user-chip:hover .jv-avatar .symbol-label { box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(27, 132, 255, .6); } .jv-avatar-fallback { align-items: center; justify-content: center; font-weight: 700; font-size: var(--jv-fs-sm); letter-spacing: .02em; color: #fff !important; background: linear-gradient(135deg, var(--jv-brand) 0%, var(--jv-navy-700) 100%) !important; } .jv-user-text { min-width: 0; } .jv-user-name { display: block; max-width: 220px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--bs-gray-900); font-size: var(--jv-fs-base); font-weight: 600; } .jv-user-role { color: var(--bs-gray-500); font-size: var(--jv-fs-xs); font-weight: 500; } .jv-menu-icon { display: inline-flex; width: 1.75rem; color: var(--bs-gray-500); } .jv-menu-icon i { color: inherit; font-size: 1.35rem; } .menu-sub-dropdown .menu-link:hover .jv-menu-icon { color: var(--jv-brand); } .menu-link.jv-menu-danger:hover { color: #C21E45 !important; background-color: rgba(248, 40, 90, .08) !important; } .menu-link.jv-menu-danger:hover .jv-menu-icon { color: #C21E45; } /* "Sign out" is a form button (POST with an anti-forgery token), drawn like the other menu links. */ .jv-menu-button { width: 100%; border: 0; color: inherit; background-color: transparent; text-align: left; cursor: pointer; } /* -------------------------------------------------------------------------- 5. Page hero (Views/Home/Index.cshtml) -------------------------------------------------------------------------- */ .jv-hero { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--jv-radius-xl); background-color: var(--jv-navy-800); box-shadow: var(--jv-shadow-md); color: #fff; } .jv-hero-bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; background-repeat: no-repeat; background-size: cover; background-position: center 40%; scale: 1.03; transition: scale 1.6s var(--jv-ease-out); } .jv-hero:hover .jv-hero-bg { scale: 1.06; } .jv-hero::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(100deg, rgba(10, 18, 34, .94) 0%, rgba(10, 18, 34, .78) 45%, rgba(11, 94, 215, .30) 100%); } .jv-hero-body { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.25rem; min-height: 136px; padding: 1.75rem 2rem; } .jv-hero-text { min-width: 0; flex: 1 1 360px; } .jv-hero-title { margin: .45rem 0 0; color: #fff; font-size: var(--jv-fs-2xl); font-weight: 700; letter-spacing: -.015em; line-height: 1.2; overflow-wrap: anywhere; } .jv-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .75rem; color: rgba(255, 255, 255, .72); font-size: var(--jv-fs-sm); } /* Status chip (text and tone set by GeneralInfo() in Content/js/Vendor.js) */ .jv-hero-status { display: inline-flex; align-items: center; gap: .5rem; padding: .3rem .8rem; border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; background-color: rgba(255, 255, 255, .1); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-size: var(--jv-fs-sm); font-weight: 600; animation: jv-fade-in var(--jv-dur-slow) var(--jv-ease) backwards; } .jv-hero-status:empty { display: none; } .jv-hero-status::before { content: ""; width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background-color: #7CC4FF; animation: jv-pulse-dot 1.8s var(--jv-ease) infinite; } .jv-hero-status.is-success::before { background-color: #4ADE80; } .jv-hero-status.is-warning::before { background-color: #FACC15; } .jv-hero-status.is-danger::before { background-color: #FB7185; } .jv-hero-actions { display: flex; flex-wrap: wrap; gap: .5rem; } .jv-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin: 0; padding: 0; list-style: none; font-size: var(--jv-fs-sm); font-weight: 500; } .jv-breadcrumb li { display: inline-flex; align-items: center; gap: .45rem; color: rgba(255, 255, 255, .6); } .jv-breadcrumb li + li::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background-color: rgba(255, 255, 255, .4); } .jv-breadcrumb li[aria-current=page] { color: #fff; } .btn.jv-hero-btn { display: inline-flex; align-items: center; gap: .45rem; color: #fff; background-color: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .18) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .btn.jv-hero-btn:hover, .btn.jv-hero-btn:focus-visible { color: var(--jv-navy-900); background-color: #fff; } .btn.jv-hero-btn i { color: inherit !important; } /* -------------------------------------------------------------------------- 6. Notices (inline banners) -------------------------------------------------------------------------- */ .jv-notice { display: flex; align-items: flex-start; gap: .9rem; padding: 1rem 1.25rem; border: 1px solid rgba(27, 132, 255, .22); border-radius: var(--jv-radius-lg); background-color: rgba(27, 132, 255, .06); color: var(--bs-gray-800); font-size: var(--jv-fs-base); animation: jv-fade-up-sm var(--jv-dur-slow) var(--jv-ease-out) backwards; } .jv-notice-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: var(--jv-radius-md); background-color: rgba(27, 132, 255, .12); color: var(--jv-brand); } .jv-notice-icon i { color: inherit; font-size: 1.5rem; } .jv-notice-title { display: block; margin-bottom: .1rem; color: var(--bs-gray-900); font-weight: 600; } .jv-notice.jv-notice-warning { border-color: rgba(246, 192, 0, .38); background-color: rgba(246, 192, 0, .08); } .jv-notice.jv-notice-warning .jv-notice-icon { background-color: rgba(246, 192, 0, .18); color: #8A5A00; } .jv-notice.jv-notice-success { border-color: rgba(23, 198, 83, .3); background-color: rgba(23, 198, 83, .07); } .jv-notice.jv-notice-success .jv-notice-icon { background-color: rgba(23, 198, 83, .14); color: #0B7A3E; } [data-bs-theme=dark] .jv-notice.jv-notice-warning .jv-notice-icon { color: #FACC15; } [data-bs-theme=dark] .jv-notice.jv-notice-success .jv-notice-icon { color: #4ADE80; } /* -------------------------------------------------------------------------- 7. Cards -------------------------------------------------------------------------- */ .card { --bs-card-border-radius: var(--jv-radius-lg); --bs-card-inner-border-radius: calc(var(--jv-radius-lg) - 1px); --bs-card-box-shadow: var(--jv-shadow-sm); --bs-card-border-color: var(--jv-border); border-color: var(--jv-border); box-shadow: var(--jv-shadow-sm); transition: box-shadow var(--jv-dur) var(--jv-ease), border-color var(--jv-dur) var(--jv-ease), translate var(--jv-dur) var(--jv-ease); } .card .card { box-shadow: none; } .jv-card-hover:hover { translate: 0 -2px; box-shadow: var(--jv-shadow-lg); } /* The vendor form: one elevated card with sticky tabs on top and a sticky action bar below. */ .card.jv-form-card { box-shadow: var(--jv-shadow-md); } /* AJAX table partials render their own .card. Flatten it inside its frame. */ .card-loadercontainer > .card, .jv-embed > .card, .jv-table-frame > .card { border: 0; box-shadow: none; background-color: transparent; } /* -------------------------------------------------------------------------- 8. Buttons -------------------------------------------------------------------------- */ .btn { transition: color var(--jv-dur-fast) var(--jv-ease), background-color var(--jv-dur-fast) var(--jv-ease), border-color var(--jv-dur-fast) var(--jv-ease), box-shadow var(--jv-dur) var(--jv-ease), translate var(--jv-dur-fast) var(--jv-ease), scale var(--jv-dur-fast) var(--jv-ease); } .btn:not(.btn-icon):not(.btn-flush):not(.nav-link):not(:disabled):not(.disabled):hover { translate: 0 -1px; } .btn:not(:disabled):not(.disabled):active { translate: 0 0; scale: .97; } .btn:focus-visible { outline: 2px solid rgba(27, 132, 255, .6); outline-offset: 2px; } .btn i { transition: color var(--jv-dur-fast) var(--jv-ease); } /* Specificity beats Metronic's ".btn:not(.btn-shadow):not(.shadow)..." reset. */ .btn.btn-primary:not(.btn-icon):not(.btn-flush):not(:disabled):not(.disabled):hover { box-shadow: 0 8px 18px -8px rgba(27, 132, 255, .75); } .btn.btn-success:not(.btn-icon):not(.btn-flush):not(:disabled):not(.disabled):hover { box-shadow: 0 8px 18px -8px rgba(23, 198, 83, .7); } .btn.btn-danger:not(.btn-icon):not(.btn-flush):not(:disabled):not(.disabled):hover { box-shadow: 0 8px 18px -8px rgba(248, 40, 90, .7); } .btn:disabled, .btn.disabled { cursor: not-allowed; } /* Busy state - jvSetBusy() in Content/js/common.js */ .btn.jv-busy { cursor: progress; } .btn .jv-busy-spinner { width: 1rem; height: 1rem; margin-right: .45rem; border-width: .15em; vertical-align: -.15em; } #kt_scrolltop { border-radius: var(--jv-radius-md); background: linear-gradient(135deg, var(--jv-brand) 0%, var(--jv-brand-strong) 100%); box-shadow: 0 10px 22px -8px rgba(27, 132, 255, .7); transition: opacity var(--jv-dur) var(--jv-ease), translate var(--jv-dur) var(--jv-ease); } #kt_scrolltop:hover { translate: 0 -2px; } /* Inline text button (links styled as actions) */ .jv-link { color: var(--jv-link); font-weight: 600; text-decoration: none; cursor: pointer; transition: color var(--jv-dur-fast) var(--jv-ease); } .jv-link:hover, .jv-link:focus-visible { color: var(--jv-link-hover); text-decoration: underline; text-underline-offset: 3px; } /* -------------------------------------------------------------------------- 9. Dropdown menus (Metronic KTMenu) -------------------------------------------------------------------------- */ .menu-sub-dropdown { border: 1px solid var(--jv-border); border-radius: var(--jv-radius-lg); box-shadow: var(--jv-shadow-lg); } .menu-sub-dropdown.show[data-popper-placement], .show.menu-dropdown > .menu-sub-dropdown { animation: jv-pop-in 180ms var(--jv-ease-out) backwards; } .menu-sub-dropdown[data-popper-placement=bottom-end] { transform-origin: top right; } .menu-sub-dropdown[data-popper-placement=bottom-start] { transform-origin: top left; } .menu-sub-dropdown .menu-link { border-radius: var(--jv-radius-sm); transition: background-color var(--jv-dur-fast) var(--jv-ease), color var(--jv-dur-fast) var(--jv-ease); } /* -------------------------------------------------------------------------- 10. Step tabs (vendor form) -------------------------------------------------------------------------- */ /* Docks under the fixed header while the form scrolls. */ .jv-tabbar { position: sticky; top: var(--bs-app-header-height, 70px); z-index: 6; padding: .5rem .6rem; background-color: var(--bs-body-bg); border-bottom: 1px solid var(--bs-gray-200); border-top-left-radius: var(--bs-card-inner-border-radius); border-top-right-radius: var(--bs-card-inner-border-radius); } .jv-tabs { display: flex; flex-wrap: nowrap; gap: .25rem; margin: 0; padding: 2px; overflow-x: auto; list-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .jv-tabs::-webkit-scrollbar { display: none; } .jv-tabs > .nav-item { flex: 0 0 auto; } .jv-tabs .nav-link.btn { position: relative; display: inline-flex; align-items: center; gap: .55rem; padding: .6rem .9rem .6rem .65rem !important; color: var(--bs-gray-600) !important; font-size: var(--jv-fs-base) !important; font-weight: 600 !important; white-space: nowrap; background-color: transparent; border: 0 !important; border-radius: var(--jv-radius-md); } /* Underline stays inside the pill: .jv-tabs scrolls horizontally, which clips overflow. */ .jv-tabs .nav-link.btn::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 3px; height: 2px; border-radius: 2px; background-color: var(--jv-brand); scale: 0 1; transition: scale var(--jv-dur) var(--jv-ease-out); } .jv-tabs .nav-link.btn:not(.active):hover { color: var(--bs-gray-900) !important; background-color: rgba(27, 132, 255, .06); } .jv-tabs .nav-link.btn.active { color: var(--bs-gray-900) !important; background-color: rgba(27, 132, 255, .08); } .jv-tabs .nav-link.btn.active::after { scale: 1 1; } .jv-tab-step { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; background-color: var(--bs-gray-200); color: var(--bs-gray-700); font-size: var(--jv-fs-xs); font-weight: 700; transition: background-color var(--jv-dur) var(--jv-ease), color var(--jv-dur) var(--jv-ease), box-shadow var(--jv-dur) var(--jv-ease), scale var(--jv-dur) var(--jv-ease-spring); } .jv-tabs .nav-link.btn:hover .jv-tab-step { scale: 1.06; } .jv-tabs .nav-link.btn.active .jv-tab-step { background-color: var(--jv-brand); color: #fff; box-shadow: 0 4px 10px -4px rgba(27, 132, 255, .9); } .tab-content > .tab-pane.active { animation: jv-fade-up-sm 260ms var(--jv-ease-out) backwards; } /* Legacy pill tabs (.nav .nav-link.btn) elsewhere */ .nav .nav-link.btn { border-radius: var(--jv-radius-md); } /* -------------------------------------------------------------------------- 11. Form layout: panes, sections, sticky action bar -------------------------------------------------------------------------- */ .jv-pane { padding: 1.75rem 2rem 2.25rem; } .jv-form-section + .jv-form-section { margin-top: 2.25rem; } .jv-form-section > .hr-with-title { margin-bottom: 1.15rem; } .jv-section-intro { max-width: 72ch; margin: -.4rem 0 1.15rem; color: var(--bs-gray-600); font-size: var(--jv-fs-base); } .jv-field-hint { display: block; margin-top: .35rem; color: var(--bs-gray-500); font-size: var(--jv-fs-sm); } /* Field with a leading icon (date pickers) */ .jv-input-icon { position: relative; display: flex; align-items: center; } .jv-input-icon > i { position: absolute; left: .9rem; z-index: 1; color: var(--bs-gray-500); font-size: 1.35rem; pointer-events: none; } .jv-input-icon > .form-control { padding-left: 2.75rem !important; } /* A row of related checkboxes (Form of Business, Type of Business, ...). */ .jv-check-group { display: flex; flex-wrap: wrap; gap: .85rem 2rem; } .jv-check-group .form-check { margin: 0; } /* Checkbox that heads a field (Main office / Plant) */ .jv-check-label { display: flex; align-items: center; gap: .55rem; margin-bottom: .5rem; } .jv-check-label .form-check-input { margin: 0; flex-shrink: 0; } .jv-check-label .form-check-label { font-size: var(--jv-fs-sm); font-weight: 600; color: var(--bs-gray-700); } /* Sticky action bar at the bottom of the form card */ .card > .card-footer.jv-actionbar { position: sticky; bottom: 0; z-index: 6; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; padding: .9rem 1.5rem; background-color: var(--bs-body-bg); border-top: 1px solid var(--bs-gray-200); border-bottom-left-radius: var(--bs-card-inner-border-radius); border-bottom-right-radius: var(--bs-card-inner-border-radius); box-shadow: 0 -12px 24px -20px rgba(15, 23, 42, .45); } .jv-actionbar-hint { display: flex; align-items: center; gap: .5rem; color: var(--bs-gray-600); font-size: var(--jv-fs-sm); } .jv-actionbar-hint i { color: var(--bs-gray-400); font-size: 1.35rem; } .jv-actionbar-buttons { display: flex; flex-wrap: wrap; gap: .5rem; margin-left: auto; } /* Frame around an embedded AJAX table */ .jv-table-frame { position: relative; min-height: 120px; border: 1px solid var(--bs-gray-200); border-radius: var(--jv-radius-lg); background-color: var(--bs-body-bg); } /* -------------------------------------------------------------------------- 12. Modals -------------------------------------------------------------------------- */ .modal { --bs-modal-border-radius: var(--jv-radius-xl); --bs-modal-inner-border-radius: calc(var(--jv-radius-xl) - 1px); --bs-modal-box-shadow: var(--jv-shadow-xl); --bs-modal-border-color: var(--jv-border); } .modal-content { border: 1px solid var(--jv-border); box-shadow: var(--jv-shadow-xl); } .modal.fade .modal-dialog { transform: translate(0, 18px) scale(.97); transition: transform 320ms var(--jv-ease-spring); } .modal.show .modal-dialog { transform: none; } .modal.modal-static .modal-dialog { transform: scale(1.015); } .modal-backdrop { --bs-backdrop-bg: #0B1220; --bs-backdrop-opacity: .45; } .modal-backdrop.show { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); } /* Shared header used by every modal:
*/ .modal-header-new { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 58px; padding: .5rem 1rem .5rem 1.5rem !important; border-top-left-radius: var(--bs-modal-inner-border-radius); border-top-right-radius: var(--bs-modal-inner-border-radius); border-bottom: 1px solid rgba(255, 255, 255, .08); } .modal-header-new > h5, .modal-header-new > h6 { display: flex; align-items: center; gap: .6rem; margin: 0 !important; padding: 0 !important; color: #fff; font-size: var(--jv-fs-lg) !important; font-weight: 600 !important; letter-spacing: -.005em; } .modal-header-new > h5 img, .modal-header-new > h6 img { height: 22px !important; margin: 0 !important; } .jv-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: var(--jv-radius-sm); background-color: rgba(255, 255, 255, .12); } .jv-modal-icon i { color: #fff; font-size: 1.35rem; } .modal-content .modal-header-new .btn.btn-icon { width: 34px; height: 34px; border-radius: var(--jv-radius-sm); } .modal-content .modal-header-new .btn.btn-icon i { color: rgba(255, 255, 255, .7); transition: color var(--jv-dur-fast) var(--jv-ease), rotate var(--jv-dur) var(--jv-ease); } .modal-content .modal-header-new .btn.btn-icon:hover { background-color: rgba(255, 255, 255, .12); } .modal-content .modal-header-new .btn.btn-icon:hover i { color: #fff; rotate: 90deg; } .myBGColor { background: linear-gradient(120deg, var(--jv-navy-800) 0%, #13306A 55%, #1A5BC4 100%); } .modal-body { padding: 1.5rem; } .modal-footer { gap: .5rem; padding: .85rem 1.5rem; border-top: 1px solid var(--bs-gray-200); } .modal-footer > * { margin: 0; } /* -------------------------------------------------------------------------- 13. Forms, Select2, Flatpickr -------------------------------------------------------------------------- */ .form-control, .form-select { border-radius: var(--jv-radius-sm); transition: border-color var(--jv-dur-fast) var(--jv-ease), box-shadow var(--jv-dur-fast) var(--jv-ease), background-color var(--jv-dur-fast) var(--jv-ease); } .form-control:focus, .form-select:focus { border-color: rgba(27, 132, 255, .55); box-shadow: var(--jv-ring); } .form-control.is-invalid, .form-control.input-validation-error { border-color: #F8285A; } .form-control.is-invalid:focus, .form-select.is-invalid:focus, .form-control.input-validation-error:focus { box-shadow: 0 0 0 3px rgba(248, 40, 90, .18); } .form-check-input { cursor: pointer; transition: background-color var(--jv-dur-fast) var(--jv-ease), border-color var(--jv-dur-fast) var(--jv-ease), box-shadow var(--jv-dur-fast) var(--jv-ease); } .form-check-input:disabled { cursor: default; } /* One control height (36px) and body-size text for every small field. */ .form-control-sm, .form-select-sm { min-height: 36px; font-size: var(--jv-fs-base); } .form-control-lg { min-height: 44px; font-size: var(--jv-fs-lg); border-radius: var(--jv-radius-md); } textarea.form-control { line-height: 1.5; } .form-label { display: block; margin-bottom: .4rem; } .form-check-label { color: var(--bs-gray-800); font-size: var(--jv-fs-base); cursor: pointer; } /* Horizontal forms (label column + field column) used by remaining legacy rows. */ form .row > label[class*="col-"], .modal .row > label[class*="col-"] { color: var(--bs-gray-800); font-size: var(--jv-fs-base) !important; font-weight: 600; line-height: 1.35; } form .row.align-items-start > label[class*="col-"], .modal .row.align-items-start > label[class*="col-"] { padding-top: .7rem; } /* Field edges must be visible on white. Metronic's "solid" fields use gray-100 (#F9F9F9) for both fill and border, which is indistinguishable from the card. */ .form-control.form-control-solid, .form-select.form-select-solid { border-color: var(--bs-gray-300); } .form-control.form-control-solid:focus, .form-select.form-select-solid:focus { background-color: var(--bs-body-bg); border-color: rgba(27, 132, 255, .55); } /* Disabled fields hold real data (read-only values), so keep them readable. */ .form-control:disabled, .form-control.form-control-solid:disabled, .form-select:disabled { color: var(--bs-gray-800); -webkit-text-fill-color: var(--bs-gray-800); background-color: var(--bs-gray-200); border-color: var(--bs-gray-300); opacity: 1; } .form-control:disabled::placeholder { color: var(--bs-gray-500); -webkit-text-fill-color: var(--bs-gray-500); } /* MVC unobtrusive validation */ .field-validation-error { display: block; margin-top: .35rem; color: #D11F4B; font-size: var(--jv-fs-sm); font-weight: 500; } .validation-summary-errors ul { margin: 0; padding: 0; list-style: none; } .validation-summary-valid { display: none; } /* Form validation (common.js jvMarkField): the message under a field that failed a check. */ .jv-field-error { display: block; margin-top: .35rem; color: #D11F4B; font-size: var(--jv-fs-sm); font-weight: 500; line-height: 1.4; animation: jv-fade-up-sm var(--jv-dur-fast) var(--jv-ease-out) backwards; } [data-bs-theme=dark] .jv-field-error { color: #FF6B8E; } .form-check-input.is-invalid { border-color: #F8285A; box-shadow: 0 0 0 3px rgba(248, 40, 90, .18); } .select2-container .select2-selection { border-radius: var(--jv-radius-sm); transition: border-color var(--jv-dur-fast) var(--jv-ease), box-shadow var(--jv-dur-fast) var(--jv-ease); } .select2-container.select2-container--open .select2-selection, .select2-container.select2-container--focus .select2-selection { box-shadow: var(--jv-ring); } .select2-container .select2-selection.is-invalid { border-color: #F8285A !important; } .select2-container.select2-container--disabled .select2-selection { background-color: var(--bs-gray-200) !important; border-color: var(--bs-gray-300) !important; } .select2-container.select2-container--disabled .select2-selection__rendered { color: var(--bs-gray-800) !important; } .select2-container--bootstrap5 .select2-dropdown { border: 1px solid var(--jv-border); border-radius: var(--jv-radius-md); box-shadow: var(--jv-shadow-lg); animation: jv-pop-in 160ms var(--jv-ease-out) backwards; } .select2-container--bootstrap5 .select2-dropdown .select2-results__option { transition: background-color var(--jv-dur-fast) var(--jv-ease), color var(--jv-dur-fast) var(--jv-ease); } .flatpickr-calendar.open { border-radius: var(--jv-radius-lg); box-shadow: var(--jv-shadow-lg); animation: jv-pop-in 180ms var(--jv-ease-out) backwards; } /* Password field with a show/hide toggle */ .jv-password { position: relative; } .jv-password > .form-control { padding-right: 3rem; } .jv-password-toggle { position: absolute; top: 50%; right: .4rem; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-top: -17px; padding: 0; border: 0; border-radius: var(--jv-radius-sm); background-color: transparent; color: var(--bs-gray-500); cursor: pointer; transition: color var(--jv-dur-fast) var(--jv-ease), background-color var(--jv-dur-fast) var(--jv-ease); } .jv-password-toggle:hover { color: var(--jv-brand); background-color: rgba(27, 132, 255, .08); } .jv-password-toggle:focus-visible { outline: 2px solid rgba(27, 132, 255, .6); outline-offset: 1px; } .jv-password-toggle i { color: inherit; font-size: 18px; line-height: 1; } .jv-password-toggle .jv-eye-off { display: none; } .jv-password-toggle[aria-pressed=true] .jv-eye-on { display: none; } .jv-password-toggle[aria-pressed=true] .jv-eye-off { display: inline-block; } /* -------------------------------------------------------------------------- 14. Tables (DataTables + Metronic) -------------------------------------------------------------------------- */ /* ---- 14a. Base ---- */ .table { --bs-table-hover-bg: rgba(27, 132, 255, .045); } .table.fs-7 { font-size: var(--jv-fs-base) !important; } .table > tbody > tr > * { transition: background-color var(--jv-dur-fast) var(--jv-ease), box-shadow var(--jv-dur-fast) var(--jv-ease); } .datatable-scroll-wrapper { border-radius: var(--jv-radius-sm); } /* ---- 14b. List tables: table.jv-dt is added by the init.dt hook in Content/js/common.js ---- */ table.jv-dt.table-bordered { border: 0 !important; } table.jv-dt > thead > tr, table.jv-dt.table-bordered > thead > tr { border: 0 !important; } table.jv-dt > thead > tr > th { padding-top: .7rem !important; padding-bottom: .7rem !important; vertical-align: middle; white-space: nowrap; background-color: var(--bs-gray-100); color: var(--bs-gray-600) !important; font-size: var(--jv-fs-xs) !important; font-weight: 600 !important; letter-spacing: .06em; text-transform: uppercase; border: 0 !important; } table.jv-dt > thead > tr > th:first-child { border-top-left-radius: var(--jv-radius-sm); border-bottom-left-radius: var(--jv-radius-sm); } table.jv-dt > thead > tr > th:last-child { border-top-right-radius: var(--jv-radius-sm); border-bottom-right-radius: var(--jv-radius-sm); } table.jv-dt > thead > tr > th.sorting_asc, table.jv-dt > thead > tr > th.sorting_desc { color: var(--bs-gray-900) !important; } table.jv-dt > tbody > tr { border-top: 0 !important; border-bottom: 1px solid var(--bs-gray-200) !important; } table.jv-dt > tbody > tr:last-child { border-bottom: 0 !important; } table.jv-dt > tbody > tr > td { padding-top: .75rem !important; padding-bottom: .75rem !important; vertical-align: middle; color: var(--bs-gray-700); font-weight: 400; } table.jv-dt > tbody > tr > td.text-dark { color: var(--bs-gray-800) !important; } table.jv-dt.table-bordered > thead > tr > th, table.jv-dt.table-bordered > tbody > tr > td, table.jv-dt.table-bordered > tfoot > tr > td { border-left: 0 !important; border-right: 0 !important; } /* Primary-column links (were bright green "text-success") */ table.jv-dt > tbody a.text-success, table.jv-dt > tbody a.text-primary { color: var(--jv-link) !important; font-weight: 600; text-decoration: none; } table.jv-dt > tbody a.text-success:hover, table.jv-dt > tbody a.text-primary:hover { color: var(--jv-link-hover) !important; text-decoration: underline; text-underline-offset: 3px; } table.jv-dt > tbody .btn.btn-sm:not(.btn-icon) { padding: .4rem .8rem !important; font-size: var(--jv-fs-sm) !important; border-radius: var(--jv-radius-sm); } table.jv-dt td.dataTables_empty { padding: 2.25rem 1rem !important; text-align: center !important; color: var(--bs-gray-500) !important; font-size: var(--jv-fs-sm); } /* Status pills - plain-text "Status" cells, see jvDecorateStatusCells() in common.js */ .jv-status { display: inline-flex; align-items: center; gap: .4rem; padding: .2rem .65rem .2rem .55rem; border-radius: 999px; font-size: var(--jv-fs-sm); font-weight: 600; line-height: 1.5; white-space: nowrap; } .jv-status::before { content: ""; width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background-color: currentColor; } .jv-status-success { color: #0B7A3E; background-color: rgba(23, 198, 83, .12); } .jv-status-warning { color: #8A5A00; background-color: rgba(246, 192, 0, .18); } .jv-status-danger { color: #C21E45; background-color: rgba(248, 40, 90, .10); } .jv-status-info { color: #0B5ED7; background-color: rgba(27, 132, 255, .10); } [data-bs-theme=dark] .jv-status-success { color: #4ADE80; background-color: rgba(74, 222, 128, .12); } [data-bs-theme=dark] .jv-status-warning { color: #FACC15; background-color: rgba(250, 204, 21, .12); } [data-bs-theme=dark] .jv-status-danger { color: #FB7185; background-color: rgba(251, 113, 133, .12); } [data-bs-theme=dark] .jv-status-info { color: #60A5FA; background-color: rgba(96, 165, 250, .12); } /* ---- 14c. Table card chrome: toolbar row, footer, pager ---- */ .jv-table-frame > .card > .card-header, .card-loadercontainer > .card > .card-header { min-height: 0 !important; margin-bottom: 0 !important; padding: .85rem 1rem .75rem !important; gap: .75rem; border-bottom: 0; } .jv-table-frame > .card > .card-body, .card-loadercontainer > .card > .card-body { padding: 0 1rem !important; } .jv-table-frame > .card > .card-footer, .card-loadercontainer > .card > .card-footer { padding: .75rem 1rem !important; background-color: transparent; border-top: 1px solid var(--bs-gray-200); } .card > .card-footer:empty { display: none; } .jv-dt-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; } .jv-dt-meta .dataTables_info { padding: 0 !important; color: var(--bs-gray-600) !important; font-size: var(--jv-fs-sm) !important; } .jv-dt-length { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; color: var(--bs-gray-600); font-size: var(--jv-fs-sm); } .jv-dt-length .dataTables_length, .jv-dt-length .dataTables_length label { display: inline-flex; align-items: center; margin: 0 !important; padding: 0 !important; } .dataTables_paginate .pagination { gap: .25rem; margin: 0 !important; } .dataTables_paginate .page-item .page-link { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 .6rem; border-radius: var(--jv-radius-sm) !important; font-size: var(--jv-fs-sm); font-weight: 600; } .dataTables_paginate .page-item.disabled .page-link { opacity: .4; } .page-item .page-link { transition: color var(--jv-dur-fast) var(--jv-ease), background-color var(--jv-dur-fast) var(--jv-ease), box-shadow var(--jv-dur-fast) var(--jv-ease), translate var(--jv-dur-fast) var(--jv-ease); } .page-item.active .page-link { box-shadow: 0 6px 14px -6px rgba(27, 132, 255, .8); } .page-item:not(.active):not(.disabled) .page-link:hover { translate: 0 -1px; } /* -------------------------------------------------------------------------- 15. Loading, empty & error states -------------------------------------------------------------------------- */ /* Card skeleton - markup from SetCardLoader() in Content/js/common.js */ .jv-skeleton { display: flex; flex-direction: column; gap: .75rem; padding: 1rem; } .jv-skeleton-toolbar { display: flex; justify-content: flex-end; gap: 1rem; margin-bottom: .25rem; } .jv-skel { display: block; border-radius: var(--jv-radius-sm); background: linear-gradient(90deg, var(--jv-skeleton-a) 25%, var(--jv-skeleton-b) 37%, var(--jv-skeleton-a) 63%); background-size: 400% 100%; animation: jv-shimmer 1.4s ease infinite; } .jv-skel-btn { width: 120px; height: 34px; } .jv-skel-head { height: 34px; } .jv-skel-row { height: 16px; } .jv-skel-row:nth-child(even) { width: 92%; } /* Error state - markup from SetErrorCardLoarder() in Content/js/common.js */ .jv-empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; padding: 2.25rem 1.5rem; text-align: center; animation: jv-fade-up-sm var(--jv-dur-slow) var(--jv-ease-out) backwards; } .jv-empty-state img { margin-bottom: .5rem; opacity: .9; } .jv-empty-state h5 { margin: 0; color: var(--bs-gray-900); font-weight: 600; } .jv-empty-state p { margin: 0 0 .75rem; color: var(--bs-gray-600); } /* Full-screen loader - showLoader()/hideLoader() toggle display on #loaderModal */ .loader-modal { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center; z-index: 9999; background-color: rgba(11, 18, 32, .45); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); animation: jv-fade-in 200ms var(--jv-ease) backwards; } .loader-content { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 1.75rem 2.25rem; border-radius: var(--jv-radius-xl); background-color: rgba(15, 27, 51, .72); border: 1px solid rgba(255, 255, 255, .08); box-shadow: var(--jv-shadow-xl); animation: jv-pop-in 260ms var(--jv-ease-spring) backwards; } /* Procurement checklist (SVG in _Layout, same as JVMS; replaced the plain spinner 2026-11-12): each row's box is ticked and its line written in turn, then the approval seal pops in; all fade out and the 2.6s loop repeats. The static styles are the finished checklist, so reduced motion (bottom of file) shows it complete. Ticks and lines carry pathLength="1": a dash of 1 is the whole path, and an offset of 1.2 hides it completely (an offset of exactly 1 leaves a zero-length dash whose round cap shows as a dot). */ .jv-po-loader { display: block; overflow: visible; filter: drop-shadow(0 8px 16px rgba(0, 0, 0, .35)); } .jv-po-sheet { fill: #fff; } .jv-po-clip { fill: var(--jv-brand); } .jv-po-clip-hole { fill: var(--jv-navy-800); } .jv-po-box { fill: none; stroke: #CBD5E4; stroke-width: 1.5; } .jv-po-track, .jv-po-line, .jv-po-tick, .jv-po-seal path { fill: none; stroke-linecap: round; stroke-linejoin: round; } .jv-po-track { stroke: #EEF2F8; stroke-width: 3.5; } .jv-po-line, .jv-po-tick { stroke-dasharray: 1 2; stroke-dashoffset: 0; animation-duration: 2.6s; animation-timing-function: var(--jv-ease-out); animation-iteration-count: infinite; animation-fill-mode: backwards; } .jv-po-line { stroke: rgba(22, 38, 74, .4); stroke-width: 3.5; animation-name: jv-po-write; } .jv-po-tick { stroke: #17C653; stroke-width: 2.4; animation-name: jv-po-tick; } .jv-po-row-2 .jv-po-line, .jv-po-row-2 .jv-po-tick { animation-delay: .32s; } .jv-po-row-3 .jv-po-line, .jv-po-row-3 .jv-po-tick { animation-delay: .64s; } .jv-po-seal { transform-box: fill-box; transform-origin: center; animation: jv-po-seal 2.6s var(--jv-ease) infinite backwards; } .jv-po-seal circle { fill: var(--jv-brand); stroke: var(--jv-navy-800); stroke-width: 2.5; } .jv-po-seal path { stroke: #fff; stroke-width: 2.4; } @keyframes jv-po-tick { 0% { stroke-dashoffset: 1.2; opacity: 1; } 16% { stroke-dashoffset: 1.2; opacity: 1; } 26% { stroke-dashoffset: 0; opacity: 1; } 80% { stroke-dashoffset: 0; opacity: 1; } 90% { stroke-dashoffset: 0; opacity: 0; } 100% { stroke-dashoffset: 0; opacity: 0; } } @keyframes jv-po-write { 0% { stroke-dashoffset: 1.2; opacity: 1; } 22% { stroke-dashoffset: 1.2; opacity: 1; } 40% { stroke-dashoffset: 0; opacity: 1; } 80% { stroke-dashoffset: 0; opacity: 1; } 90% { stroke-dashoffset: 0; opacity: 0; } 100% { stroke-dashoffset: 0; opacity: 0; } } @keyframes jv-po-seal { 0% { opacity: 0; scale: .4; } 66% { opacity: 0; scale: .4; } 72% { opacity: 1; scale: 1.12; } 78% { opacity: 1; scale: 1; } 90% { opacity: 1; scale: 1; } 98% { opacity: 0; scale: 1; } 100% { opacity: 0; scale: 1; } } .loader-caption { color: rgba(255, 255, 255, .92); font-size: var(--jv-fs-base); font-weight: 500; letter-spacing: .02em; text-align: center; } /* Sits close under the caption (.loader-content has a 14px gap). */ .loader-dept { margin-top: -8px; color: rgba(255, 255, 255, .62); font-size: var(--jv-fs-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; text-align: center; } /* -------------------------------------------------------------------------- 16. Feature styles -------------------------------------------------------------------------- */ /* Form section heading: accent bar + title + hairline. Overrides any inline color on the headings and the old 40% opacity that faded them out. */ .hr-with-title { display: flex; align-items: center; gap: .75rem; margin: .25rem 0; color: inherit; border: 0; opacity: 1; } .hr-with-title::before { content: ""; flex: 0 0 auto; width: 4px; height: 16px; border-radius: 2px; background-color: var(--jv-brand); } .hr-with-title::after { content: ""; flex: 1 1 auto; min-width: 2rem; height: 1px; background-color: var(--bs-gray-200); } .hr-with-title > h4, .hr-with-title > h5, .hr-with-title > h6 { margin: 0 !important; color: var(--bs-gray-900) !important; font-size: var(--jv-fs-lg) !important; font-weight: 600 !important; letter-spacing: -.005em; } /* File picker (attachment + appointment modals) */ .custom-file-input { width: 100%; padding: .45rem; color: var(--bs-gray-700); font-size: var(--jv-fs-sm); background-color: var(--jv-surface-muted); border: 1px dashed var(--bs-gray-400); border-radius: var(--jv-radius-md); cursor: pointer; transition: background-color var(--jv-dur) var(--jv-ease), border-color var(--jv-dur) var(--jv-ease); } .custom-file-input:hover { background-color: rgba(27, 132, 255, .04); border-color: var(--jv-brand); } .custom-file-input:disabled { opacity: .55; cursor: not-allowed; } .custom-file-input::file-selector-button { margin-right: .75rem; padding: .45rem .9rem; color: #fff; font-weight: 600; background-color: var(--jv-brand); border: 0; border-radius: var(--jv-radius-sm); cursor: pointer; transition: background-color var(--jv-dur) var(--jv-ease); } .custom-file-input::file-selector-button:hover { background-color: var(--jv-brand-strong); } /* Picked-file chips - jvRenderFileList() in Content/js/common.js */ .jv-file-list { display: flex; flex-direction: column; gap: .4rem; margin: .6rem 0 0; padding: 0; list-style: none; } .jv-file-chip { display: flex; align-items: center; gap: .65rem; padding: .5rem .5rem .5rem .75rem; border: 1px solid var(--bs-gray-200); border-radius: var(--jv-radius-md); background-color: var(--bs-body-bg); box-shadow: var(--jv-shadow-xs); animation: jv-fade-up-sm var(--jv-dur) var(--jv-ease-out) backwards; } .jv-file-chip > i { flex-shrink: 0; color: var(--jv-brand); font-size: 1.6rem; } .jv-file-name { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--bs-gray-800); font-weight: 600; } .jv-file-size { flex-shrink: 0; color: var(--bs-gray-500); font-size: var(--jv-fs-sm); font-variant-numeric: tabular-nums; } .jv-file-remove { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 30px; height: 30px; padding: 0; border: 0; border-radius: var(--jv-radius-sm); background-color: transparent; color: var(--bs-gray-500); cursor: pointer; transition: color var(--jv-dur-fast) var(--jv-ease), background-color var(--jv-dur-fast) var(--jv-ease); } .jv-file-remove:hover { color: #C21E45; background-color: rgba(248, 40, 90, .08); } .jv-file-remove i { color: inherit; font-size: 1.35rem; } /* Document checklist (Attachments tab) */ .jv-doc-summary { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: 1rem; } .jv-doc-summary-text { color: var(--bs-gray-700); font-size: var(--jv-fs-sm); font-weight: 600; } .jv-progress { flex: 1 1 200px; max-width: 320px; height: 6px; overflow: hidden; border-radius: 999px; background-color: var(--bs-gray-200); } .jv-progress-bar { width: 0; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--jv-brand) 0%, #17C653 100%); transition: width 700ms var(--jv-ease-out); } .jv-doc-group + .jv-doc-group { margin-top: 1.5rem; } .jv-doc-group-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .65rem; color: var(--bs-gray-600); font-size: var(--jv-fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; } .jv-doc-tag { padding: .1rem .5rem; border-radius: 999px; background-color: var(--bs-gray-100); color: var(--bs-gray-600); font-size: var(--jv-fs-xs); font-weight: 600; letter-spacing: 0; text-transform: none; } .jv-doc-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin: 0; padding: 0; list-style: none; } .jv-doc-list.is-single { grid-template-columns: minmax(0, 1fr); } .jv-doc-item { display: flex; flex-direction: column; gap: .2rem; padding: .65rem .85rem; border: 1px solid var(--bs-gray-200); border-radius: var(--jv-radius-md); background-color: var(--bs-body-bg); transition: border-color var(--jv-dur) var(--jv-ease), background-color var(--jv-dur) var(--jv-ease), box-shadow var(--jv-dur) var(--jv-ease); } .jv-doc-item:hover { border-color: var(--bs-gray-300); box-shadow: var(--jv-shadow-xs); } .jv-doc-item .form-check { display: flex; align-items: flex-start; gap: .6rem; margin: 0; padding: 0; min-height: 0; } .jv-doc-item .form-check .form-check-input { float: none; flex-shrink: 0; margin: .1rem 0 0; } .jv-doc-item .form-check-input:disabled { opacity: 1; } .jv-doc-item .form-check-input:checked { background-color: #17C653; border-color: #17C653; } .jv-doc-item .form-check-input:disabled ~ .form-check-label { opacity: 1; cursor: default; } .jv-doc-item .form-check-input:checked ~ .form-check-label { color: var(--bs-gray-900); } .jv-doc-item .form-check-label { color: var(--bs-gray-700); font-weight: 500; line-height: 1.4; } .jv-doc-hint { padding-left: 2.15rem; color: var(--bs-gray-500); font-size: var(--jv-fs-sm); line-height: 1.4; } .jv-doc-action { display: inline-flex; align-items: center; gap: .3rem; margin-left: 2.15rem; font-size: var(--jv-fs-sm); } .jv-doc-action i { color: inherit; font-size: 1.15rem; } /* Required document missing on Submit (RequiredDocumentProblems in Vendor.js) */ .jv-doc-item.is-missing { border-color: #F8285A; background-color: rgba(248, 40, 90, .04); } .jv-doc-item.is-missing .form-check-label { color: #D81A48; } [data-bs-theme=dark] .jv-doc-item.is-missing { background-color: rgba(248, 40, 90, .1); } [data-bs-theme=dark] .jv-doc-item.is-missing .form-check-label { color: #FF6B8E; } /* Conditional groups: "Applies to you" (from General Information) or dimmed when not applicable */ .jv-doc-tag.is-active { background-color: rgba(27, 132, 255, .1); color: var(--jv-brand); } [data-bs-theme=dark] .jv-doc-tag.is-active { background-color: rgba(27, 132, 255, .2); color: #6EB4FF; } .jv-doc-group.is-inactive .jv-doc-item { opacity: .55; } /* Financial Capability tab */ .jv-ratio-panel { height: 100%; padding: 1.5rem; border: 1px solid var(--bs-gray-200); border-radius: var(--jv-radius-lg); background-color: var(--jv-surface-muted); } .jv-ratio-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1.5rem; } .jv-ratio { padding: .9rem 1rem 1rem; border: 1px solid var(--bs-gray-200); border-radius: var(--jv-radius-md); background-color: var(--bs-body-bg); box-shadow: var(--jv-shadow-xs); } .jv-ratio .form-label { margin-bottom: .45rem; color: var(--bs-gray-600); font-size: var(--jv-fs-xs); letter-spacing: .06em; text-transform: uppercase; } /* The computed ratios are disabled inputs (filled by AutoNumeric); show them as numbers. */ .jv-ratio .form-control:disabled { min-height: 0; padding: 0; color: var(--bs-gray-900); -webkit-text-fill-color: var(--bs-gray-900); font-size: var(--jv-fs-xl); font-weight: 700; font-variant-numeric: tabular-nums; background-color: transparent; border: 0; } .jv-ratio-target { display: block; margin-top: .3rem; color: var(--bs-gray-500); font-size: var(--jv-fs-sm); } .jv-panel-heading { margin: 0 0 .5rem; color: var(--bs-gray-800); font-size: var(--jv-fs-sm); font-weight: 700; } .jv-rule-list { margin: 0 0 1.25rem; padding-left: 1.1rem; color: var(--bs-gray-700); font-size: var(--jv-fs-sm); } .jv-rule-list li + li { margin-top: .35rem; } .jv-formula { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; padding: .65rem 0; color: var(--bs-gray-800); font-size: var(--jv-fs-sm); } .jv-formula + .jv-formula { border-top: 1px dashed var(--bs-gray-300); } .jv-formula-name { font-weight: 700; white-space: nowrap; } .jv-fraction { display: inline-flex; flex-direction: column; align-items: center; text-align: center; } .jv-fraction > span:first-child { padding: 0 .35rem .2rem; border-bottom: 1px solid var(--bs-gray-500); } .jv-fraction > span:last-child { padding-top: .2rem; } /* Submit tab */ .jv-agree { display: flex; align-items: flex-start; gap: .85rem; max-width: 760px; padding: 1.1rem 1.25rem; border: 1px solid var(--bs-gray-200); border-radius: var(--jv-radius-lg); background-color: var(--jv-surface-muted); color: var(--bs-gray-800); font-size: var(--jv-fs-md); line-height: 1.5; cursor: pointer; transition: border-color var(--jv-dur) var(--jv-ease), background-color var(--jv-dur) var(--jv-ease), box-shadow var(--jv-dur) var(--jv-ease); } .jv-agree:hover { border-color: rgba(27, 132, 255, .45); } .jv-agree .form-check-input { flex-shrink: 0; width: 1.35rem; height: 1.35rem; margin: .1rem 0 0; } .jv-agree .form-check-input:checked ~ span { color: var(--bs-gray-900); } /* Set by SubmitVendorForm() when the box isn't ticked */ .jv-agree.is-invalid { border-color: #F8285A; background-color: rgba(248, 40, 90, .05); box-shadow: 0 0 0 3px rgba(248, 40, 90, .12); } .jv-meta { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: 1.5rem; } .jv-meta-label { display: block; margin-bottom: .2rem; color: var(--bs-gray-500); font-size: var(--jv-fs-xs); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; } .jv-meta-value { color: var(--bs-gray-900); font-size: var(--jv-fs-md); font-weight: 600; } #submittedDate:empty::before { content: "Not yet submitted"; color: var(--bs-gray-500); font-weight: 500; } /* FAQ accordion */ #modalFAQ .collapsible { margin: 0 -.75rem; padding-left: .75rem !important; padding-right: .75rem !important; border-radius: var(--jv-radius-md); transition: background-color var(--jv-dur-fast) var(--jv-ease); } #modalFAQ .collapsible:hover { background-color: rgba(27, 132, 255, .05); } #modalFAQ .collapsible h4 { color: var(--bs-gray-800) !important; } #modalFAQ .collapsible:not(.collapsed) h4 { color: var(--jv-link) !important; } #modalFAQ .separator.separator-dashed { border-bottom-color: var(--bs-gray-200); border-bottom-style: solid; } /* SweetAlert2 */ .swal2-popup { padding: 1.75rem 1.5rem 1.5rem !important; border-radius: var(--jv-radius-xl) !important; box-shadow: var(--jv-shadow-xl) !important; } .swal2-title { color: var(--bs-gray-900) !important; font-size: var(--jv-fs-xl) !important; font-weight: 700 !important; } .swal2-html-container { color: var(--bs-gray-600) !important; font-size: var(--jv-fs-md) !important; } .swal2-actions { gap: .5rem; } /* Problem list in validation / server-message dialogs (common.js jvShowFormErrors, jvAlert). */ .jv-swal-lead { margin: 0 0 .75rem; } .jv-swal-group { margin: .9rem 0 .35rem; color: var(--bs-gray-900); font-size: var(--jv-fs-sm); font-weight: 700; letter-spacing: .02em; text-align: left; text-transform: uppercase; } .jv-swal-list { margin: 0; padding: 0; list-style: none; text-align: left; } .jv-swal-list li { position: relative; padding: .4rem 0 .4rem 1.25rem; border-top: 1px solid var(--bs-gray-200); font-size: var(--jv-fs-base); line-height: 1.45; } .jv-swal-list li:first-child { border-top: 0; } .jv-swal-list li::before { content: ""; position: absolute; top: .95rem; left: .25rem; width: 6px; height: 6px; border-radius: 50%; background-color: #F6C000; } .jv-swal-list strong { color: var(--bs-gray-900); font-weight: 600; } .jv-swal-more { margin: .75rem 0 0; font-size: var(--jv-fs-sm); } /* -------------------------------------------------------------------------- 17. Auth pages (Views/User/*, anonymous branch of _Layout) -------------------------------------------------------------------------- */ body.jv-auth-body { min-height: 100vh; background-color: var(--jv-app-bg); } .jv-auth { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); min-height: 100vh; } .jv-auth-aside { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; padding: 2.5rem 3rem; background-color: var(--jv-navy-800); background-repeat: no-repeat; background-size: cover; background-position: center; color: #fff; } .jv-auth-aside::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(160deg, rgba(10, 18, 34, .92) 0%, rgba(10, 18, 34, .74) 55%, rgba(11, 94, 215, .45) 100%); } .jv-auth-aside .jv-brand-name { color: #fff; } .jv-auth-aside .jv-brand-caption { color: rgba(255, 255, 255, .6); } .jv-auth-aside .jv-brand-mark { border-color: transparent; box-shadow: 0 6px 16px -6px rgba(0, 0, 0, .55); } .jv-auth-pitch { margin: auto 0; padding: 3rem 0; max-width: 440px; animation: jv-fade-up 600ms var(--jv-ease-out) 120ms backwards; } .jv-auth-pitch h2 { margin: 0 0 .85rem; color: #fff; font-size: 32px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; } .jv-auth-pitch p { margin: 0 0 1.75rem; color: rgba(255, 255, 255, .75); font-size: var(--jv-fs-lg); line-height: 1.55; } .jv-auth-points { display: flex; flex-direction: column; gap: .85rem; margin: 0; padding: 0; list-style: none; } .jv-auth-points li { display: flex; align-items: center; gap: .75rem; color: rgba(255, 255, 255, .9); font-size: var(--jv-fs-md); font-weight: 500; } /* The tile is a wrapper span: styling the itself as a flex tile misaligns icon glyph layers. */ .jv-auth-point-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: var(--jv-radius-sm); background-color: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .14); } .jv-auth-point-icon i { color: #fff; font-size: 18px; line-height: 1; } .jv-auth-contact { color: rgba(255, 255, 255, .6); font-size: var(--jv-fs-sm); } .jv-auth-contact a { color: rgba(255, 255, 255, .85); font-weight: 600; } .jv-auth-contact a:hover { color: #fff; } .jv-auth-main { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem 1.5rem 1.5rem; } .jv-auth-mobile-brand { display: none; margin-bottom: 1.5rem; } .jv-auth-card { width: 100%; max-width: 440px; padding: 2.25rem; border: 1px solid var(--jv-border); border-radius: var(--jv-radius-xl); background-color: var(--bs-body-bg); box-shadow: var(--jv-shadow-lg); animation: jv-pop-in 420ms var(--jv-ease-out) backwards; } .jv-auth-card.is-wide { max-width: 580px; } .jv-auth-eyebrow { display: inline-flex; margin-bottom: .6rem; padding: .2rem .6rem; border-radius: 999px; background-color: rgba(27, 132, 255, .1); color: var(--jv-link); font-size: var(--jv-fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; } .jv-auth-title { margin: 0; color: var(--bs-gray-900); font-size: var(--jv-fs-2xl); font-weight: 700; letter-spacing: -.015em; } .jv-auth-subtitle { margin: .4rem 0 1.75rem; color: var(--bs-gray-600); font-size: var(--jv-fs-md); line-height: 1.5; } .jv-auth-alert { display: flex; align-items: flex-start; gap: .6rem; margin-bottom: 1.25rem; padding: .75rem 1rem; border-radius: var(--jv-radius-md); font-size: var(--jv-fs-base); animation: jv-fade-up-sm var(--jv-dur-slow) var(--jv-ease-out) backwards; } .jv-auth-alert i { flex-shrink: 0; margin-top: 1px; color: inherit; font-size: 18px; line-height: 1; } .jv-auth-alert.is-success { border: 1px solid rgba(23, 198, 83, .3); background-color: rgba(23, 198, 83, .08); color: #0B6B36; } .jv-auth-alert.is-info { border: 1px solid rgba(27, 132, 255, .25); background-color: rgba(27, 132, 255, .07); color: var(--jv-link); } [data-bs-theme=dark] .jv-auth-alert.is-success { color: #4ADE80; } /* MVC renders the summary wrapper (with one hidden, empty
  • ) whenever ModelState has ANY error, including the field errors that ValidationSummary(true) leaves out. Style the message items, not the wrapper, or an empty red box appears above the form. */ .jv-auth-form .validation-summary-errors li { margin-bottom: 1.25rem; padding: .75rem 1rem; border: 1px solid rgba(248, 40, 90, .25); border-radius: var(--jv-radius-md); background-color: rgba(248, 40, 90, .06); color: #C21E45; font-size: var(--jv-fs-base); } .jv-auth-form .form-label { font-size: var(--jv-fs-base); color: var(--bs-gray-800); } .jv-auth-field { margin-bottom: 1.15rem; } .jv-auth-field-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; } .jv-auth-field-head .jv-link { font-size: var(--jv-fs-sm); } /* Google reCAPTCHA v2 (Views/Shared/_Captcha.cshtml): a fixed 304 x 78px box rendered inside .jv-captcha. */ .jv-captcha { min-height: 78px; margin: .25rem 0 1.25rem; } /* Submitted without ticking "I'm not a robot" (common.js jvCheckAuthForm). */ .jv-captcha.is-invalid > div { border-radius: 4px; outline: 2px solid rgba(248, 40, 90, .7); outline-offset: 3px; } .jv-auth-actions { display: flex; flex-wrap: wrap; gap: .75rem; } .jv-auth-actions > .btn { flex: 1 1 160px; } .jv-auth-alt { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--bs-gray-200); color: var(--bs-gray-600); font-size: var(--jv-fs-base); text-align: center; } /* Keep each link on one line ("Help & FAQ" wrapped after the ampersand on the review page). */ .jv-auth-alt a { white-space: nowrap; } .jv-auth-footer { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem 1.25rem; margin-top: 1.75rem; color: var(--bs-gray-500); font-size: var(--jv-fs-sm); } .jv-auth-footer a { color: var(--bs-gray-600); font-weight: 600; } .jv-auth-footer a:hover { color: var(--jv-link); } /* Registration received / under review (Views/User/Pending.cshtml, status X). The icon tile is a wrapper span: styling the itself misaligns the glyph. */ .jv-auth-status-icon { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-bottom: 1.1rem; border-radius: var(--jv-radius-lg); animation: jv-pop-in 480ms var(--jv-ease-spring) 140ms backwards; } .jv-auth-status-icon i { color: inherit; font-size: 28px; line-height: 1; } .jv-auth-status-icon.is-success { background-color: rgba(23, 198, 83, .12); color: #0B6B36; } .jv-auth-status-icon.is-warning { background-color: rgba(246, 192, 0, .16); color: #8A5A00; } [data-bs-theme=dark] .jv-auth-status-icon.is-success { color: #4ADE80; } [data-bs-theme=dark] .jv-auth-status-icon.is-warning { color: #FACC15; } .jv-auth-steps { margin: 0 0 1.75rem; padding: 0; list-style: none; } .jv-auth-step { position: relative; display: flex; gap: .9rem; padding-bottom: 1.25rem; animation: jv-fade-up-sm var(--jv-dur-slow) var(--jv-ease-out) backwards; } .jv-auth-step:nth-child(2) { animation-delay: 80ms; } .jv-auth-step:nth-child(3) { animation-delay: 160ms; } .jv-auth-step:last-child { padding-bottom: 0; } /* Connector line from one marker to the next. */ .jv-auth-step::before { content: ""; position: absolute; top: 36px; bottom: 4px; left: 15px; width: 2px; border-radius: 2px; background-color: var(--bs-gray-200); } .jv-auth-step:last-child::before { display: none; } .jv-auth-step.is-done::before { background-color: rgba(23, 198, 83, .45); } .jv-auth-step-marker { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 32px; border: 2px solid var(--bs-gray-300); border-radius: 50%; background-color: var(--bs-body-bg); color: var(--bs-gray-500); font-size: var(--jv-fs-sm); font-weight: 700; } .jv-auth-step-marker i { color: inherit; font-size: 16px; line-height: 1; } .jv-auth-step.is-done .jv-auth-step-marker { border-color: #17C653; background-color: #17C653; color: #fff; } .jv-auth-step.is-current .jv-auth-step-marker { border-color: var(--jv-brand); color: var(--jv-brand); box-shadow: var(--jv-ring); } .jv-auth-step-body { min-width: 0; padding-top: 5px; } .jv-auth-step-title { display: block; color: var(--bs-gray-900); font-size: var(--jv-fs-base); font-weight: 700; } .jv-auth-step-text { margin: .2rem 0 0; color: var(--bs-gray-600); font-size: var(--jv-fs-sm); line-height: 1.55; } .jv-auth-step-badge { display: inline-flex; margin-left: .4rem; padding: .1rem .55rem; border-radius: 999px; background-color: rgba(27, 132, 255, .1); color: var(--jv-link); font-size: var(--jv-fs-xs); font-weight: 700; vertical-align: 1px; } /* -------------------------------------------------------------------------- 18. Responsive -------------------------------------------------------------------------- */ @media (max-width: 991.98px) { .jv-auth { grid-template-columns: minmax(0, 1fr); } .jv-auth-aside { display: none; } .jv-auth-mobile-brand { display: flex; } .jv-pane { padding: 1.5rem 1.25rem 1.75rem; } } @media (max-width: 767.98px) { .jv-hero-body { padding: 1.25rem; min-height: 0; } .jv-hero-title { font-size: var(--jv-fs-xl); } .jv-doc-list, .jv-ratio-grid { grid-template-columns: minmax(0, 1fr); } .card > .card-footer.jv-actionbar { padding: .75rem 1rem; } .jv-actionbar-hint { display: none; } .jv-actionbar-buttons { width: 100%; } .jv-actionbar-buttons > .btn { flex: 1 1 0; } .jv-user-chip { padding-right: .25rem; } } @media (max-width: 575.98px) { /* 16px stops iOS Safari from zooming the page when a field is focused. */ .form-control, .form-select { font-size: 16px; } .jv-auth-main { padding: 1.5rem 1rem 1rem; } .jv-auth-card { padding: 1.5rem 1.25rem; } .jv-tabs .nav-link.btn .jv-tab-label { display: none; } .jv-tabs .nav-link.btn.active .jv-tab-label { display: inline; } } /* reCAPTCHA is 304px wide; shrink it on the narrowest phones so it stays inside the card. */ @media (max-width: 359.98px) { .jv-captcha { scale: .82; transform-origin: 0 0; } } /* -------------------------------------------------------------------------- 19. Reduced motion - honour the OS setting everywhere -------------------------------------------------------------------------- */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; animation-delay: 0ms !important; transition-duration: 1ms !important; transition-delay: 0ms !important; scroll-behavior: auto !important; } .jv-hero-bg, .jv-hero:hover .jv-hero-bg { scale: 1; } /* The loader shows its finished checklist instead of looping. */ .jv-po-line, .jv-po-tick, .jv-po-seal { animation: none !important; } }