ul.standard-list { margin-left: 2em; } ul.standard-list li { list-style: disc; } /* Form */ .form-control { padding: 6px 14px; font-size: 14px; font-weight: 300; color: var(--black); line-height: 1em; } .form-control:focus { color: var(--black); } .form-control::placeholder { color: var(--black); opacity: 0.75; } .theme-form input[type="text"].form-control.input-white, .theme-form input[type="email"].form-control.input-white, .theme-form input[type="search"].form-control.input-white, .theme-form input[type="password"].form-control.input-white, .theme-form input[type="number"].form-control.input-white, .theme-form input[type="tel"].form-control.input-white, .theme-form input[type="date"].form-control.input-white, .theme-form input[type="datetime-local"].form-control.input-white, .theme-form input[type="time"].form-control.input-white, .theme-form input[type="datetime-local"].form-control.input-white, .theme-form input[type="month"].form-control.input-white, .theme-form input[type="week"].form-control.input-white, .theme-form input[type="url"].form-control.input-white, .theme-form input[type="file"].form-control.input-white, .theme-form textarea.form-control.input-white, .theme-form select.form-control.input-white { color: var(--white); background-color: transparent; border-color: var(--white); box-shadow: none; } textarea.form-control { min-height: 70px; line-height: 1.2em; } .theme-form .form-control.input-white::placeholder { color: var(--white); opacity: 0.75; } .form-control::placeholder { color: currentColor; opacity: 1; } .form-control::file-selector-button { padding-right: 30px; border-radius: var(--bs-border-radius); border: 1px solid; border-radius: var(--bs-border-radius); display: inline-block; margin-left: -0.74rem; scale: 1.06; height: 33px; background-color: transparent; font-size: 12px; border-color: var(--border-color); color: var(--black); } .form-check-input:checked { background-color: var(--theme-default); border-color: var(--white); } .form-wizard .step { height: 8px; width: 8px; background-color: var(--theme-tertiary); border-radius: 8px; will-change: width; transition: width 0.5s ease; } .form-wizard .step.active { width: 24px; } .form-wizard .step.finish { background-color: var(--theme-tertiary); } a#prevBtn { position: absolute; font-size: 25px; } .form-group.has-switch { display: flex; flex-direction: row; align-items: center; gap: 5px; } .switch input + .switch-state.bg-primary { background-color: var(--color-grey) !important; } .switch input:checked + .switch-state.bg-primary { background-color: var(--theme-default) !important; } .switch-state:before { box-shadow: 0px 3px 1px 0 rgba(0, 0, 0, 0.06), 0px 3px 8px 0 rgba(0, 0, 0, 0.15); } /* END - Form */ /* Buttons */ .btn { text-transform: uppercase; font-size: 16px; } .btn:focus { color: var(--bs-btn-hover-color); } .btn-secondary { background-color: var(--theme-secondary); border: 1px solid var(--theme-secondary); color: var(--theme-default); } .btn-secondary:hover, .btn-secondary:focus, .btn-secondary.active, .btn-secondary:active:focus, .btn-secondary.show { background-color: var(--theme-primary); } .btn-medium { width: 110px; max-width: 100%; font-weight: 500; } .btn-large { width: 200px; max-width: 100%; } /* END - Buttons */ .badge { pointer-events: none; } .text-underline { text-decoration: underline !important; } /* Frontend */ .login-card, .registration-card, .onboarding-card { min-height: 100vh; display: flex; align-items: center; justify-content: center; margin: 0 auto; padding: 30px 12px; background: none; background-color: var(--bs-body-bg); } .registration-card, .onboarding-card { background-color: var(--primary-color); } .login-card .login-main, .registration-card .registration-main, .onboarding-card .onboarding-main { max-width: 650px; width: calc(100dvw - 15px); padding: 80px 40px; border-radius: 40px; box-shadow: 0 0 37px rgba(0, 0, 0, 0.05); margin: 0 auto; background-color: var(--bs-body-bg); min-height: 700px; } .registration-card .registration-main, .onboarding-card .onboarding-main { max-width: 1075px; background-color: var(--bs-body-bg); } .login-card .login-main .login-inner { max-width: 422px; } .registration-card .registration-main .registration-inner { max-width: 860px; } .onboarding-card .onboarding-main .onboarding-inner { max-width: 690px; } .login-card .login-main .login-inner .form-logo, .registration-card .registration-main .registration-inner .form-logo, .onboarding-card .onboarding-main .onboarding-inner .form-logo { max-width: min(330px, 100%); } .login-card .login-main .theme-form label, .registration-card .registration-main .theme-form label { font-size: 16px; font-weight: 600; } .onboarding-card .onboarding-main .theme-form label { font-size: 16px; font-weight: 400; } .login-card .login-main .theme-form input::-webkit-input-placeholder { color: inherit; } .login-card .login-main .theme-form .form-group { margin-bottom: 0; } .show-hide span { cursor: pointer; font-size: 18px; color: var(--theme-default); font-family: "iconly" !important; speak: never; font-style: normal; font-variant: normal; text-transform: none; font-weight: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 300; } .show-hide span.show:before { content: "\e950"; } .show-hide span:before { content: "\e932"; } .login-card .login-main .theme-form .show-hide, .registration-card .registration-main .theme-form .show-hide, .onboarding-card .onboarding-main .theme-form .show-hide { top: 20px; } .theme-form input.is-invalid[type="password"] ~ .show-hide { right: 30px; } .login-card input[type="password"] { padding: 6px 60px 6px 14px !important; } .theme-form input[type="text"], .theme-form input[type="email"], .theme-form input[type="search"], .theme-form input[type="password"], .theme-form input[type="number"], .theme-form input[type="tel"], .theme-form input[type="date"], .theme-form input[type="datetime-local"], .theme-form input[type="time"], .theme-form input[type="datetime-local"], .theme-form input[type="month"], .theme-form input[type="week"], .theme-form input[type="url"], .theme-form input[type="file"], .theme-form textarea, .theme-form select { border-color: var(--border-color); background-color: transparent; font-size: 14px; padding: 6px 14px; box-shadow: none; font-weight: 300; height: 35px; } .theme-form textarea { padding: 9.7px 14px; } @media (max-width: 991.98px) { .login-card .login-main { width: 550px; } } @media (max-width: 575.98px) { .login-card .login-main .theme-form .form-group { margin-bottom: 0; } } /* END - Frontend */ /* sidebar */ .page-header .logo-wrapper .sidebar-logo { height: 46px; margin: auto; } .page-sidebar { margin-top: 83px; background: var(--theme-default); } .page-sidebar .sidebar-menu::-webkit-scrollbar { width: 5px; height: 7px; border-color: var(--theme-default); } .page-sidebar .sidebar-menu::-webkit-scrollbar-thumb { background-color: var(--white); border-radius: 10px; } .page-sidebar .sidebar-menu::-webkit-scrollbar-track { background: var(--theme-default); border-color: var(--theme-default); } .simplebar-wrapper { width: 100%; } .page-wrapper.compact-wrapper .page-body-wrapper .page-sidebar .sidebar-menu .simplebar-wrapper .simplebar-content { gap: 10px; } .sidebar-menu { padding: 15px 31px 15px 11px; } .page-sidebar .sidebar-menu .sidebar-list { border: none; } .page-sidebar .sidebar-submenu { margin-left: 88px; margin-bottom: 15px; margin-top: 2px; border-left: 1px solid var(--white); } .page-sidebar .sidebar-submenu li { list-style-type: none; padding: 0 5px; } .page-sidebar .sidebar-submenu a { padding-left: 4px; color: var(--white); font-size: 14px; font-weight: 400; } .page-sidebar .sidebar-submenu a::before { display: none; } .sidebar-menu .sidebar-list:hover .sidebar-link, .sidebar-menu .sidebar-list .sidebar-link.active { background: transparent; color: var(--white); border: none; } .page-sidebar .sidebar-menu .sidebar-list:has(.active) { background-color: var(--color-lilla); border-radius: 10px; color: var(--white); } .page-sidebar .sidebar-submenu:has(.active) { display: block !important; } .sidebar-menu .sidebar-list:hover .sidebar-link i, .sidebar-menu .sidebar-list:hover .sidebar-link a, .sidebar-menu .sidebar-list:hover .sidebar-link span { color: var(--white); } .sidebar-menu .sidebar-list .sidebar-link { color: var(--white); font-size: 16px; font-weight: 400; } .sidebar-menu .sidebar-list .sidebar-link .main-icon { margin-left: 0; margin-right: 28px; font-size: 20px; } .sidebar-menu .sidebar-list .sidebar-link { background-color: transparent; color: var(--white); border-radius: unset; font-size: 16px; font-weight: 400; padding: 15px 26px; } .page-sidebar .sidebar-menu .sidebar-list:has(.active) .arrow { transform: rotate(180deg); } /* END - sidebar */ .row.w-100 { width: calc(100% + var(--bs-gutter-x)) !important; } .notification-icon { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border: 1px solid; border-radius: 100%; cursor: pointer; color: var(--theme-default); } .user-img { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border: 1px solid var(--theme-default); border-radius: 100%; cursor: pointer; background-color: var(--theme-default); text-align: center; color: var(--theme-tertiary); font-weight: normal; font-size: 20px; overflow: hidden; } /* Content */ .page-wrapper .page-body-wrapper .page-body { min-height: calc(100dvh - 83px); padding-bottom: 10px; } .slot-info { padding: 39px 22px; } .page-body .slot-title { font-size: 24px; text-transform: uppercase; } .slot-breadcrumbs { display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: center; gap: 20px; } .slot-breadcrumbs a { font-size: 16px; font-weight: 700; position: relative; } .slot-breadcrumbs a:not(:first-of-type):before { content: "/"; position: absolute; left: -13px; } .page-wrapper .page-body-wrapper .page-body .page-content { padding: 24px; border-radius: 16px; background-color: #ffffff; margin-bottom: 10px; } /* End - Content */ /* Tabs */ .section-tabs { padding-bottom: 40px; display: flex; column-gap: 64px; row-gap: 10px; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: baseline; } .section-tabs .section-tab { position: relative; font-size: 16px; font-weight: 500; cursor: pointer; padding-inline: 1px; user-select: none; } .section-tabs .section-tab::after { content: ""; position: absolute; width: 100%; height: 3px; left: 0; bottom: -2px; opacity: 0; background-color: var(--theme-tertiary); } .section-tabs .section-tab:hover::after { opacity: 0.25; } .section-tabs .section-tab.active::after { opacity: 1; } .section-content { display: none; padding: 0 16px; } .section-content.active { display: block; } /* END - Tabs */ /* Table */ div.dt-container div.dt-layout-row { margin: 24px 0 0 0; } div.dt-container div.dt-layout-row.dt-layout-table { margin-top: 0; } div.dt-container select.dt-input { border-radius: 8px; padding-inline: 16px; padding-block: 3px 5px; margin-left: 16px; font-size: 16px; font-weight: 400; height: 28px; border: 1px solid var(--border-color); } div.dt-container .dt-search input { border-color: #00000080; border-radius: 8px; height: 32px; padding-inline: 36px 12px; margin: 0; } div.dt-container .dt-search label { position: absolute; top: 0; left: 0; height: 32px; width: 40px; display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center; color: var(--theme-default); font-size: 16px; font-weight: 900; font-family: "Font Awesome 6 Free"; -webkit-font-smoothing: antialiased; font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto; } div.dt-container .dt-search { position: relative; } div.dt-container .dt-search label:after { content: "\f002"; } table.dataTable thead > tr > th.dt-orderable-asc:hover, table.dataTable thead > tr > th.dt-orderable-desc:hover, table.dataTable thead > tr > td.dt-orderable-asc:hover, table.dataTable thead > tr > td.dt-orderable-desc:hover { outline: none; } table.dataTable.order-column > tbody tr:not(:hover) > .sorting_1, table.dataTable.order-column > tbody tr:not(:hover) > .sorting_2, table.dataTable.order-column > tbody tr:not(:hover) > .sorting_3, table.dataTable.display > tbody tr:not(:hover) > .sorting_1, table.dataTable.display > tbody tr:not(:hover) > .sorting_2, table.dataTable.display > tbody tr:not(:hover) > .sorting_3, table.dataTable.display tbody tr:not(:hover) > .sorting_1, table.dataTable.order-column.hover tbody tr:not(:hover) > .sorting_1, table.dataTable.stripe > tbody > tr:not(:hover):nth-child(odd) > *, table.dataTable.display > tbody > tr:not(:hover):nth-child(odd) > * { box-shadow: unset; } table.dataTable > thead > tr > th, table.dataTable > thead > tr > td { padding: 24px 24px 16px 24px; } table.dataTable > tbody > tr > th, table.dataTable > tbody > tr > td { padding: 22px 24px; } table.dataTable .dt-actions { display: flex; justify-content: center; gap: 12px; } table.dataTable .dt-actions .dt-action { font-size: 16px; cursor: pointer; height: 24px; width: 24px; display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center; } div.dt-container .dt-info { font-size: 14px; } div.dt-container .dt-paging nav { display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center; gap: 6px; } div.dt-container .dt-paging .dt-paging-button, div.dt-container .dt-paging .dt-paging-button:hover, div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover { width: 26px; height: 26px; padding: 0px; margin: 0; border: none; border-radius: 4px; background: unset; background-color: rgb(0 0 0 / 8%); font-size: 14px; box-shadow: none; } div.dt-container .dt-paging .dt-paging-button:hover, div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover { background-color: var(--theme-default); color: var(--white) !important; } div.dt-container .dt-paging .dt-paging-button.first, div.dt-container .dt-paging .dt-paging-button.first.disabled, div.dt-container .dt-paging .dt-paging-button.first:hover, div.dt-container .dt-paging .dt-paging-button.first.disabled:hover, div.dt-container .dt-paging .dt-paging-button.previous, div.dt-container .dt-paging .dt-paging-button.previous.disabled, div.dt-container .dt-paging .dt-paging-button.previous:hover, div.dt-container .dt-paging .dt-paging-button.previous.disabled:hover, div.dt-container .dt-paging .dt-paging-button.next, div.dt-container .dt-paging .dt-paging-button.next.disabled, div.dt-container .dt-paging .dt-paging-button.next:hover, div.dt-container .dt-paging .dt-paging-button.next.disabled:hover, div.dt-container .dt-paging .dt-paging-button.last, div.dt-container .dt-paging .dt-paging-button.last.disabled, div.dt-container .dt-paging .dt-paging-button.last:hover, div.dt-container .dt-paging .dt-paging-button.last.disabled:hover { background: transparent; color: #ababab !important; opacity: 1; border: none; position: relative; font-size: 0; } div.dt-container .dt-paging .dt-paging-button.first:not(.disabled):hover:after, div.dt-container .dt-paging .dt-paging-button.previous:not(.disabled):hover:after, div.dt-container .dt-paging .dt-paging-button.next:not(.disabled):hover:after, div.dt-container .dt-paging .dt-paging-button.last:not(.disabled):hover:after { opacity: 0.66; } div.dt-container .dt-paging .dt-paging-button.first:after, div.dt-container .dt-paging .dt-paging-button.previous:after, div.dt-container .dt-paging .dt-paging-button.next:after, div.dt-container .dt-paging .dt-paging-button.last:after { content: ""; width: 100%; height: 100%; display: flex; position: absolute; top: 0; left: 0; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center; opacity: 0.33; } div.dt-container .dt-paging .dt-paging-button.first:after { content: url(/assets/images/pagination/first.svg); } div.dt-container .dt-paging .dt-paging-button.previous:after { content: url(/assets/images/pagination/previous.svg); } div.dt-container .dt-paging .dt-paging-button.next:after { content: url(/assets/images/pagination/next.svg); } div.dt-container .dt-paging .dt-paging-button.last:after { content: url(/assets/images/pagination/last.svg); } /* END - Table */