UNPKG

@egovernments/digit-ui-components-css

Version:

<!-- TODO: update this -->

1,697 lines (1,465 loc) 557 kB
/*! * @egovernments/digit-ui-components-css - 0.2.0 * * Copyright (c) 2025 Jagankumar <jagan.kumar@egovernments.org> * */ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ *, :after, :before { -webkit-box-sizing: border-box; box-sizing: border-box; border: 0 solid; } @-webkit-keyframes ping { 75%, to { -webkit-transform: scale(2); transform: scale(2); opacity: 0; } } @keyframes ping { 75%, to { -webkit-transform: scale(2); transform: scale(2); opacity: 0; } } @-webkit-keyframes pulse { 50% { opacity: .5; } } @keyframes pulse { 50% { opacity: .5; } } @-webkit-keyframes bounce { 0%, to { -webkit-transform: translateY(-25%); transform: translateY(-25%); -webkit-animation-timing-function: cubic-bezier(0.8, 0, 1, 1); animation-timing-function: cubic-bezier(0.8, 0, 1, 1); } 50% { -webkit-transform: none; transform: none; -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1); animation-timing-function: cubic-bezier(0, 0, 0.2, 1); } } @keyframes bounce { 0%, to { -webkit-transform: translateY(-25%); transform: translateY(-25%); -webkit-animation-timing-function: cubic-bezier(0.8, 0, 1, 1); animation-timing-function: cubic-bezier(0.8, 0, 1, 1); } 50% { -webkit-transform: none; transform: none; -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1); animation-timing-function: cubic-bezier(0, 0, 0.2, 1); } } .rdrCalendarWrapper { -webkit-box-sizing: border-box; box-sizing: border-box; background: #fff; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .rdrDateDisplay { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .rdrDateDisplayItem { -webkit-box-flex: 1; -ms-flex: 1 1; flex: 1 1; width: 0; text-align: center; color: inherit; } .rdrDateDisplayItem + .rdrDateDisplayItem { margin-left: .833em; } .rdrDateDisplayItem input, .rdrDateDisplayItem .digit-checkbox-container .input-emp, .digit-checkbox-container .rdrDateDisplayItem .input-emp { text-align: inherit; } .rdrDateDisplayItem input:disabled, .rdrDateDisplayItem .digit-checkbox-container .input-emp:disabled, .digit-checkbox-container .rdrDateDisplayItem .input-emp:disabled { cursor: default; } .rdrMonthAndYearWrapper { -webkit-box-sizing: inherit; box-sizing: inherit; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .rdrMonthAndYearPickers, .rdrMonthAndYearWrapper { display: -webkit-box; display: -ms-flexbox; display: flex; } .rdrMonthAndYearPickers { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .rdrNextPrevButton { -webkit-box-sizing: inherit; box-sizing: inherit; cursor: pointer; outline: none; } .rdrMonths { display: -webkit-box; display: -ms-flexbox; display: flex; } .rdrMonthsVertical { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .rdrMonthsHorizontal > div > div > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .rdrMonth { width: 27.667em; } .rdrWeekDays { display: -webkit-box; display: -ms-flexbox; display: flex; } .rdrWeekDay { -ms-flex-preferred-size: 14.28571%; flex-basis: 14.28571%; -webkit-box-sizing: inherit; box-sizing: inherit; text-align: center; } .rdrDays { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .rdrInfiniteMonths { overflow: auto; } .rdrDateRangeWrapper { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .rdrDateInput { position: relative; } .rdrDateInput input, .rdrDateInput .digit-checkbox-container .input-emp, .digit-checkbox-container .rdrDateInput .input-emp { outline: none; } .rdrDateInput .rdrWarning { position: absolute; font-size: 1.6em; line-height: 1.6em; top: 0; right: .25em; color: red; } .rdrDay { -webkit-box-sizing: inherit; box-sizing: inherit; width: 14.28571%; position: relative; font: inherit; cursor: pointer; } .rdrDayNumber { display: block; position: relative; } .rdrDayNumber span { color: #1d2429; } .rdrDayDisabled { cursor: not-allowed; } @supports (-ms-ime-align: auto) { .rdrDay { -ms-flex-preferred-size: 14.285% !important; flex-basis: 14.285% !important; } } .rdrEndEdge, .rdrInRange, .rdrSelected, .rdrStartEdge { pointer-events: none; } .rdrDateRangePickerWrapper { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .rdrStaticRanges { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .rdrStaticRange { font-size: inherit; } .rdrInputRange { display: -webkit-box; display: -ms-flexbox; display: flex; } .rdrCalendarWrapper { color: #000; font-size: 12px; } .rdrDateDisplayWrapper { background-color: #eff2f7; } .rdrDateDisplay { margin: .833em; } .rdrDateDisplayItem { border-radius: 4px; background-color: #fff; -webkit-box-shadow: 0 1px 2px 0 rgba(35, 57, 66, 0.21); box-shadow: 0 1px 2px 0 rgba(35, 57, 66, 0.21); border: 1px solid transparent; } .rdrDateDisplayItem input, .rdrDateDisplayItem .digit-checkbox-container .input-emp, .digit-checkbox-container .rdrDateDisplayItem .input-emp { cursor: pointer; height: 2.5em; line-height: 2.5em; border: 0; background: transparent; width: 100%; color: #849095; } .rdrDateDisplayItemActive { border-color: currentColor; } .rdrDateDisplayItemActive input, .rdrDateDisplayItemActive .digit-checkbox-container .input-emp, .digit-checkbox-container .rdrDateDisplayItemActive .input-emp { color: #7d888d; } .rdrMonthAndYearWrapper { -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 60px; padding-top: 10px; } .rdrMonthAndYearPickers { font-weight: 600; } .rdrMonthAndYearPickers select { -moz-appearance: none; appearance: none; -webkit-appearance: none; border: 0; background: transparent; padding: 10px 30px 10px 10px; border-radius: 4px; outline: 0; color: #3e484f; background: url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>") no-repeat; background-position: right 8px center; cursor: pointer; text-align: center; } .rdrMonthAndYearPickers select:hover { background-color: rgba(0, 0, 0, 0.07); } .rdrMonthPicker, .rdrYearPicker { margin: 0 5px; } .rdrNextPrevButton { display: block; width: 24px; height: 24px; margin: 0 .833em; padding: 0; border: 0; border-radius: 5px; background: #eff2f7; } .rdrNextPrevButton:hover { background: #e1e7f0; } .rdrNextPrevButton i { display: block; width: 0; height: 0; padding: 0; text-align: center; border-style: solid; margin: auto; } .rdrNextPrevButton i, .rdrPprevButton i { -webkit-transform: translate(-3px); transform: translate(-3px); } .rdrPprevButton i { border-width: 4px 6px 4px 4px; border-color: transparent #34495e transparent transparent; } .rdrNextButton i { margin: 0 0 0 7px; border-width: 4px 4px 4px 6px; border-color: transparent transparent transparent #34495e; -webkit-transform: translate(3px); transform: translate(3px); } .rdrWeekDays { padding: 0 .833em; } .rdrMonth { padding: 0 .833em 1.666em; } .rdrMonth .rdrWeekDays { padding: 0; } .rdrMonths.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName { display: none; } .rdrWeekDay { font-weight: 400; line-height: 2.667em; color: #849095; } .rdrDay { background: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: 0; padding: 0; line-height: 3em; height: 3em; text-align: center; color: #1d2429; } .rdrDay:focus { outline: 0; } .rdrDayNumber { outline: 0; font-weight: 300; position: absolute; left: 0; right: 0; top: 0; bottom: 0; top: 5px; bottom: 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .rdrDayToday .rdrDayNumber span { font-weight: 500; } .rdrDayToday .rdrDayNumber span:after { content: ""; position: absolute; bottom: 4px; left: 50%; -webkit-transform: translate(-50%); transform: translate(-50%); width: 18px; height: 2px; border-radius: 2px; background: #3d91ff; } .rdrDayToday:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span:after, .rdrDayToday:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span:after, .rdrDayToday:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span:after, .rdrDayToday:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span:after { background: #fff; } .rdrDay:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span, .rdrDay:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span, .rdrDay:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span, .rdrDay:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span { color: rgba(255, 255, 255, 0.85); } .rdrEndEdge, .rdrInRange, .rdrSelected, .rdrStartEdge { background: currentColor; position: absolute; top: 5px; left: 0; right: 0; bottom: 5px; } .rdrSelected { left: 2px; right: 2px; } .rdrStartEdge { border-top-left-radius: 1.042em; border-bottom-left-radius: 1.042em; left: 2px; } .rdrEndEdge { border-top-right-radius: 1.042em; border-bottom-right-radius: 1.042em; right: 2px; } .rdrSelected { border-radius: 1.042em; } .rdrDayStartOfMonth .rdrEndEdge, .rdrDayStartOfMonth .rdrInRange, .rdrDayStartOfWeek .rdrEndEdge, .rdrDayStartOfWeek .rdrInRange { border-top-left-radius: 1.042em; border-bottom-left-radius: 1.042em; left: 2px; } .rdrDayEndOfMonth .rdrInRange, .rdrDayEndOfMonth .rdrStartEdge, .rdrDayEndOfWeek .rdrInRange, .rdrDayEndOfWeek .rdrStartEdge { border-top-right-radius: 1.042em; border-bottom-right-radius: 1.042em; right: 2px; } .rdrDayStartOfMonth .rdrDayEndPreview, .rdrDayStartOfMonth .rdrDayInPreview, .rdrDayStartOfWeek .rdrDayEndPreview, .rdrDayStartOfWeek .rdrDayInPreview { border-top-left-radius: 1.333em; border-bottom-left-radius: 1.333em; border-left-width: 1px; left: 0; } .rdrDayEndOfMonth .rdrDayInPreview, .rdrDayEndOfMonth .rdrDayStartPreview, .rdrDayEndOfWeek .rdrDayInPreview, .rdrDayEndOfWeek .rdrDayStartPreview { border-top-right-radius: 1.333em; border-bottom-right-radius: 1.333em; border-right-width: 1px; right: 0; } .rdrDayEndPreview, .rdrDayInPreview, .rdrDayStartPreview { background: rgba(255, 255, 255, 0.09); position: absolute; top: 3px; left: 0; right: 0; bottom: 3px; pointer-events: none; border: 0 solid; z-index: 1; } .rdrDayStartPreview { border-top-width: 1px; border-left-width: 1px; border-bottom-width: 1px; border-top-left-radius: 1.333em; border-bottom-left-radius: 1.333em; left: 0; } .rdrDayEndPreview, .rdrDayInPreview { border-top-width: 1px; border-bottom-width: 1px; } .rdrDayEndPreview { border-right-width: 1px; border-top-right-radius: 1.333em; border-bottom-right-radius: 1.333em; right: 2px; right: 0; } .rdrDefinedRangesWrapper { font-size: 12px; width: 226px; border-right: 1px solid #eff2f7; background: #fff; } .rdrDefinedRangesWrapper .rdrStaticRangeSelected { color: currentColor; font-weight: 600; } .rdrStaticRange { border: 0; cursor: pointer; display: block; outline: 0; border-bottom: 1px solid #eff2f7; padding: 0; background: #fff; } .rdrStaticRange:focus .rdrStaticRangeLabel, .rdrStaticRange:hover .rdrStaticRangeLabel { background: #eff2f7; } .rdrStaticRangeLabel { display: block; outline: 0; line-height: 18px; padding: 10px 20px; text-align: left; } .rdrInputRanges { padding: 10px 0; } .rdrInputRange { -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 5px 20px; } .rdrInputRangeInput { width: 30px; height: 30px; line-height: 30px; border-radius: 4px; text-align: center; border: 1px solid #dee7eb; margin-right: 10px; color: #6c767a; } .rdrInputRangeInput:focus, .rdrInputRangeInput:hover { border-color: #b4bfc4; outline: 0; color: #333; } .rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after { content: ""; border: 1px solid; border-radius: 1.333em; position: absolute; top: -2px; bottom: -2px; left: 0; right: 0; background: transparent; } .rdrDayPassive { pointer-events: none; } .rdrDayPassive .rdrDayNumber span { color: #d5dce0; } .rdrDayPassive .rdrDayEndPreview, .rdrDayPassive .rdrDayInPreview, .rdrDayPassive .rdrDayStartPreview, .rdrDayPassive .rdrEndEdge, .rdrDayPassive .rdrInRange, .rdrDayPassive .rdrSelected, .rdrDayPassive .rdrStartEdge { display: none; } .rdrDayDisabled { background-color: #f8f8f8; } .rdrDayDisabled .rdrDayNumber span { color: #aeb9bf; } .rdrDayDisabled .rdrDayEndPreview, .rdrDayDisabled .rdrDayInPreview, .rdrDayDisabled .rdrDayStartPreview, .rdrDayDisabled .rdrEndEdge, .rdrDayDisabled .rdrInRange, .rdrDayDisabled .rdrSelected, .rdrDayDisabled .rdrStartEdge { -webkit-filter: grayscale(100%) opacity(60%); filter: grayscale(100%) opacity(60%); } .rdrMonthName { text-align: left; font-weight: 600; color: #849095; padding: .833em; } .loginFormStyleEmployee .employeeCard .submit-bar, .loginFormStyleEmployee .employeeCard .workbench .workbench-create-form div.action-bar-wrap .submit-bar, .workbench .workbench-create-form div.action-bar-wrap .loginFormStyleEmployee .employeeCard .submit-bar { width: 100%; } .banner .bannerCard { min-width: 420px !important; } .employeeForgotPassword .employeeCard .field .field-container .component-in-front { margin-top: 0; border: 1px solid; border-right: none; padding: 7px; } @media (min-width: 780px) { .employeeForgotPassword .employeeCard .field .field-container .component-in-front { padding: 7px; } .banner .bannerCard, .loginFormStyleEmployee .employeeCard { min-width: 420px !important; } .employeeChangePassword .employeeCard, .employeeForgotPassword .employeeCard { max-width: 420px !important; min-width: 420px !important; } } .employeeForgotPassword .employee-card-input, .employeeForgotPassword .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .all-input-field-wrapper .form-control, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .all-input-field-wrapper .employeeForgotPassword .form-control, .employeeForgotPassword .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label input[type=checkbox], .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .employeeForgotPassword input[type=checkbox], .employeeForgotPassword .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .digit-checkbox-container .input-emp[type=checkbox], .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .digit-checkbox-container .employeeForgotPassword .input-emp[type=checkbox], .employeeForgotPassword .digit-checkbox-container .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .input-emp[type=checkbox], .digit-checkbox-container .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .employeeForgotPassword .input-emp[type=checkbox] { margin-bottom: 0; border-left: none; } .employeeForgotPassword .field-container { margin: 10px 0; } .employeeForgotPassword .submit-bar, .employeeForgotPassword .workbench .workbench-create-form div.action-bar-wrap .submit-bar, .workbench .workbench-create-form div.action-bar-wrap .employeeForgotPassword .submit-bar { width: 100%; } .employeeChangePassword .submit-bar, .employeeChangePassword .workbench .workbench-create-form div.action-bar-wrap .submit-bar, .workbench .workbench-create-form div.action-bar-wrap .employeeChangePassword .submit-bar { width: 100% !important; } .employeeChangePassword .card-text, .employeeChangePassword .input-otp-wrap { text-align: center; } .submit-bar .submit-bar, .submit-bar .workbench .workbench-create-form div.action-bar-wrap .submit-bar, .workbench .workbench-create-form div.action-bar-wrap .submit-bar .submit-bar { width: 100%; } .employeeChangePassword .bannerHeader p, .employeeForgotPassword .bannerHeader p, .loginFormStyleEmployee .bannerHeader p { font-size: 19px; } .employeeCard .card-sub-header { font-size: 24px; } .employeeForgotPassword .employeeCard .card-label, .employeeForgotPassword .employeeCard .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .control-label, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .employeeForgotPassword .employeeCard .control-label, .employeeForgotPassword .employeeCard .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label span, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .employeeForgotPassword .employeeCard span, .loginFormStyleEmployee .employeeCard .card-label, .loginFormStyleEmployee .employeeCard .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .control-label, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .loginFormStyleEmployee .employeeCard .control-label, .loginFormStyleEmployee .employeeCard .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label span, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .loginFormStyleEmployee .employeeCard span { font-weight: 400; font-size: 16px; line-height: 19px; color: #0b0c0c; margin-top: 20px; } .banner .bannerHeader { margin-bottom: 20px; } .employeeCard .card-label, .employeeCard .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .control-label, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field .employeeCard .control-label, .employeeCard .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label span, .workbench .workbench-create-form form #digit_root .field-wrapper .form-group.field.field-boolean .checkbox label .employeeCard span { font-weight: 400; font-size: 16px; line-height: 19px; color: #0b0c0c; } .profile-label-margin { margin-top: 10px; } .employeeForgotPassword .employeeCard .card-label-desc { font-weight: 400; font-size: 16px; line-height: 24px; color: #505a5f; margin-top: 15px; } .employeeChangePassword .employeeCard .card-text { margin-bottom: 15px; font-size: 16px; color: #505a5f; } @media screen and (max-width: 768px) { .employeeChangePassword .employeeCard .card-text { margin-top: 7px; } .employeeCard .card-sub-header { font-size: 18px; } } .employeeChangePassword .employeeCard .card-text-button { text-align: center !important; margin-bottom: 12px !important; } .employeeChangePassword .employeeCard .input-otp-wrap { margin-bottom: 10px; } .employee .loginContainer { padding-top: 0 !important; } .banner { height: 100vh !important; } .employeeChangePassword .employeeCard .field .field-container { margin-bottom: 24px; } .employeeChangePassword .employeeCard .employee-card-sub-header, .employeeForgotPassword .employeeCard .employee-card-sub-header, .loginFormStyleEmployee .employeeCard .employee-card-sub-header { font-size: 24px !important; line-height: 28px !important; margin-bottom: 0 !important; } @media screen and (max-width: 768px) { .employeeChangePassword .employeeCard .employee-card-sub-header, .employeeForgotPassword .employeeCard .employee-card-sub-header, .loginFormStyleEmployee .employeeCard .employee-card-sub-header { font-size: 18px !important; line-height: 21px !important; margin-bottom: 0 !important; } .banner .bannerCard, .loginFormStyleEmployee .employeeCard { min-width: 340px !important; margin: 10px !important; } .employeeChangePassword .employeeCard, .employeeForgotPassword .employeeCard { max-width: 360px !important; min-width: 340px !important; margin: 10px !important; } } .employeeChangePassword .employeeCard .card-text { margin-top: 18px !important; margin-bottom: 20px !important; } .employeeBackbuttonAlign { display: none; } .resend-otp { cursor: pointer; } .employee-select-wrap.login-city-dd .options-card { max-height: 200px; } @media screen and (max-width: 768px) { .employeeBackbuttonAlign { display: block; position: absolute; top: 20px; left: 20px; } .banner { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; padding-bottom: 40px; height: 100vh !important; } .topbar { background: rgba(34, 57, 77, var(--bg-opacity)) !important; color: #fff; } .employee .loginContainer { padding-top: 0 !important; } .removeBottomMargin { margin-bottom: 0 !important; } .employee-select-wrap.login-city-dd .options-card { max-height: 160px; } } .loginFormStyleEmployee .loginCardSubHeaderClassName { text-align: center !important; } .loginFormStyleEmployee .loginCardClassName { margin: auto !important; min-width: 408px !important; } .loginFormStyleEmployee .loginCardClassName header.employee-card-sub-header { text-align: center; margin-top: 10px; } .loginFormStyleEmployee .buttonClassName { max-width: 100% !important; width: 100% !important; } .loginFormStyleEmployee .field .field-container .text-input input, .loginFormStyleEmployee .field .field-container .text-input .digit-checkbox-container .input-emp, .digit-checkbox-container .loginFormStyleEmployee .field .field-container .text-input .input-emp { margin-bottom: 5px !important; } .loginFormStyleEmployee .bannerHeader { margin-bottom: 0 !important; } .loginFormStyleEmployee .primary-label-btn { margin: 20px auto 0 !important; } .loginFormStyleEmployee .employee-select-wrap .options-card { max-height: 150px !important; } .employee .breadcrumb { margin-left: 8px; margin-bottom: 24px; } .employee .ground-container { margin-bottom: 56px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .employee .card-home { font-size: 16px; padding: 0 0 16px; width: 92vw; display: inline-block; margin: 8px auto; } .employee .home-action-cards { height: auto !important; min-height: 263px; } .employee .topbar { position: fixed; top: 0; width: 100%; padding: 16px 24px; background: #fff; -webkit-box-shadow: rgba(0, 0, 0, 0.24) 0 1px 4px; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.24); z-index: 9999; } .employee .topbar img { display: inline; } .employee .topbar img.city { margin-right: 8px; height: 48px; width: 48px; } .employee .topbar img.state { height: 20px; max-height: 20px; width: auto; } .employee .topbar .ulb { font-weight: 700; } .employee .topbar .right { float: right; margin-top: 12px; } .employee .topbar .right .user-img-txt { background: #c84c0e; padding: 10px 15px; border-radius: 50%; color: #fff; font-weight: 700; } .employee .loginContainer, .employee .main { padding-top: 88px; } @media screen and (max-width: 640px) { .employee .grounded-container { margin-left: 0; } } @media screen and (min-width: 641px) { .employee .grounded-container { margin-left: 64px; } } .employee .react-time-picker { width: 100%; } .employee .react-time-picker__wrapper { border: 1px solid #464646; } .employee .react-time-picker__clock { display: none; } .employee .react-time-picker__inputGroup__leadingZero { padding-right: 8px; display: inline !important; } .employee .react-time-picker__inputGroup__input { padding: 0; min-width: none; outline: none !important; border: none !important; } .employee .react-time-picker__wrapper { padding-left: 8px; } .citizen .main { padding-top: 82px; min-height: calc(100vh - 90px); } .citizen .sidebar, .employee .sidebar { position: fixed; left: 0; background: #0b4b66; height: 100%; color: #fff; margin-top: 83px; z-index: 999; -webkit-transition: all .3s ease; transition: all .3s ease; white-space: nowrap; height: calc(100vh - 36px); padding-bottom: 5rem; } .citizen .sidebar .actions, .employee .sidebar .actions { cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 0; } .citizen .sidebar .actions .tooltip, .employee .sidebar .actions .tooltip { margin-left: 16px; } .citizen .sidebar svg, .employee .sidebar svg { width: 24px; height: 24px; fill: #fff; } .citizen .sidebar a, .employee .sidebar a { display: -webkit-box; display: -ms-flexbox; display: flex; } .citizen .sidebar .sidebar-link, .employee .sidebar .sidebar-link { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px; } .citizen .sidebar .sidebar-link.level-0, .employee .sidebar .sidebar-link.level-0 { margin: 0 .3rem; } .citizen .sidebar .sidebar-link.level-0.select-level, .employee .sidebar .sidebar-link.level-0.select-level { border-top: 1px solid; border-bottom: 1px solid; } .citizen .sidebar .sidebar-link.active, .employee .sidebar .sidebar-link.active { color: #c84c0e !important; border-right: none; } .citizen .sidebar .sidebar-link.active svg, .employee .sidebar .sidebar-link.active svg { fill: #c84c0e !important; } .citizen .sidebar .sidebar-link .employee-search-input, .employee .sidebar .sidebar-link .employee-search-input { border: none; outline: none; background-color: transparent; margin-left: 13px; } .citizen .sidebar .sidebar-link .custom-link .tooltip, .employee .sidebar .sidebar-link .custom-link .tooltip { margin-left: 16px; } .citizen .sidebar .sidebar-link .custom-link .tooltip span, .employee .sidebar .sidebar-link .custom-link .tooltip span { margin-left: unset !important; left: unset !important; } .citizen .sidebar .sidebar-link svg, .employee .sidebar .sidebar-link svg { fill: #fff !important; width: 21px; height: 21px; } .citizen .sidebar .sidebar-link:hover, .employee .sidebar .sidebar-link:hover { background-color: #0b4b66; cursor: pointer; } .citizen .sidebar .sidebar-link .search-icon-wrapper, .employee .sidebar .sidebar-link .search-icon-wrapper { border: 2px solid #fff; border-radius: 4px; padding: 5px; } .citizen .sidebar .sidebar-link .search-icon-wrapper svg, .employee .sidebar .sidebar-link .search-icon-wrapper svg { fill: #fff !important; width: 21px; height: 21px; } .citizen .sidebar .sidebar-link .search-icon-wrapper svg path, .employee .sidebar .sidebar-link .search-icon-wrapper svg path { fill: #fff !important; } .citizen .sidebar .dropdown-link, .citizen .sidebar .sidebar-link, .employee .sidebar .dropdown-link, .employee .sidebar .sidebar-link { display: -webkit-box; display: -ms-flexbox; display: flex; color: #fff; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 14px; } .citizen .sidebar .dropdown-link, .employee .sidebar .dropdown-link { height: 40px; margin-left: 40px; text-decoration: none; } .citizen .sidebar .dropdown-link .actions .tooltiptext, .employee .sidebar .dropdown-link .actions .tooltiptext { left: unset; right: 1%; } .citizen .sidebar .dropdown-link svg, .employee .sidebar .dropdown-link svg { width: 20px; height: 20px; fill: #fff; } .citizen .sidebar .dropdown-link:hover, .employee .sidebar .dropdown-link:hover { background-color: #6a8e9d; opacity: .8; cursor: pointer; } .citizen .sidebar .dropdown-link:hover svg, .employee .sidebar .dropdown-link:hover svg { fill: #fe7a51 !important; } .citizen .sidebar .dropdown-link.active, .employee .sidebar .dropdown-link.active { border-left: 4px solid #c84c0e; color: #c84c0e !important; border-right: none; } .citizen .sidebar .dropdown-link.active.level-1, .employee .sidebar .dropdown-link.active.level-1 { border-left: 8.5px solid #c84c0e; } .citizen .sidebar .dropdown-link.active.level-2, .employee .sidebar .dropdown-link.active.level-2 { border-left: 4px solid #c84c0e; } .citizen .sidebar .dropdown-link.active svg, .employee .sidebar .dropdown-link.active svg { fill: #c84c0e !important; } .citizen .sidebar span, .employee .sidebar span { margin-left: 16px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .citizen .wrapperStyles, .employee .wrapperStyles { margin-top: -5px; padding-left: 20px; padding-top: 10px; } .citizen .wrapperStyles .containerStyles, .employee .wrapperStyles .containerStyles { border: 1px solid #505a5f; padding: 16px; margin-bottom: 20px; } .citizen .wrapperStyles.leftBorder, .employee .wrapperStyles.leftBorder { border-left: 2px solid rgba(0, 0, 0, 0.12); } .citizen .rowContainerStyles, .employee .rowContainerStyles { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .citizen .tableContainerStyles, .employee .tableContainerStyles { border: 1px solid #505a5f; padding: 16px; margin-bottom: 20px; } .citizen .historyTables, .employee .historyTables { display: grid; grid-template-rows: 100px 100px; grid-template-columns: repeat(5, minmax(100px, 1fr)); } .citizen .historyContent, .employee .historyContent { margin: 0 10px; position: relative; padding-bottom: 5px; } .citizen .historyCheckpoint, .employee .historyCheckpoint { background-color: #fe7a51; border-radius: 100%; width: 18px; height: 18px; display: inline-block; position: relative; left: -9px; top: 4px; } .citizen .historyCheckpoint.zIndex, .employee .historyCheckpoint.zIndex { z-index: 10; } .citizen .historyTableDateLabel, .employee .historyTableDateLabel { color: rgba(0, 0, 0, 0.87); font-size: 16px; font-weight: 700; line-height: 17px; text-align: left; display: inline-block; padding-top: 5px; } .citizen .bottomMargin, .employee .bottomMargin { margin-bottom: 0; } .citizen .historyTableDate, .employee .historyTableDate { color: rgba(0, 0, 0, 0.87); font-size: 19px; font-weight: 400; line-height: 17px; text-align: left; display: inline-block; padding-top: 10px; } .citizen .historyHorizontalBar, .employee .historyHorizontalBar { background-color: rgba(0, 0, 0, 0.12); width: auto; height: 2px; margin-left: 16px; } .citizen .smallText, .employee .smallText { font-weight: 500; font-size: 14px; } .citizen .sidebar { margin-top: 54px; min-width: 200px; } .citizen .sidebar .actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; grid-gap: 10px; gap: 10px; } .link { --text-opacity:1; color: #c84c0e; color: rgba(200, 76, 14, var(--text-opacity)); cursor: pointer; } .link :hover { --text-opacity:1; color: #c8602b; color: rgba(200, 96, 43, var(--text-opacity)); } .RightMostTopBarOptions { display: -webkit-box; display: -ms-flexbox; display: flex; } .RightMostTopBarOptions .EventNotificationWrapper { position: relative; cursor: pointer; margin-left: 16px; } .RightMostTopBarOptions .EventNotificationWrapper span { top: -10px; right: -10px; position: absolute; --bg-opacity:1; background-color: #d4351c; background-color: rgba(212, 53, 28, var(--bg-opacity)); height: 1.25rem; width: 1.25rem; border-radius: 9999px; text-align: center; } .RightMostTopBarOptions .EventNotificationWrapper span p { line-height: 20px; } .RightMostTopBarOptions .select-wrap { margin-bottom: unset; } .RightMostTopBarOptions .select-wrap svg { fill: #fff; } @media (min-width: 640px) { .employee .ground-container { display: block; } .employee .breadcrumb { margin-bottom: 24px; margin-left: 0; } .employee .card-home { width: 270px; margin-right: 10px; margin-bottom: 10px; } .employee .card-home-hrms { width: 405px; padding: 0; margin-right: 16px; margin-bottom: 16px; } .employee .main { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding-top: 80px; margin-left: 72px; width: calc(100% - 83px); } .employee .citizen-home-container, .employee .main { display: -webkit-box; display: -ms-flexbox; display: flex; } .employee .citizen-home-container { -webkit-box-orient: unset !important; -webkit-box-direction: unset !important; -ms-flex-direction: unset !important; flex-direction: unset !important; width: unset !important; margin-left: unset !important; padding-top: 58px; } .citizen .main { width: 100%; padding-top: 58px; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .fullWidth { width: 100%; } .multi-select-container .disposal-text { font-weight: 700; } .multi-select-container .disposal-info { margin-top: 16px; margin-bottom: 16px; margin-left: 8px; } .multi-select-container .disposal-action-bar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 780px) { .d-grid { display: grid; grid-template-columns: 250px 250px 250px 250px; grid-column-gap: 10px; -webkit-column-gap: 10px; -moz-column-gap: 10px; column-gap: 10px; grid-row-gap: 2px; row-gap: 2px; margin-left: -12px; } } .m-auto { margin: auto !important; } .mb-50 { margin-bottom: 50px; } .mb-25 { margin-bottom: 25px; } .back-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .back-wrapper .top-back-btn { margin-bottom: 0; color: #fff; margin-right: 1em; } .back-wrapper .top-back-btn svg { fill: #fff; } .back-wrapper .hambuger-back-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; } @media (min-width: 780px) { .back-wrapper .hambuger-back-wrapper .hamburger-span { display: none; } } @media (min-width: 780px) { .back-wrapper { margin-right: 2rem; margin-left: 2rem; } } @media (min-width: 780px) { .user-profile { width: calc(100% - 219px); margin-left: 16px; margin-right: 16px; } } .link a { color: inherit; text-decoration: inherit; } .breadcrumb a { color: inherit; text-decoration: inherit; } .sidebar-link.active .custom-link { text-decoration: none; } .sidebar-link.active .custom-link div span { color: #c84c0e !important; text-decoration: none; } .bread-crumb a { color: inherit; text-decoration: inherit; } .sidebar-link .custom-link { text-decoration: none; } .sidebar-link .custom-link div span { color: #fff; text-decoration: none; } .customEmployeeCard { margin: 8px !important; } .digit-accordion-title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; cursor: pointer; background-color: initial; grid-gap: .75rem; gap: .75rem; } @media (max-aspect-ratio: 9 / 16) { .digit-accordion-title { padding-left: 1rem; padding-bottom: 1rem; padding-right: 1rem; padding-top: 1rem; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-accordion-title { padding-left: 1.25rem; padding-bottom: 1.25rem; padding-right: 1.25rem; padding-top: 1.25rem; } } @media (min-aspect-ratio: 3 / 4) { .digit-accordion-title { padding-left: 1.5rem; padding-bottom: 1.5rem; padding-right: 1.5rem; padding-top: 1.5rem; } } .digit-accordion-icon { width: 1.5rem; height: 1.5rem; -ms-flex-negative: 0; flex-shrink: 0; } .digit-accordion-number { min-width: 1.5rem; height: 1.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media (max-aspect-ratio: 9 / 16) { .digit-accordion-number { font-size: 1rem; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-accordion-number { font-size: 1rem; } } @media (min-aspect-ratio: 3 / 4) { .digit-accordion-number { font-size: 1rem; } } .digit-accordion-header-title, .digit-accordion-number { font-family: Roboto; font-style: normal; font-weight: 700; line-height: 1.14rem; color: #363636; } .digit-accordion-header-title { margin-top: .18rem; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } @media (max-aspect-ratio: 9 / 16) { .digit-accordion-header-title { font-size: 1rem; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-accordion-header-title { font-size: 1rem; } } @media (min-aspect-ratio: 3 / 4) { .digit-accordion-header-title { font-size: 1rem; } } .digit-accordion-content { max-height: 0; overflow: hidden; -webkit-transition: max-height .3s ease,padding .3s ease; transition: max-height .3s ease,padding .3s ease; background-color: initial; display: -webkit-box; display: -ms-flexbox; display: flex; grid-gap: .625rem; gap: .625rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; font-family: Roboto; font-style: normal; font-weight: 400; line-height: 1.37rem; color: #363636; } @media (max-aspect-ratio: 9 / 16) { .digit-accordion-content { font-size: .875rem; padding-left: 1rem; padding-bottom: 0; padding-right: 1rem; padding-top: 0; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-accordion-content { font-size: 1rem; padding-left: 1.25rem; padding-bottom: 0; padding-right: 1.25rem; padding-top: 0; } } @media (min-aspect-ratio: 3 / 4) { .digit-accordion-content { font-size: 1rem; padding-left: 1.5rem; padding-bottom: 0; padding-right: 1.5rem; padding-top: 0; } } .digit-accordion-content.open { max-height: -webkit-fit-content; max-height: -moz-fit-content; max-height: fit-content; } @media (max-aspect-ratio: 9 / 16) { .digit-accordion-content.open { padding-left: 1rem; padding-bottom: 1rem; padding-right: 1rem; padding-top: 1rem; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-accordion-content.open { padding-left: 1.25rem; padding-bottom: 1.25rem; padding-right: 1.25rem; padding-top: 1.25rem; } } @media (min-aspect-ratio: 3 / 4) { .digit-accordion-content.open { padding-left: 1.5rem; padding-bottom: 1.5rem; padding-right: 1.5rem; padding-top: 1.5rem; } } .digit-accordion.border { border: .063rem solid #d6d5d4; } .digit-accordion.borderRadius { border-radius: .25rem; } .digit-accordion.withDivider .digit-accordion-content.open { border-top: 1px solid #d6d5d4; } .digit-accordion.no-divider .digit-accordion-title { padding-bottom: 0; } .digit-accordion.cardBg { background-color: #fff; } .digit-accordion.cardBg.nested { background-color: #fafafa; } @-webkit-keyframes rotateOpen { 0% { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } to { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } } @keyframes rotateOpen { 0% { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } to { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } } @-webkit-keyframes rotateClose { 0% { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } to { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } } @keyframes rotateClose { 0% { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } to { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } } .digit-accordion-toggle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 1.5rem; height: 1.5rem; } .digit-accordion-toggle.animate-open svg { -webkit-animation: rotateOpen .5s ease forwards; animation: rotateOpen .5s ease forwards; } .digit-accordion-toggle.animate-close svg { -webkit-animation: rotateClose .5s ease forwards; animation: rotateClose .5s ease forwards; } .digit-accordion-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media (max-aspect-ratio: 9 / 16) { .digit-accordion-wrapper { grid-gap: 1rem; gap: 1rem; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-accordion-wrapper { grid-gap: 1.25rem; gap: 1.25rem; } } @media (min-aspect-ratio: 3 / 4) { .digit-accordion-wrapper { grid-gap: 1.5rem; gap: 1.5rem; } } .digit-accordion-divider { width: 100%; } .digit-back-link { grid-gap: .25rem; gap: .25rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .digit-back-link .digit-back-link-icon { -ms-flex-negative: 0; flex-shrink: 0; width: 1.5rem; height: 1.5rem; cursor: pointer; } @media (max-width: 30rem) { .digit-back-link .digit-back-link-icon { width: 1.25rem; height: 1.25rem; } } .digit-back-link .digit-back-link-label { color: #0b4b66; margin-top: .063rem; cursor: pointer; } .digit-back-link.disabled { pointer-events: none; } .digit-back-link.disabled .digit-back-link-label { color: #c5c5c5; cursor: default; } .digit-back-link.disabled .digit-back-link-icon { cursor: default; } body { background-color: #fafafa; } .body-container { height: 100%; min-height: 100vh; overflow-x: hidden; } .body-container::-webkit-scrollbar { display: none; } .h1 { font-size: 24px; line-height: 32px; font-weight: 700; } .h1, .link-label { margin-bottom: 16px; margin-left: 16px; } .link-label { display: block; cursor: pointer; } @media (min-width: 780px) { .h1 { font-size: 36px; line-height: 40px; } .h1, .link-label { margin-left: 0; } } .digit-bottom-sheet { position: fixed; left: 0; right: 0; bottom: 0; -webkit-transition: height .3s ease; transition: height .3s ease; background-color: #fff; -webkit-box-shadow: 0 -0.063rem 0.25rem -0.063rem rgba(0, 0, 0, 0.14902); box-shadow: 0 -0.063rem 0.25rem -0.063rem rgba(0, 0, 0, 0.14902); overflow: hidden; border-radius: .75rem .75rem 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .digit-bottom-sheet.full { border-radius: 0; } .digit-bottom-sheet.closed.actionsEnabled { height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } .digit-bottom-sheet-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 2.5rem; } .digit-bottom-sheet-header.actionsEnabled { height: 1.5rem; } .digit-bottom-sheet-drag-cursor { position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100%; height: 100%; background-color: initial; cursor: ns-resize; } .digit-bottom-sheet-handle-indicator { width: 6.25rem; height: .375rem; border-radius: .25rem; background-color: #d9d9d9; margin: .5rem 0; } .digit-bottom-sheet-header.full .digit-bottom-sheet-handle-indicator { display: none; } .digit-bottom-sheet-content { overflow-y: scroll; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; } @media (max-aspect-ratio: 9 / 16) { .digit-bottom-sheet-content { grid-gap: 1rem; gap: 1rem; } } @media (min-aspect-ratio: 9 / 16) and (max-aspect-ratio: 3 / 4) { .digit-bottom-sheet-content { grid-gap: 1.25rem; gap: 1.25rem; } } @media (min-aspect-ratio: 3 / 4) { .digit-bottom-sheet-content { grid-gap: 1.5rem; gap: 1.5rem; } } .digit-bottom-sheet-actions, .digit-bottom-sheet-content { padding: 1rem; display: -webkit-box; display: -ms-flexbox; display: flex; } .digit-bottom-sheet-actions { grid-gap: 1.5rem; gap: 1.5rem; background-color: #fff; -webkit-box-shadow: 0 0.063rem 0.188rem 0.063rem rgba(0, 0, 0, 0.14902); box-shadow: 0 0.063rem 0.188rem 0.063rem rgba(0, 0, 0, 0.14902); -webkit-box-shadow: 0 0.063rem 0.125rem 0 rgba(0, 0, 0, 0.30196); box-shadow: 0 0.063rem 0.125rem 0 rgba(0, 0, 0, 0.30196); -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .digit-bottom-sheet-actions.equalButtons { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .digit-bottom-sheet-actions.equalButtons button { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } @media (max-aspect-ratio: 9 / 16) { .digit-bottom-sheet-actions { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .digit-bottom-sheet-actions button { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } } .digit-bottom-sheet-content::-webkit-scrollbar { width: .375rem; background-color: #eee; } .digit-bottom-sheet-content::-webkit-scrollbar-track { background-color: #eee; border-radius: .563rem; } .digit-bottom-sheet-content::-webkit-scrollbar-thumb { background-color: #d6d5d4; border-radius: .563rem; } .home-link a { color: #1d70b8; } .application-details-link-button .download-button { color: #c84c0e; margin-left: 8px; } .response-download-button .download-button { color: #c84c0e; margin-left: 8px; } .form-pt-dropdown-only .options-card { position: unset; } .primary-label-btn svg { fill: #c84c0e; } .react-time-picker__wrapper { border: 2px solid #0b0c0c; padding-left: 16px; } .react-time-picker__inputGroup__input { padding-left: 8px; padding-right: 8px; line-height: 2.5rem; min-width: 16px; } .react-time-picker__inputGroup__input:focus { outline: