/* Header */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");

:root {
    --primary-color: #727cf5;
    --background-grey: #f5f5f5;
}

* {
    margin: 0;
    padding: 0;
}

html,
body {
    width: 100%;
    height: 100%;
    color: rgba(0, 0, 0, 1);
    overflow-x: hidden;
    background-color: #f7f7fa;
}

body {
    font-family: 'Roboto', sans-serif;
}

/* Tab UI */
.tab-wrapper {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #fff;
}

.tab-header {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    border-bottom: 1px solid #e5e5e5;
    overflow-x: auto;
    overflow-y: hidden;
}

.tab-header .tab-btn {
    padding: 15px 20px;
    border: none;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    background-color: transparent;
    transition: all 0.3s ease;
}

.tab-header .tab-btn i {
    margin-right: 5px;
}

.tab-header .tab-btn:hover,
.tab-header .tab-btn.active {
    color: var(--primary-color);
}

.tab-header .underline {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 2px;
    width: 0;
    transition: all 0.3s;
    background-color: var(--primary-color);
}

.tab-body {
    display: flex;
    overflow: hidden;
}

.tab-body .tab-content {
    min-width: 100%;
    transition: all 0.3s;
    text-align: justify;
}

/* */
.sidenav {
    color: #eee;
    background-color: #0b0f19;
    min-height: 100vh !important;
    max-width: 18rem !important;
    font-size: 14px;
    user-select: none;
    -moz-box-shadow: inset 0 0 10px #0b0f19;
    -webkit-box-shadow: inset 0 0 10px #0b0f19;
    box-shadow: inset 0 0 10px #0b0f19;
}

.sidenav .title {
    font-weight: bold;
    font-size: 22px;
}

.sidenav .itembox {
    cursor: pointer;
    color: #adb5bd;
    font-weight: 400;
    transition: color 75ms ease-in-out;
}

.sidenav .element-selected {
    color: #e9ecef;
    font-weight: 500;
}

.sidenav .sidenav-element {
    text-decoration: none;
}

.sidenav-wrapper {
    min-height: calc(100vh - 188px);
}

.sidenav-link {
    color: #adb5bd;
    text-decoration: none;
    font-size: 12px;
}

.sidenav-link:hover {
    color: #fff;
}

.sidenav-unexpanded {
    display: none;
}

.parent-active {
    background: #000;
}

.expandable-subelement {
    max-height: 0;
    transition: max-height 0.1s ease-out;
    overflow: hidden;
}

.expandable-subelement-expanded {
    max-height: 232px;
    transition: max-height .25s ease-in-out;
}

.subelement-current {
    max-height: 232px !important;
    transition: none !important;
}

.dashboard {
    background-color: #f7f7fa;
}

.element {
    background-color: #fff;
}

.content-box {
    background-color: #fff;
    border-radius: 5px;
}

.white-box {
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 5px;
}

.white-box h1 {
    color: #374151;
    font-size: 16px;
    font-weight: 500;
}

.small-box {
    color: #98a6ad;
}

.small-box .title {
    font-size: .9375rem;
    line-height: 1.1;
}

.small-box .content {
    color: #6c757d;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1.1;
}

.small-box .bottom {
    font-size: .9rem;
    line-height: 1.5;
}

.dashboard h1 {
    font-size: 18px;
}

.dashboard h2 {
    font-size: 20px;
}

.dashboard .headline {
    border-bottom: 1px solid #ddd;
}

.dashboard .headline .headline-user {
    user-select: none;
    font-size: 0.875rem;
    line-height: 1.15rem;
    padding: .5rem 1rem;
}

.dashboard .headline .headline-user-type {
    color: #6c757d;
    font-size: 12px;
}

.dashboard .sticky-top {
    border-bottom: 1px solid #ddd;
}

.dashboard .avatar {
    height: 46px;
    width: 46px;
    border-radius: 50%;
}

.dashboard .account-avatar {
    height: 8rem;
    width: 8rem;
    border-radius: 50%;
}

.memoryBox {
    font-size: 12px;
}

.totalMemory {
    color: #fff;
}

.new-group-format-price {
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 300;
}

.sublabel-description {
    font-size: 0.75rem;
}

.delete-link {
    color: #000;
}

.delete-link:hover {
    color: #575757;
}

.form-control-sm:focus {
    box-shadow: none;
    border-color: #ddd;
}

.big-select {
    cursor: pointer;
    border: 2px solid #e3e3e3;
    border-radius: 5px;
    transition: all 0.2s ease-out;
}

.big-select-selected {
    box-shadow: none;
    border: 2px solid #727cf5 !important;
}

.big-select-radio {
    position: fixed;
    opacity: 0;
    pointer-events: none;
}

.big-select-radio:disabled {
    opacity: 0;
}

.dl-link {
    color: #1a1a1a;
}

.dl-link a {
    color: #1a1a1a !important;
    text-decoration: none;
}

.dl-link a:hover {
    text-decoration: underline;
}

.dropzone,
.thumbnail-dropzone,
.viewgallery-thumbnail-dropzone,
.viewgallery-dropzone {
    cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    min-height: 200px;
}

.products-dropzone,
.kindergarten-images-dropzone {
    cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    min-height: 300px;
}

.dropzone-action-link {
    font-size: 12px;
    color: #1a1a1a;
}

.dropzone-action-link:hover {
    color: #000;
    text-decoration: underline;
}

/* Checkout */

.text-input {
    width: 100%;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    height: 40px;
    border: 1px solid #e3e3e3;
    border-radius: 0px;
    transition: all 0.2s ease-out;
}

.text-input:focus {
    box-shadow: none;
    border: 2px solid #1a1a1a !important;
}

.text-input::placeholder {
    color: #bfbfbf;
}

.text-input:not(:placeholder-shown) {
    border: 1px solid #1a1a1a;
}

.text-input-light {
    width: 100%;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    height: 40px;
    border: 1px solid #ced4da;
    border-radius: 0px;
    transition: all 0.2s ease-out;
}

.text-input-light-sm {
    width: 100%;
    font-size: 16px;
    padding: 4px 12px;
    border: 1px solid #ced4da;
    border-radius: 0px;
    transition: all 0.2s ease-out;
}

.text-input-light:focus {
    box-shadow: none;
    border: 2px solid #1a1a1a !important;
}

.text-input-light-sm:focus {
    box-shadow: none;
    border: 1px solid #1a1a1a !important;
}

.text-input-light::placeholder,
.text-input-light-sm::placeholder {
    color: #bfbfbf;
}

.text-input-light:not(:placeholder-shown),
.text-input-light-sm:not(:placeholder-shown) {
    border: 1px solid #ced4da;
}

.text-input-light:disabled {
    background-color: var(--background-grey);
    border: 1px solid #ced4da;
}

.text-input-textarea {
    width: 100%;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #e3e3e3;
    border-radius: 0px;
    transition: all 0.2s ease-out;
}

.text-input-textarea:focus {
    box-shadow: none;
    border: 2px solid #1a1a1a !important;
}

.text-input-textarea::placeholder {
    color: #bfbfbf;
}

.text-input-textarea:not(:placeholder-shown) {
    border: 1px solid #1a1a1a;
}

.text-input-textarea-light {
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #ced4da;
    border-radius: 0px;
    transition: all 0.2s ease-out;
}

.text-input-textarea-light:focus {
    box-shadow: none;
    border: 2px solid #1a1a1a !important;
}

.text-input-textarea-light::placeholder {
    color: #bfbfbf;
}

.text-input-textarea-light:not(:placeholder-shown) {
    border: 1px solid #ced4da;
}

.label-for-input {
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 0px !important;
    font-weight: bold;
}

.text-input-error {
    line-height: 1.5;
    border: 1px solid #ce3535;
    border-radius: 2px;
}

.text-input-error:focus {
    line-height: 1.5;
    border: 2px solid #ce3535;
}

.btn-cancel {
    display: inline-block !important;
    width: 100%;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5;
    padding: 0.25rem 0.5rem;
    text-align: center;
    color: #dc3545;
    background-color: transparent;
    transition: all .15s ease;
    border: 1px solid #dc3545;
    border-radius: .2rem;
    transition: all .15s ease;
    text-decoration: none;
    user-select: none;
}

.btn-cancel:hover {
    color: #fff;
    background-color: #dc3545;
}

.btn-warning {
    color: #000;
    background-color: #f5d76e !important;
    border-color: #f5d76e !important;
    transition: none !important;
    user-select: none;
}

.btn-warning:hover {
    color: #000;
}

.group-text {
    background-color: transparent;
    user-select: none;
}

.btn-group-redo,
.btn-group-show,
.btn-group-copy {
    border-color: #ced4da;
    border-left-color: #fff;
    border-radius: 0;
}

.btn-group-redo:hover,
.btn-group-show:hover,
.btn-group-copy:hover {
    background-color: transparent;
    border-color: #ced4da;
    border-left-color: #fff;
}

.btn-group-redo:focus,
.btn-group-show:focus,
.btn-group-copy:focus {
    box-shadow: none;
}

.btn-group-copy.copy-disabled {
    background-color: var(--background-grey);
    border-top: 1px solid #ced4da;
    border-right: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
    border-left: 1px solid var(--background-grey);
}

.form-check-label {
    user-select: none;
}

.form-switch .form-check-label {
    cursor: pointer;
    user-select: none;
}

.switch-input {
    box-shadow: none !important;
}

.switch-input:focus {
    border-color: 1px solid rgba(0, 0, 0, .25) !important;
}

.form-switch .form-check-input {
    height: 18px;
    width: 36px;
}

.form-switch .form-check-input:focus {
    border-color: rgba(0, 0, 0, 0.25);
    outline: 0;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(0,0,0,0.25)'/></svg>");
}

.form-switch .form-check-input:checked {
    background-color: #727cf5;
    border-color: #727cf5;
    border: none;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(255,255,255,1.0)'/></svg>");
}

.form-check label {
    margin-top: 1px;
}

.form-check .form-checkbox {
    height: 17px;
    width: 17px;
}

.form-check .form-checkbox:checked {
    background-color: #727cf5 !important;
}

.form-check .form-checkbox:focus {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    border-color: #727cf5;
}

.form-check .form-checkbox:active {
    background-color: #727cf5;
}

.form-check .form-check-input[type="radio"] {
    height: 17px;
    width: 17px;
}

.form-check .form-check-input[type="radio"]:checked {
    background-color: #727cf5 !important;
}

.form-check .form-check-input[type="radio"]:focus {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    border-color: #727cf5;
}

.form-check .form-check-input[type="radio"]:active {
    background-color: #727cf5;
}

.bg-success {
    background-color: #3fc380 !important;
}

.bg-danger {
    background-color: #d64541 !important;
}

.bg-warning {
    background-color: #f5d76e !important;
}

.th-date {
    font-weight: 300;
}

th {
    font-weight: 300;
}

.payment-method-label,
.delivery-method-label {
    font-weight: 300;
}

.payment-description {
    color: #1a1a1a;
    font-weight: 400;
}

.accordion-item,
.accordion-button {
    border-radius: 0 !important;
}

.accordion-button {
    color: #1a1a1a !important;
    font-weight: 500;
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-button.collapsed {
    color: #1a1a1a !important;
    font-weight: 400;
}

.accordion-button:not(.collapsed) {
    background-color: #eee;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.left-to-right-link {
    font-weight: 500;
    display: inline-block;
    color: #1a1a1a;
    text-decoration: none;
}

.left-to-right-link:hover {
    color: #1a1a1a;
}

.left-to-right-link::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #1a1a1a;
    transition: width .3s;
}

.left-to-right-link:hover::after {
    width: 100%;
    transition: width .3s;
}

.action-link {
    color: #727cf5;
    text-decoration: none;
}

.action-link:hover {
    color: #6169d0;
}

.alert-danger {
    color: #fff;
    font-weight: 500;
    border-radius: 0;
    border: 1px solid #f57277;
    background-color: #f57277;
}

.alert-warning {
    color: #fff;
    font-weight: 500;
    border-radius: 0;
    border: 1px solid #ff8c00;
    background-color: #ff8c00;
}

.dark-red {
    background-color: #d43a3f;
    border-color: #d43a3f;
}

.alert-success {
    color: #fff;
    font-weight: 500;
    border-radius: 0;
    border: 1px solid #3EB489;
    background-color: #3EB489;
}

.orders-itemImageName {
    font-weight: 300;
    font-size: 12px;
}

.order-dropdown .btn-dropdown {
    color: #6c757d;
    font-size: 16px;
    font-weight: 900;
    border-color: #fff;
    background-color: #fff !important;
    box-shadow: none;
    transition: .2s ease-out;
}

.order-dropdown .btn-dropdown:hover {
    background-color: #e7e7e7 !important;
}

.order-lab-link {
    color: #000;
}

.order-lab-link:hover {
    color: #1a1a1a;
}

.bg-primary {
    color: #fff !important;
    background-color: #727cf5 !important;
}

.address-badge {
    cursor: pointer;
    user-select: none;
}

.li-normal button:active {
    color: #fff;
    background-color: #727cf5 !important;
}

.li-normal a:focus {
    color: #fff;
    background-color: #727cf5;
}

.li-delete {
    color: #fff;
    background-color: #d64541;
}

.li-delete:hover button {
    background-color: #c93833 !important;
}

.dz-error-message {
    font-size: 12px;
    font-weight: 500;
    color: #c93833;
}

.li-delete-new .item-delete {
    color: #d64541 !important;
}

.li-delete-new button:active,
.li-delete-new button:active .item-delete {
    color: #fff !important;
    background-color: #d64541 !important;
}

.view-link {
    color: black;
    text-decoration: none;
    border-bottom: 1px solid #000;
}

.view-link:hover {
    color: black;
}

.viewCustomer-galleryName {
    font-size: 16px;
    font-weight: 500;
}

.viewCustomer-galleryDescription {
    font-weight: 300;
}

.customer-row,
.staff-row {
    transition: .1s ease-out;
}

.customer-row:hover,
.staff-row:hover {
    background-color: #eee;
}

.viewCustomer-galleryInfo {
    font-weight: 300;
}

.btn-view {
    color: #6c757d;
    font-size: 16px;
    font-weight: 900;
    border-color: #fff;
    background-color: #fff !important;
    box-shadow: none;
    transition: .2s ease-out;
    box-shadow: none !important;
}

.btn-view:hover {
    background-color: #e7e7e7 !important;
    border-color: #fff;
}

.btn-view:focus {
    border: 1px solid #ddd;
}

.watermark-posbox {
    color: #fff;
    background-color: #363945;
    border: 1px solid #2a2d36;
    border-radius: 5px;
}

.form-check-input:checked {
    background-color: #727cf5;
    border-color: #727cf5;
    box-shadow: none;
}

.form-check-label-watermark {
    font-weight: 500;
}

.watermark-preview-title {
    font-weight: 500;
}

.info-text {
    color: #2f5fb4;
    font-size: 14px;
    letter-spacing: .5px;
    align-self: center;
    line-height: 18px;
}

.additional-box {
    font-weight: 400;
    font-size: 14px;
    padding: .5rem 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    color: #084298;
    background-color: #cfe2ff;
}

.additional-box .title {
    font-weight: 500;
}

.btn-form-submit {
    width: 100%;
    font-weight: bold;
    line-height: 40px;
    font-size: 14px;
    text-align: center;
    color: #fff;
    background-color: #1a1a1a;
    /* background-color: #1a1a1a; */
    height: 40px;
    transition: all .15s ease;
    /* border: 2px solid #1a1a1a; */
    border: 2px solid #1a1a1a;
    border-radius: 5px;
    transition: all .15s ease;
    text-decoration: none;
}

.btn-form-submit:hover {
    color: #fff;
    background-color: #66676e;
    border-color: #66676e;
    /* background-color: #6f6f6f;
    border-color: #6f6f6f; */
}

.wrapper {
    min-height: calc(100vh - 40px);
}

.footer-links a {
    color: #000;
    font-size: 14px !important;
    text-decoration: none;
}

.footer-links a:hover {
    color: rgba(0, 0, 0, 0.6);
}

.new-account-span {
    font-size: 14px;
    font-weight: 300;
}

.new-account-span a {
    color: #000;
}

.new-account-span a:hover {
    color: rgba(0, 0, 0, 0.7);
}

.content-box {
    display: none;
}

.nav-box {
    background-color: transparent;
}

.nav-box .nav-tabs {
    border-bottom: none;
}

.nav-box .nav-tabs .nav-item {
    border-color: transparent !important;
}

.nav-box .nav-item .nav-link {
    border: none !important;
}

.nav-box .nav-item .nav-link[aria-selected="false"] {
    color: #4d4d4d;
}

.nav-box .nav-item .nav-link.active {
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}

.nav-box .nav-item .nav-link.active:hover,
.nav-box .nav-item .nav-link.active:focus {
    box-shadow: none !important;
}

.warning {
    color: #ff7b00;
}

a#dropdownMenuLink.btn.dropdown-toggle {
    box-shadow: none;
}

a#dropdownMenuLink.btn.dropdown-toggle::after {
    display: none;
}

.viewlink {
    font-weight: 300;
    color: #000;
}

.viewlink:hover {
    color: rgb(110, 110, 110);
}

.form-select-sm {
    cursor: pointer;
    box-shadow: none !important;
}

.form-select-sm:focus,
.form-select-sm:active {
    border-color: #5b63c4 !important;
}

.btn-outline-secondary {
    box-shadow: none !important;
    padding: .25rem .5rem;
    line-height: 1.5;
    font-weight: 400;
    font-size: .875rem;
    text-align: center;
    color: #000;
    background-color: transparent;
    transition: all .15s ease;
    border: 1px solid #ced4da;
    border-radius: .2rem;
    transition: all .15s ease;
    text-decoration: none;
}

.btn-outline-secondary:hover {
    color: #fff;
    background-color: #6169d0;
    border-color: #5b63c4;
}


/* newproduct.php */

.file-input {
    border-radius: 0;
    box-shadow: none !important;
    border: 1px solid #e3e3e3;
}

.file-input:focus {
    box-shadow: none;
    border: 1px solid #e3e3e3;
}

.file-input::placeholder {
    color: #bfbfbf;
}

.new-product-image {
    border: 1px solid #e3e3e3;
    border-radius: 5px;
    padding: 1rem;
    margin-bottom: 1rem;
}

.form-wrap.form-builder .stage-wrap.empty {
    border: 2px dashed #ccc !important;
}

/* choose-customer.php */

.choose-link {
    color: #000;
    text-decoration: none;
}

.choose-link .content-box {
    border: 1px solid transparent;
}

.choose-link:hover {
    color: #000;
}

.choose-link:hover .content-box {
    border: 1px solid #c4c4c4;
}

.choose-customer-description {
    color: rgb(124, 124, 124);
    font-size: 12px;
    line-height: 18px;
}

/* account.php */

.col-divider {
    border-right: 1px solid #ddd;
}

.nav-item-link {
    color: #000;
    text-decoration: none;
}

.nav-item-link:hover {
    color: inherit;
}

.nav-item {
    border-bottom: 1px solid #ddd;
}

.nav-item-active {
    background-color: #ddd;
}

.nav-item:hover {
    background-color: #ddd;
}


/** Dashboard.php **/

.pagination .page-link {
    cursor: pointer;
    color: #727cf5;
}

.pagination .active .page-link {
    background-color: #727cf5;
    border-color: #727cf5;
}


/** orders.php **/

.btn-dropdown {
    box-shadow: none !important;
}

.btn-dropdown:active {
    border: 1px solid #ddd;
}

.dropdown-toggle.show {
    border: 1px solid #ddd;
}


/** account.php */

.accountIndex img {
    display: block;
    max-width: 100%;
}

.accountIndex .preview {
    overflow: hidden;
    width: 160px;
    height: 160px;
    margin: 10px;
    border: 1px solid red;
    border-radius: 50%;
}

.accountIndex .cropper-crop-box,
.accountIndex .cropper-view-box {
    border-radius: 50%;
}

.accountIndex .cropper-view-box {
    box-shadow: 0 0 0 1px #39f;
    outline: 0;
}

.offboarding-confirm {
    font-size: 15px;
}


/** Hamburger */

.hamburger {
    border: none;
    background-color: transparent;
}

.meat {
    width: 35px;
    height: 4px;
    background-color: #6c757d;
    margin: 5.5px 0;
    border-radius: 10px;
}

.offcanvas {
    color: #eee;
    background-color: #0b0f19;
}

.btn-close:focus {
    box-shadow: none;
}

.offcanvas-link {
    color: #eee;
    font-size: 18px;
    text-decoration: none;
    font-weight: 400;
}

.offcanvas-link:hover {
    color: #ddd;
}


/** Modal */

.gallery-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1055;
    overflow-x: hidden;
    overflow-y: hidden;
    outline: 0;
    transition: opacity .15s linear;
    background: rgba(26, 26, 26, .9);
}

.gallery-modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-clip: padding-box;
    outline: 0;
}

.gallery-modal-image {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 80vh;
    pointer-events: auto;
    background-clip: padding-box;
    outline: 0;
}

.gallery-modal-image-holder {
    max-height: calc(100vh - 340px);
    position: relative;
}

.gallery-modal-title {
    color: #ddd;
    font-size: 16px;
}

.gallery-modal-close {
    color: #ddd;
    font-size: 22px;
    cursor: pointer;
    transition: all .1s ease-in-out;
}

.gallery-modal-close:hover {
    color: #fff;
}

.gallery-modal-holder .img-loader .loader {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    perspective: 800px;
}

.gallery-modal-holder .img-loader .inner {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.gallery-modal-holder .img-loader .inner.one {
    left: 0%;
    top: 0%;
    animation: rotate-one 1s linear infinite;
    border-bottom: 3px solid #fff;
}

.gallery-modal-holder .img-loader .inner.two {
    right: 0%;
    top: 0%;
    animation: rotate-two 1s linear infinite;
    border-right: 3px solid #fff;
}

.gallery-modal-holder .img-loader .inner.three {
    right: 0%;
    bottom: 0%;
    animation: rotate-three 1s linear infinite;
    border-top: 3px solid #fff;
}

.card-public-customer {
    background-color: #252a34;
}

.card-public-customer-title {
    font-size: 16px;
    font-weight: 400;
}

/* Partner */
.partner-top-box {
    background: #C04848;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #480048, #C04848);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #480048, #C04848);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border: 1px solid #fff;
    border-radius: 5px;
}

.partner-top-box .title {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
}

/* Transfer */
.transfer-top-box {
    background: #005C97;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #363795, #005C97);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #363795, #005C97);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border: 1px solid #fff;
    border-radius: 5px;
}

.transfer-top-box .title {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
}

.transfer-upload-box {
    background-color: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    transition: all .2s ease;
}

.transfer-upload-box:hover {
    border: 2px solid #727cf5;
    border-radius: 5px;
}

#transfer-file-list .file-item {
    background-color: #f5f5f5;
    border: 1px solid transparent;
    border-radius: 5px;
}

#transfer-file-list .file-item .file-item-name,
.transfer-box .transfer-box-title {
    font-size: 14px;
    font-weight: 500;
}

#transfer-file-list .file-item .file-item-details,
.transfer-box .transfer-box-files {
    font-size: 14px;
    font-weight: 400;
}

#transfer-file-list .file-item .file-item-remove,
.transfer-box .transfer-box-remove {
    cursor: pointer;
    font-size: 28px;
    color: #000;
    margin-top: 1px;
}

#transfer-file-list .file-item .file-item-remove i,
.transfer-box .transfer-box-remove i {
    line-height: 1;
    display: block;
    height: 28px;
}

#transfer-file-list .file-item .file-item-remove:hover,
.transfer-box .transfer-box-remove:hover {
    color: #727cf5;
}

#copy-transfer-link {
    font-size: 16px;
    cursor: pointer;
}

.transfer-box {
    background-color: #f5f5f5;
    border: 1px solid transparent;
    border-radius: 5px;
}

.transfer-box .transfer-box-copy-link-icon {
    cursor: pointer;
    color: #000;
}

.transfer-box-copy-link .transfer-box-copy-link-icon:hover,
.transfer-box-copy-link .transfer-box-copy-link-success-icon {
    color: #727cf5;
}

.transfer-box .password-icon {
    color: red;
}

/* subscriptions */

.payment-method-box,
.payment-runtime-box {
    user-select: none;
    background-color: rgb(245, 245, 245);
    border: 2px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    transition: all .2s ease;
}

.payment-method-box.selected,
.payment-method-box:hover,
.payment-runtime-box.selected,
.payment-runtime-box:hover {
    border: 2px solid #727cf5;
}

.payment-subscription-box {
    position: relative;
    user-select: none;
    background-color: rgb(245, 245, 245);
    border: 2px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    transition: all .2s ease;
}

.payment-subscription-box.selected,
.payment-subscription-box:hover {
    border: 2px solid #727cf5;
}

.subscription-marker {
    position: absolute;
    top: 8px;
    right: 12px;
}

.subscription-price-box {
    background-color: rgb(245, 245, 245);
    padding: 1rem 1.5rem;
    border: 2px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    transition: all .2s ease;
}

.subscription-price-box .form-check-input {
    cursor: pointer;
}

.subscription-price-box:hover,
.subscription-price-box.selected {
    border: 2px solid #727cf5;
}

.subscription-price-box.disabled {
    opacity: 0.5;
}

.subscription-price-box.disabled:hover {
    cursor: default;
    border: 2px solid transparent;
}

.subscription-price-box .title {
    font-size: 16px;
    font-weight: 500;
}

.subscription-price-box .price {
    font-size: 15px;
    font-weight: 400;
}

/** branding */

.btn-delete {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    border-radius: 0.25rem;
}

.btn-delete:hover {
    color: #fff;
    background-color: #bb2d3b;
    border-color: #b02a37;
}

.branding-subtitle {
    font-weight: 400;
    font-size: 16px;
}


/** photolab */

.photolab-table-title {
    font-size: 16px;
    font-weight: 400;
}

.photolab-orders-title {
    font-size: 22px;
    font-weight: 400;
}


/** new orders **/

.order-row {
    display: none;
}

.order-row-expanded {
    display: block;
}

h2.order-title {
    font-weight: 400;
    font-size: 18px !important;
    user-select: none;
}

h3.order-title {
    font-weight: 400;
    font-size: 16px !important;
}

.order-items-headline {
    font-weight: 300;
}

.order-customer-link {
    color: #000;
}

.order-customer-link:hover {
    color: #575757;
}

.photolab-delivery-box {
    max-height: 0;
    transition: max-height 0.1s ease-out;
    overflow: hidden;
}

.photolab-delivery-box-expanded {
    max-height: 300px;
    transition: max-height 0.2s ease-in;
}


/** kindergarten */

.lc-new-customer-box {
    cursor: pointer;
    user-select: none;
}

.lc-new-customer-box:hover {
    background-color: #ddd;
}

.lc-new-customer-box .badge-title {
    font-size: 13px;
    font-weight: 500;
    background-color: #727cf5;
}

.large-customer thead {
    font-size: 14px;
}

.large-customer tbody {
    font-size: 15px;
}

.progress-bar {
    background-color: #727cf5;
}

.kindergarten-image-tab {
    background-color: #eee;
}

.kindergarten-image-tab.white {
    background-color: #fff;
}

.kindergarten-image {
    cursor: pointer;
    border-radius: 5px;
    vertical-align: middle;
}

.kindergarten-image-size {
    font-size: 12px;
    font-weight: 300;
}

.kindergarten-image-title {
    font-size: 11px;
    font-weight: 300;
    word-wrap: break-word;
    line-height: 14px;
    margin-bottom: 0;
}

.kindergarten-image-link {
    cursor: pointer;
    font-size: 12px;
    color: #1a1a1a;
}

.kindergarten-image-link:hover {
    text-decoration: underline;
}

.progress-description {
    font-size: 12px;
    font-weight: 500;
}

.package-item-holder {
    max-height: 0;
    transition: max-height 0.25s cubic-bezier(0, 1, 0, 1);
    overflow: hidden;
}

.package-item-holder.active {
    max-height: 800px;
    transition: max-height 0.25s ease-in-out;
}

.package-calc-total-price {
    cursor: pointer;
    color: #2f5fb4;
    font-size: 14px;
}

.package-calc-total-price:hover {
    text-decoration: underline;
}

.delete-all-images {
    cursor: pointer;
    color: #d64541;
    font-size: 14px;
}

.delete-all-images:hover {
    color: #c93833;
    text-decoration: underline;
}

.manual-image-upload {
    cursor: pointer;
    font-size: 14px;
}

.manual-image-upload:hover {
    text-decoration: underline;
}

.image-switch .nav-fill>.nav-link.active {
    color: #000;
    font-weight: 500;
    background-color: #fff;
    border-bottom: 3px solid #8891f6;
}

.image-switch .nav-fill>.nav-link {
    user-select: none;
    cursor: pointer;
    color: #1a1a1a;
    font-weight: 300;
    border-bottom: 3px solid #f3f3f3;
}

.danger-text {
    color: #d64541;
    font-size: 14px;
    letter-spacing: .5px;
    align-self: center;
    line-height: 18px;
}

.pulsating-circle {
    border-radius: 50%;
    height: 12px;
    width: 12px;
    transform: scale(1);
    display: inline-block;
    margin-bottom: 1px;
    margin-right: 10px;
}

.pulsating-circle.success {
    background: #69c669;
    box-shadow: 0 0 0 0 rgba(105, 198, 105, 1);
    animation: pulse 2s infinite;
}

.pulsating-circle.warning {
    background: #f5d76e;
    box-shadow: 0 0 0 0 rgba(245, 215, 110, 1);
    animation: pulse-warning 2s infinite;
}

.pulsating-circle.danger {
    background: #dc3545;
    box-shadow: 0 0 0 0 rgba(220, 53, 69, 1);
    animation: pulse-warning 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(105, 198, 105, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}

@keyframes pulse-warning {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(245, 215, 110, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}

.large-customer .imagetab-trigger {
    user-select: none;
    cursor: pointer;
}

.large-customer .imagetab {
    max-height: 0;
    transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
    overflow: hidden;
}

.large-customer .imagetab.active {
    max-height: 5000px;
    transition: max-height 0.25s ease-in-out;
}

.large-customer .caret-svg {
    transition: transform 0.25s ease-out;
}

.large-customer .caret-svg.active {
    transform: rotate(90deg);
}

.large-customer img:not(:not([src])) {
    visibility: visible !important;
}

.large-customer .wave {
    animation: wave 1s infinite linear forwards;
    -webkit-animation: wave 1s infinite linear forwards;
    background: #f6f7f8;
    background: linear-gradient(to right, #dddddd 8%, #cccccc 18%, #dddddd 33%);
    background-size: 800px 104px;
    border-radius: 5px;
}

@keyframes wave {
    0% {
        background-position: -468px 0
    }

    100% {
        background-position: 468px 0
    }
}

@-webkit-keyframes wave {
    0% {
        background-position: -468px 0
    }

    100% {
        background-position: 468px 0
    }
}


/** invoices */

.invoice-link {
    color: inherit;
    text-decoration: none;
}

.invoice-link:hover {
    color: inherit;
}

.invoice-link.active .invoice-row {
    background-color: #eee;
}

.invoice-row {
    cursor: pointer;
    transition: all .1s ease;
}

.invoice-row:hover,
.invoice-link.active .invoice-row:hover {
    background-color: #ddd;
}

.invoice-row .invoice-title {
    font-size: 14px;
    color: #000;
}


/** communication */

.collapse-vars-link {
    color: #1a1a1a;
    user-select: none;
}

.collapse-vars-link:hover {
    color: #575757
}

.communication-key {
    font-size: 12px;
}

.communication-key .key {
    font-weight: 500;
}

.communication-key .value {
    font-weight: 300;
    border-color: transparent;
}

.communication-key .value:focus,
.communication-key .value:focus-visible {
    border-color: transparent;
}


/** account overview */

.account-overview-link {
    color: inherit;
    text-decoration: none;
    font-weight: 300;
}

.account-overview-link:hover {
    color: #575757;
}

.delete-image-link {
    cursor: pointer;
    user-select: none;
    color: #dc3545;
}

.delete-image-link:hover {
    text-decoration: underline;
    color: #bb2d3b;
}

.submit-avatar-select {
    cursor: pointer;
    user-select: none;
}

.submit-avatar-select:hover {
    color: #575757;
    text-decoration: underline;
}


/* coupon */

.coupon-value {
    font-weight: 700;
    font-size: 22px;
}

/* Search */
.search-input {
    width: 100%;
    font-size: 16px;
    height: 46px;
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #eee;
    background-color: #eee;
    border-radius: 5px;
    box-shadow: none !important;
}

.search-input:focus {
    border: 1px solid #ddd;
    background-color: #eee;
}

/* loader */

.page-loader {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.85;
    background-color: #000;
    z-index: 1021;
}

.page-loader .loader {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    perspective: 800px;
}

.page-loader .inner {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.page-loader .inner.one {
    left: 0%;
    top: 0%;
    animation: rotate-one 1s linear infinite;
    border-bottom: 3px solid #EFEFFA;
}

.page-loader .inner.two {
    right: 0%;
    top: 0%;
    animation: rotate-two 1s linear infinite;
    border-right: 3px solid #EFEFFA;
}

.page-loader .inner.three {
    right: 0%;
    bottom: 0%;
    animation: rotate-three 1s linear infinite;
    border-top: 3px solid #EFEFFA;
}

.page-loader .subtext {
    color: #fff;
}

.page-loader-dots::before {
    animation: dots 2s linear infinite;
    content: ''
}

@keyframes dots {

    0%,
    20% {
        content: '.'
    }

    40% {
        content: '..'
    }

    60% {
        content: '...'
    }

    90%,
    100% {
        content: ''
    }
}

@keyframes rotate-one {
    0% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@keyframes rotate-two {
    0% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@keyframes rotate-three {
    0% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

.nav-item {
    user-select: none;
}

/** Userbox */
.userbox .btn-dropdown {
    padding: .5rem 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    border: 1px solid transparent !important;
    border-radius: 0.375rem;
}

.userbox .btn-dropdown::after {
    display: none;
}

.userbox .dropdown-menu {
    padding-top: 2px;
    padding-bottom: 2px;
}

.userbox .dropdown-item {
    font-size: 0.875rem;
    line-height: 1.15rem;
    padding: .5rem 1rem;
}

.userbox .dropdown-item:active {
    color: #1e2125;
    background-color: #fff;
}

.userbox .dropdown-divider {
    margin-top: 0px;
    margin-bottom: 0px;
}

.partner-box {
    background-color: #e9ecef;
    padding: 1rem;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.partner-box .stat-title {
    color: #6B7280;
    font-size: 16px;
    font-weight: 400;
}

.partner-box .stat-value {
    color: #000;
    font-size: 22px;
    font-weight: 500;
}

/* Success animation */
.success-headline-row svg {
    width: 100px;
    display: block;
    margin: 40px auto 0;
}

.success-headline-row .path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 0;

    &.circle {
        -webkit-animation: dash .9s ease-in-out;
        animation: dash .9s ease-in-out;
    }

    &.line {
        stroke-dashoffset: 1000;
        -webkit-animation: dash .9s .35s ease-in-out forwards;
        animation: dash .9s .35s ease-in-out forwards;
    }

    &.check {
        stroke-dashoffset: -100;
        -webkit-animation: dash-check .9s .35s ease-in-out forwards;
        animation: dash-check .9s .35s ease-in-out forwards;
    }
}

.success-headline-row p {
    text-align: center;
    margin: 20px 0 20px;
    font-size: 1.25em;

    &.success {
        color: #73AF55;
    }

    &.error {
        color: #D06079;
    }
}


@-webkit-keyframes dash {
    0% {
        stroke-dashoffset: 1000;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes dash {
    0% {
        stroke-dashoffset: 1000;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes dash-check {
    0% {
        stroke-dashoffset: -100;
    }

    100% {
        stroke-dashoffset: 900;
    }
}

@keyframes dash-check {
    0% {
        stroke-dashoffset: -100;
    }

    100% {
        stroke-dashoffset: 900;
    }
}

/* Search */
.search-result-link {
    text-decoration: none;
}

.search-result-box {
    color: #000;
    background-color: #fff;
    transition: all .1s ease-in-out;
}

.search-result-box:hover {
    color: #303030;
    border-left: 4px solid #727cf5;
}

/* Sidenav */
.increase-limit-link {
    color: #fff;
    font-weight: 500;
}

.increase-limit-link:hover {
    color: #eee;
}

/* Paywall */
.paywall-h1 {
    font-size: 1.75rem !important;
}

.paywall-h2 {
    font-size: 1.15rem !important;
}

/* watermark */
.watermark-box {
    background-color: #f3f3f3;
}

.watermark-box .modern-table:hover {
    background-color: #f3f3f3 !important;
}

/* auth */
.auth-body {
    color: #fff;
    background: #0b0f19;
    font-size: 14px;
    font-weight: 300;
}

.auth-wrapper {
    min-height: calc(100vh - 100px - 3rem);
}

.auth-box {
    margin-top: 4rem;
}

.auth-box a {
    color: #fff !important;
    text-decoration: none;
    display: inline-block;
}

.auth-box a:hover {
    color: #eee;
}

.auth-box a::after {
    content: '';
    display: block;
    width: 0;
    height: 1px;
    background: #eee;
    transition: width .3s;
}

.auth-box a:hover::after {
    width: 100%;
    transition: width .3s;
}

.auth-box .followup-link {
    font-weight: 400;
    color: #727cf5 !important;
}

.auth-box .followup-link::after {
    background: #727cf5;
    height: 1.5px;
}

.auth-box .do-nothing-link::after {
    content: none;
}

.auth-input {
    color: #fff;
    background-color: #252a34;
    border: 1px solid #181920 !important;
    border-radius: 0.25rem !important;
    user-select: none;
}

.auth-input:focus {
    color: #fff;
    background-color: #252a34;
    box-shadow: none;
}

.auth-input-error {
    border: 1px solid red !important;
}

.auth-input-hidden {
    border-right: 1px solid #252a34 !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.auth-body a {
    color: #fff;
    text-decoration: none;
}

.auth-body a:hover {
    color: #ddd;
}

.auth-body .form-floating {
    background-color: #181920;
}

.auth-body .form-floating label {
    color: #ddd;
    line-height: 25px;
}

.auth-body .form-floating>.form-control:focus~label,
.auth-body .form-floating>.form-control:not(:placeholder-shown)~label,
.auth-body .form-floating>.form-select~label {
    transform: scale(.85) translateY(-0.7rem) translateX(0.15rem) !important;
}

.auth-body h1 {
    font-size: 28px;
}

.hidden-box {
    height: 100%;
    background-color: #252a34;
    border: 1px solid #181920 !important;
    border-left: 1px solid #252a34 !important;
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
}

.hidden-box-error {
    height: 100%;
    background-color: #252a34;
    border: 1px solid red !important;
    border-left: 1px solid #252a34 !important;
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
}

.hidden-trigger {
    cursor: pointer;
    margin-top: 15px;
}

.login-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.login-logo {
    height: 80px;
}

.login-header .link-block {
    user-select: none;
    border: 1px solid transparent;
}

.login-header .link-block:hover {
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 1);
}

.login-header .link-block.active {
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 1);
}

.register-select {
    width: 100%;
    color: #fff;
    background-color: #252a34;
    border: 1px solid #181920 !important;
    border-radius: 0.25rem !important;
    font-size: 14px;
    font-weight: 300;
    padding-top: 18.5px;
    padding-bottom: 18.5px;
    padding-left: 12px;
    border-right: 12px solid transparent !important;
    transition: all 0.2s ease-out;
}

.gallery-auth-wrapper {
    min-height: calc(100vh - 80px);
}

.auth-body .welcome-text p {
    margin-bottom: 0rem;
}

.auth-body .modal-content {
    background-color: #181920;
}

/* email settings */
.auth-body .logout {
    color: #000;
}

.auth-body .logout:hover {
    color: rgb(128, 128, 128);
}

.auth-body .fullsize-inner-padding {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
}

@media (max-width: 991.98px) {
    .auth-body .fullsize-inner-padding {
        margin-right: 0rem !important;
        margin-left: 0rem !important;
    }
}

/* email settings */

.auth-body .accordion-item {
    background-color: #181920;
}

.auth-body .accordion-button:not(.collapsed) {
    color: #fff !important;
    background-color: #252a34;
}

.auth-body .accordion-button.collapsed {
    color: #ddd !important;
    background-color: #252a34;
}

.auth-body .accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* blanksheets */
.blanksheet-notice-label {
    font-size: 12px;
}

.blanksheet-email-edit {
    cursor: pointer;
}

.blanksheet-email-edit-box {
    display: none;
}

.blanksheet-title-toast {
    display: none;
    color: #fff;
    font-weight: 400;
}

/* auth loader */
.loading .loader {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    perspective: 800px;
}

.loading .inner {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.loading .inner.one {
    left: 0%;
    top: 0%;
    animation: rotate-one 1s linear infinite;
    border-bottom: 3px solid #EFEFFA;
}

.loading .inner.two {
    right: 0%;
    top: 0%;
    animation: rotate-two 1s linear infinite;
    border-right: 3px solid #EFEFFA;
}

.loading .inner.three {
    right: 0%;
    bottom: 0%;
    animation: rotate-three 1s linear infinite;
    border-top: 3px solid #EFEFFA;
}

/* Sortable */
#sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#sortable li {
    margin: 5px 0;
    padding: 10px;
    background-color: #eee;
    border: 1px solid #ced4da;
    cursor: move;
}

/* Administration */
.table-administration thead th,
.table-administration tbody td {
    font-size: 14px;
}

.login-as-customer-link {
    color: #6a00fb;
    font-size: 14px;
    text-decoration: none;
}

/* New Design -> old stuff need to be migrated to main bootstrap classes */
.form-floating .form-control {
    width: 100%;
    border-radius: 5px;
    border: 1px solid #e3e3e3;
    transition: all 0.2s ease-out;
}

.form-floating .form-control:active,
.form-floating .form-control:focus {
    border: 2px solid #1a1a1a !important;
}

.form-floating .form-select {
    width: 100%;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #ced4da;
    border-radius: 5px;
    transition: all 0.2s ease-out;
}

.form-floating .form-select:focus {
    box-shadow: none;
    border: 2px solid #1a1a1a !important;
}

.monad-output {
    font-size: 12px;
}

.badge.bg-danger {
    color: #d64541;
    border: 1px solid #d64541 !important;
    border-radius: 1rem;
    background-color: rgba(220, 53, 69, 0.1) !important;
}

.badge.bg-primary {
    color: #727cf5 !important;
    border: 1px solid #727cf5 !important;
    border-radius: 1rem;
    background-color: rgba(114, 123, 245, 0.1) !important;
}

.logging-box {
    border-left: 3px solid #727cf5;
    background-color: #fff;
    padding: .75rem 1rem;
    border-radius: 0.25rem;
}

.logging-box a {
    color: #000;
    text-decoration: none;
}

.dashboard-box {
    border-left: 3px solid #727cf5;
    background-color: #fff;
    padding: .75rem 1rem;
    border-radius: 0.25rem;
}

.dashboard-box .stat-title {
    color: #6B7280;
    font-size: 14px;
    font-weight: 400;
}

.dashboard-box .stat-value {
    color: #000;
    font-size: 18px;
    font-weight: 500;
}