:root {
    --ws-primary: #0f766e;
    --ws-danger: #b42318;
}

.webchat-page {
    min-height: calc(100vh - 118px);
    background: #fff;
    border-top: 1px solid #eef0f6;
}

.webchat-page .chat-leftsidebar {
    min-width: 300px;
    max-width: 300px;
    background: #fff;
    border-right: 3px solid #f0f1f7;
}

.webchat-page .chat-leftsidebar h5 {
    color: #1f2937;
    font-size: 16px;
    font-weight: 500;
}

.webchat-page .chat-leftsidebar .btn-soft-success {
    background: #d8f6f1;
    border-color: #d8f6f1;
    color: #00a88f;
    box-shadow: none;
}

.webchat-page .chat-leftsidebar .search-box {
    margin-top: 12px;
}

.webchat-page .chat-leftsidebar .search-box .form-control {
    height: 38px;
    background: #f3f6fb !important;
    border-color: #f3f6fb !important;
    color: #4b5563;
}

.webchat-page .nav-tabs-custom {
    border-bottom: 1px solid #f0f1f7;
}

.webchat-page .nav-tabs-custom .nav-link {
    color: #111827;
    font-weight: 500;
    padding: .9rem 1rem .8rem;
}

.webchat-page .nav-tabs-custom .nav-link.active {
    color: #00a88f;
    border-bottom-color: #00a88f;
}

.webchat-page .chat-room-list {
    height: calc(100vh - 302px);
}

.webchat-page .chat-message-list .chat-list li a,
.webchat-page .chat-message-list .chat-user-list li a {
    color: #111827;
    padding: 10px 21px;
}

.webchat-page .chat-message-list .chat-user-list li.active > a,
.webchat-page .chat-message-list .chat-user-list li > a:hover {
    background: #d4f3ee;
    color: #00a88f;
}

.webchat-page .chat-message-list .chat-user-list li.active .avatar-title {
    background: #fff !important;
    color: #00a88f !important;
}

.webchat-page .user-chat,
.webchat-page .user-chat-topbar,
.webchat-page .chat-input-section {
    background: #fff;
}

.webchat-page .user-chat-topbar {
    min-height: 76px;
    border-bottom: 1px solid #eef0f6;
    display: flex;
    align-items: center;
}

.webchat-page .user-chat-topbar > .row {
    width: 100%;
}

.webchat-page .user-chat-topbar .avatar-title {
    background: #405189 !important;
    color: #fff !important;
}

.webchat-page .user-chat-topbar h5 {
    color: #27314a;
    font-size: 18px !important;
    font-weight: 500;
}

.webchat-page .user-chat-topbar .user-chat-nav .btn {
    color: #2563eb;
}

.webchat-page .chat-conversation {
    height: calc(100vh - 274px);
    background-color: #f5f5fb;
    background-image: url("../velzon/images/chat-bg-pattern.png");
    background-position: center;
    background-repeat: repeat;
    border-bottom: 1px solid #eef0f6;
}

.webchat-page .chat-conversation .conversation-list .ctext-wrap-content {
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 4px 12px rgba(30, 32, 37, .08);
    color: #111827;
    padding: 12px 20px;
}

.webchat-page .chat-conversation .ctext-content {
    white-space: pre-line;
}

.webchat-page .chat-conversation .conversation-list .ctext-wrap-content::before {
    display: none;
}

.webchat-page .chat-conversation .right .conversation-list .ctext-wrap .ctext-wrap-content {
    background: #c9eeea;
    box-shadow: none;
    color: #00a88f;
}

.webchat-page .chat-conversation .conversation-list .conversation-name {
    color: #6b7280;
    font-size: 12px;
}

.webchat-page .chat-conversation .chat-avatar .avatar-title {
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(30, 32, 37, .08);
}

.webchat-page .chat-input-section {
    min-height: 76px;
    border-top: 0;
}

.webchat-page .chat-input-section .chat-input {
    min-height: 40px;
    max-height: 112px;
    background: #f3f6fb !important;
    border-color: #f3f6fb !important;
    resize: none;
    overflow-y: auto;
}

.webchat-page .chat-input-section .btn-link {
    color: #6b7280;
    font-size: 18px;
}

.webchat-page .chat-input-section .chat-send {
    width: 40px;
    height: 40px;
    padding: 0;
    border-color: #10b7a4;
    background: #10b7a4;
}

.webchat-page .chat-avatar .avatar-title {
    width: 32px;
    height: 32px;
}

.webchat-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .45rem;
}

.webchat-attachment {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    max-width: 220px;
    padding: .25rem .45rem;
    border: 1px solid var(--vz-border-color);
    border-radius: 4px;
    background: #fff;
    color: #405189;
    font-size: .78rem;
    text-decoration: none;
}

.webchat-attachment span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.webchat-attachment-image {
    display: block;
    width: 96px;
    height: 96px;
    max-width: 96px;
    flex: 0 0 96px;
    padding: 0;
    overflow: hidden;
    border-radius: 7px;
    background: #f8fafc;
}

.webchat-attachment-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.webchat-attachment-audio {
    width: min(260px, 100%);
}

.webchat-attachment-audio audio {
    display: block;
    width: 100%;
    height: 34px;
}

.webchat-audio-recording {
    animation: webchat-recording-pulse 1s ease-in-out infinite;
}

@keyframes webchat-recording-pulse {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.08);
        opacity: .72;
    }
}

.webchat-selected-files {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .35rem;
}

.webchat-selected-files span {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    max-width: 180px;
    padding: .12rem .35rem;
    border-radius: 999px;
    background: #eef2f7;
    color: #475467;
    font-size: .72rem;
}

.webchat-page .ctext-wrap {
    align-items: flex-start;
    gap: .25rem;
}

.webchat-page .chat-list.right .ctext-wrap {
    justify-content: flex-end;
}

.webchat-message-menu {
    opacity: 0;
    transition: opacity .15s ease;
}

.webchat-page .chat-list:hover .webchat-message-menu,
.webchat-message-menu .dropdown-menu.show {
    opacity: 1;
}

.webchat-message-menu-toggle {
    width: 28px;
    height: 28px;
    min-width: 28px;
    color: #6b7280;
}

.webchat-reply-preview,
.webchat-reply-compose {
    border-left: 3px solid #405189;
    border-radius: 4px;
    background: rgba(64, 81, 137, .08);
}

.webchat-reply-preview {
    display: grid;
    gap: .1rem;
    width: 100%;
    margin-bottom: .45rem;
    padding: .4rem .55rem;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    font-size: .78rem;
    text-align: left;
    cursor: pointer;
}

.webchat-reply-preview:hover {
    background: rgba(64, 81, 137, .13);
}

.webchat-reply-preview span {
    color: #64748b;
}

.webchat-message-focus .ctext-wrap-content {
    animation: webchat-message-focus 1.8s ease;
}

@keyframes webchat-message-focus {
    0% {
        box-shadow: 0 0 0 0 rgba(64, 81, 137, .42);
    }

    35% {
        box-shadow: 0 0 0 5px rgba(64, 81, 137, .16);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(64, 81, 137, 0);
    }
}

.webchat-reply-compose {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .6rem;
    padding: .45rem .6rem;
}

.webchat-reply-compose > div {
    display: grid;
    min-width: 0;
}

.webchat-reply-compose span {
    overflow: hidden;
    color: #64748b;
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.webchat-forwarded-label {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-bottom: .25rem;
    color: #64748b;
    font-size: .72rem;
}

.webchat-confirm-modal {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
}

.webchat-confirm-icon {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 50%;
    background: rgba(240, 101, 72, .12);
    color: #f06548;
    font-size: 28px;
}

.webchat-notification-remove {
    position: relative;
    z-index: 5;
    width: 32px;
    height: 32px;
    min-width: 32px;
    font-size: 18px;
    line-height: 1;
}

@media (max-width: 991.98px) {
    .webchat-page {
        flex-direction: column;
    }

    .webchat-page .chat-leftsidebar {
        min-width: 100%;
        max-width: 100%;
    }

    .webchat-page .chat-room-list,
    .webchat-page .chat-conversation {
        height: auto;
        min-height: 300px;
    }
}

.logistics-provider-card {
    border: 1px solid #e5e7eb;
}

.logistics-default-box {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.55rem;
    border: 1px solid #f5c56b;
    border-radius: 6px;
    background: #fff7e6;
    color: #8a4b00;
}

#settings-logistics .form-check:not(.form-switch) .form-check-input,
#settings-logistics .logistics-default-box .form-check-input {
    width: 1em;
    height: 1em;
    min-height: 0;
    padding: 0;
    margin-top: 0.25em;
}

#settings-logistics .form-switch {
    min-height: 0;
    padding-left: 2.1em;
}

#settings-logistics .form-switch .form-check-input {
    width: 1.75em;
    height: 0.95em;
    min-height: 0;
    padding: 0;
    margin-top: 0.18em;
    margin-left: -2.1em;
}

#settings-logistics .logistics-default-box .form-check-label {
    font-size: 0.8125rem;
    line-height: 1.2;
}

.packaging-group-quantity-fieldset {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    min-height: 38px;
    margin: 0;
    padding: 6px 8px;
    border: 1px solid var(--vz-border-color);
    border-radius: 4px;
}

.packaging-group-quantity-fieldset legend {
    float: none;
    width: auto;
    margin: 0 0 0 -2px;
    padding: 0 4px;
    font-size: 11px;
    font-weight: 600;
    color: var(--vz-secondary-color);
}

.packaging-group-quantity-fieldset .form-control {
    min-height: 30px;
    height: 30px;
    padding: 4px 8px;
}

.packaging-groups-table,
.product-packaging-table {
    font-size: 12px;
}

.product-packaging-frame {
    grid-column: 1 / -1;
    margin-top: 4px;
    padding-top: 6px;
    border-top: 1px solid var(--vz-border-color);
}

.product-packaging-picker {
    display: flex;
    align-items: end;
    gap: 8px;
}

.product-packaging-picker .btn {
    min-height: 36px;
}

.quote-freight-calculator,
.quote-freight-details {
    cursor: pointer;
    color: #299cdb;
    vertical-align: middle;
}

.quote-freight-details {
    color: #0ab39c;
}

.quote-shipping-modal-dialog {
    width: min(1100px, calc(100vw - 32px));
    max-width: 1100px;
}

.quote-shipping-modal-body {
    padding: 18px 20px 20px;
}

.quote-shipping-table-wrap {
    overflow: visible;
}

#quoteShippingQuotesModal .table {
    min-width: 820px;
}

#quoteShippingQuotesModal .modal-content {
    max-height: calc(100vh - 56px);
}

@media (max-width: 900px) {
    .quote-shipping-table-wrap {
        overflow-x: auto;
    }

    #quoteShippingQuotesModal .table {
        min-width: 760px;
    }
}

.quote-freight-loading {
    animation: ws-spin 0.75s linear infinite;
}

@keyframes ws-spin {
    to {
        transform: rotate(360deg);
    }
}

.quote-action-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
}

.mobile-unified-action-menu {
    display: none !important;
}

.purchase-mobile-status-top {
    display: none !important;
}

.product-mobile-action-menu {
    display: none !important;
}

@media (max-width: 767.98px) {
    .quote-action-nav {
        flex-wrap: nowrap;
        width: 100%;
    }

    .quote-action-nav > .dropdown.d-inline-block:not(.mobile-unified-action-menu) {
        display: none !important;
    }

    .quote-action-nav > .mobile-unified-action-menu {
        display: inline-block !important;
        flex: 0 0 auto;
    }

    .quote-action-nav > .purchase-mobile-status-top {
        display: inline-flex !important;
        flex: 1 1 auto;
        align-items: center;
        justify-content: flex-start;
        min-width: 0;
        margin-left: 0;
    }

    .quote-action-nav > .purchase-mobile-status-top .purchase-status-badge {
        max-width: 100%;
        margin: 0 0 0 .35rem;
        padding: 7px 10px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .quote-action-nav > .purchase-desktop-status-top,
    #purchase-back-button {
        display: none !important;
    }

    .mobile-unified-action-menu .dropdown-menu {
        max-height: min(78vh, 520px);
        overflow-y: auto;
    }

    .product-mobile-action-menu {
        display: inline-block !important;
    }

    .product-desktop-price-action {
        display: none !important;
    }
}

.sale-status-top {
    display: inline-flex;
    align-items: center;
    margin-left: .35rem;
}

.sale-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .7rem;
    min-height: 38px;
    padding: .48rem 1.15rem;
    border: 0;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
}

.sale-status-badge-conversion {
    background: #f97316;
    color: #fff;
}

.sale-status-badge-editable i {
    font-size: 1.18rem;
    line-height: 1;
}

.sale-status-badge-editable:hover {
    filter: brightness(.97);
}

.quote-linked-document-label {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-left: .25rem;
    padding: .1rem .42rem;
    border: 1px solid #d7dde6;
    border-radius: 999px;
    background: #f8f9fb;
    color: #64748b;
    font-size: .72rem;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

.quote-linked-document-label i {
    font-size: .82rem;
}

.quote-linked-document-label:hover {
    border-color: #b9c2d0;
    background: #eef2f7;
    color: #405189;
}

.quote-linked-document-label-converted {
    border-color: #ea580c;
    background: #f97316;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(249, 115, 22, .22);
}

.quote-linked-document-label-converted:hover {
    border-color: #c2410c;
    background: #ea580c;
    color: #fff;
}

.sale-status-options {
    display: grid;
    gap: .55rem;
}

.sale-status-option {
    display: flex;
    align-items: center;
    gap: .7rem;
    width: 100%;
    padding: .65rem .8rem;
    border: 1px solid #e9ebec;
    border-radius: 6px;
    background: #fff;
    color: #000;
    text-align: left;
}

.sale-status-option span:not(.sale-status-option-swatch),
.sale-status-option i {
    color: #000;
}

.sale-status-option:hover,
.sale-status-option.active {
    border-color: #cfd6dd;
    background: #eef1f4;
}

.sale-status-option .ri-check-line {
    margin-left: auto;
    opacity: 0;
}

.sale-status-option.active .ri-check-line {
    opacity: 1;
}

.sale-status-option-swatch {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08);
}

.sale-list-status-badge {
    color: #fff;
}

.sale-list-status-review {
    animation: sale-review-pulse 1.15s ease-in-out infinite;
    box-shadow: 0 0 0 rgba(249, 115, 22, .45);
}

@keyframes sale-review-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(249, 115, 22, .45);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(249, 115, 22, 0);
        transform: scale(1.04);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(249, 115, 22, 0);
        transform: scale(1);
    }
}

@media (max-width: 575.98px) {
    .sale-status-top,
    .sale-status-badge {
        width: 100%;
    }

    .sale-status-top {
        margin-left: 0;
        margin-top: .25rem;
    }
}

.universal-email-modal {
    border: 0;
    border-radius: 6px;
}

.universal-email-modal .modal-header {
    min-height: 58px;
    padding: 14px 18px;
    border-bottom: 0;
    background: #f3f6f9;
}

.universal-email-modal .modal-title {
    color: #495057;
    font-size: 18px;
    font-weight: 600;
}

.universal-email-modal .modal-body {
    padding: 20px 17px 10px;
}

.universal-email-modal .modal-footer {
    gap: 14px;
    padding: 14px 17px 22px;
    border-top: 0;
}

.universal-email-user {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    color: #878a99;
    font-size: 12px;
}

.universal-email-recipient {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 38px;
    padding: 5px 8px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    background: #fff;
}

.universal-email-recipient-tags {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.universal-email-chip {
    display: inline-flex;
    align-items: center;
    padding: 0 7px;
    border-radius: 4px;
    color: #fff;
    background: #405189;
    white-space: nowrap;
}

.universal-email-chip button {
    width: 18px;
    height: 18px;
    padding: 0;
    margin-left: 6px;
    border: 0;
    color: #fff;
    background: transparent;
    font-size: 16px;
    line-height: 1;
}

#universal-email-to {
    flex: 1;
    min-width: 160px;
    height: 25px;
    border: 0;
    outline: 0;
}

#universal-email-cc-toggle,
#universal-email-bcc-toggle {
    border: 0;
    color: #212529;
    background: transparent;
    font-size: 12px;
    font-weight: 700;
}

.universal-email-recipient-results {
    position: absolute;
    z-index: 1065;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: 220px;
    overflow: auto;
    border: 1px solid #e9ebec;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .12);
}

#universal-email-recipient-results button.universal-email-result-option {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    width: 100%;
    min-height: 48px;
    padding: 8px 12px;
    border: 0;
    border-bottom: 1px solid #f3f6f9;
    color: #212529;
    background: #fff;
    text-align: left !important;
    line-height: 1.25;
}

#universal-email-recipient-results button.universal-email-result-option:hover,
#universal-email-recipient-results button.universal-email-result-option:focus,
#universal-email-recipient-results button.universal-email-result-option.is-active {
    background: #f3f6f9;
    outline: 0;
}

#universal-email-recipient-results button.universal-email-result-option.is-active {
    box-shadow: inset 3px 0 0 #405189;
}

#universal-email-recipient-results button.universal-email-result-option strong {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    color: #212529;
    font-size: 13px;
    font-weight: 600;
    text-align: left !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#universal-email-recipient-results button.universal-email-result-option span {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    color: #878a99;
    font-size: 12px;
    text-align: left !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.universal-email-quill .ql-editor {
    min-height: 245px;
}

.universal-email-quote-pdf {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.65rem;
    padding: 0.4rem 0.55rem;
    border: 1px solid #d5dbe3;
    border-radius: 6px;
    background: #f8fafc;
}

.universal-email-quote-pdf .form-check {
    min-height: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding-left: 0;
    font-size: 0.78rem;
    line-height: 1.2;
}

.universal-email-quote-pdf .form-check-input {
    width: 0.78rem !important;
    height: 0.78rem !important;
    min-width: 0.78rem;
    margin-top: 0;
    margin-left: 0;
    flex: 0 0 0.78rem;
}

.universal-email-quote-pdf-file {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
    color: #374151;
    font-size: 0.84rem;
}

.universal-email-quote-pdf-file i {
    color: #dc2626;
    font-size: 1.15rem;
}

.universal-email-quote-pdf-file span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.email-quill-editor {
    height: auto !important;
}

.email-signature-quill .ql-editor {
    min-height: 96px;
}

.email-template-quill .ql-editor {
    min-height: 58px;
}

.email-quill-editor .ql-toolbar,
.universal-email-quill .ql-toolbar {
    border-color: #e9ebec;
    padding: 3px 5px;
    background: #fff;
}

.email-quill-editor .ql-container,
.universal-email-quill .ql-container {
    border-color: #e9ebec;
    font-size: 13px;
}

.email-quill-editor .ql-toolbar button,
.email-quill-editor .ql-toolbar .ql-picker-label,
.universal-email-quill .ql-toolbar button,
.universal-email-quill .ql-toolbar .ql-picker-label {
    color: #212529 !important;
    background: transparent !important;
}

.email-quill-editor .ql-toolbar button,
.universal-email-quill .ql-toolbar button {
    width: 24px;
    height: 24px;
    padding: 3px;
    border-radius: 3px;
}

.email-quill-editor .ql-toolbar .ql-picker,
.universal-email-quill .ql-toolbar .ql-picker {
    height: 24px;
    color: #212529 !important;
}

.email-quill-editor .ql-toolbar .ql-picker-label,
.universal-email-quill .ql-toolbar .ql-picker-label {
    padding: 2px 20px 2px 6px;
    border: 0;
    border-radius: 3px;
    line-height: 20px;
}

.email-quill-editor .ql-toolbar button:hover,
.email-quill-editor .ql-toolbar button:focus,
.email-quill-editor .ql-toolbar .ql-picker-label:hover,
.email-quill-editor .ql-toolbar .ql-picker-label.ql-active,
.universal-email-quill .ql-toolbar button:hover,
.universal-email-quill .ql-toolbar button:focus,
.universal-email-quill .ql-toolbar .ql-picker-label:hover,
.universal-email-quill .ql-toolbar .ql-picker-label.ql-active {
    color: #2b8ca3;
    background: #eef6f8 !important;
}

.email-quill-editor .ql-snow .ql-stroke,
.email-quill-editor .ql-snow .ql-picker-label .ql-stroke,
.email-quill-editor .ql-snow.ql-toolbar button .ql-stroke,
.universal-email-quill .ql-snow .ql-stroke,
.universal-email-quill .ql-snow .ql-picker-label .ql-stroke,
.universal-email-quill .ql-snow.ql-toolbar button .ql-stroke,
.ql-snow .email-quill-editor .ql-stroke,
.ql-snow .universal-email-quill .ql-stroke {
    stroke: currentColor !important;
}

.email-quill-editor .ql-snow .ql-fill,
.email-quill-editor .ql-snow .ql-picker-label .ql-fill,
.email-quill-editor .ql-snow.ql-toolbar button .ql-fill,
.universal-email-quill .ql-snow .ql-fill,
.universal-email-quill .ql-snow .ql-picker-label .ql-fill,
.universal-email-quill .ql-snow.ql-toolbar button .ql-fill,
.ql-snow .email-quill-editor .ql-fill,
.ql-snow .universal-email-quill .ql-fill {
    fill: currentColor !important;
}

.email-quill-editor .ql-snow .ql-transparent,
.universal-email-quill .ql-snow .ql-transparent {
    opacity: .45;
}

.email-quill-editor .ql-toolbar .ql-picker-options,
.universal-email-quill .ql-toolbar .ql-picker-options {
    border-color: #e9ebec;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .12);
}

.email-quill-editor .ql-toolbar .ql-picker-item:hover,
.email-quill-editor .ql-toolbar .ql-picker-item.ql-selected,
.universal-email-quill .ql-toolbar .ql-picker-item:hover,
.universal-email-quill .ql-toolbar .ql-picker-item.ql-selected {
    color: #2b8ca3;
}

.email-quill-editor .ql-html::before,
.universal-email-quill .ql-html::before {
    content: "<>";
    display: block;
    color: currentColor;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.email-quill-source {
    display: none;
    width: 100%;
    min-height: 96px;
    resize: vertical;
    border-color: #e9ebec;
    border-top: 0;
    border-radius: 0 0 4px 4px;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 12px;
}

.email-quill-source-mode .ql-container {
    display: none;
}

.email-quill-source-mode .email-quill-source {
    display: block;
}

.email-quill-host > .ql-toolbar.ql-snow {
    padding: 3px 5px;
    border-color: #e9ebec;
    background: #fff;
}

.email-quill-host > .ql-toolbar.ql-snow button,
.email-quill-host > .ql-toolbar.ql-snow .ql-picker-label {
    color: #212529 !important;
    background: transparent !important;
}

.email-quill-host > .ql-toolbar.ql-snow button {
    width: 24px;
    height: 24px;
    padding: 3px;
    border-radius: 3px;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-picker {
    height: 24px;
    color: #212529 !important;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-picker-label {
    padding: 2px 20px 2px 6px;
    border: 0;
    border-radius: 3px;
    line-height: 20px;
}

.email-quill-host > .ql-toolbar.ql-snow button:hover,
.email-quill-host > .ql-toolbar.ql-snow button:focus,
.email-quill-host > .ql-toolbar.ql-snow button.ql-active,
.email-quill-host > .ql-toolbar.ql-snow .ql-picker-label:hover,
.email-quill-host > .ql-toolbar.ql-snow .ql-picker-label.ql-active {
    color: #2b8ca3 !important;
    background: #eef6f8 !important;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-stroke {
    stroke: currentColor !important;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-fill {
    fill: currentColor !important;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-picker-options {
    border-color: #e9ebec;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .12);
}

.email-quill-host > .ql-toolbar.ql-snow .ql-picker-item:hover,
.email-quill-host > .ql-toolbar.ql-snow .ql-picker-item.ql-selected {
    color: #2b8ca3 !important;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-html::before {
    content: "<>";
    display: block;
    color: currentColor;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button::before,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker::before,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button::after,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker::after {
    display: none !important;
    content: none !important;
}

.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    color: #212529 !important;
}

.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button i,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker i {
    color: currentColor !important;
    font-size: 16px;
    line-height: 1;
}

.email-sale-quill-host > .ql-toolbar.ql-snow button,
.email-sale-quill-host > .ql-toolbar.ql-snow .ql-picker-label,
.email-sale-template-toolbar button,
.email-sale-template-toolbar .ql-picker-label,
.email-sale-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button,
.email-sale-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker,
.email-sale-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button i,
.email-sale-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker i,
.email-sale-template-toolbar .email-quill-icon-button,
.email-sale-template-toolbar .email-quill-icon-picker,
.email-sale-template-toolbar .email-quill-icon-button i,
.email-sale-template-toolbar .email-quill-icon-picker i {
    color: #000 !important;
}

.email-sale-quill-host > .ql-toolbar.ql-snow svg,
.email-sale-template-toolbar svg {
    display: none !important;
}

.email-quill-host > .ql-toolbar.ql-snow .ql-picker-label.email-quill-icon-picker {
    padding: 0 !important;
    width: 24px;
}

.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button:hover,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button:focus,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-button.ql-active,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker:hover,
.email-quill-host > .ql-toolbar.ql-snow .email-quill-icon-picker.ql-active {
    color: #2b8ca3 !important;
    background: #eef6f8 !important;
}

body.auth-page {
    min-height: 100vh;
    background: #eef2f5;
}

#webstamp-preloader {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: grid;
    place-items: center;
    background: rgba(246, 248, 251, 0.72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}

.ws-loading #webstamp-preloader {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.ws-loaded #webstamp-preloader {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.ws-loading #layout-wrapper,
.ws-loading .auth-main,
.ws-loading main {
    filter: blur(4px);
    pointer-events: none;
    user-select: none;
}

.webstamp-loader-box {
    display: grid;
    justify-items: center;
    gap: 12px;
    min-width: 150px;
    padding: 22px 26px;
    border: 1px solid rgba(64, 81, 137, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
    color: var(--vz-primary);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
}

.webstamp-loader-gif {
    width: 42px;
    height: 42px;
    border: 4px solid rgba(64, 81, 137, 0.16);
    border-top-color: var(--vz-primary);
    border-radius: 50%;
    animation: webstamp-loader-spin 0.8s linear infinite;
}

@keyframes webstamp-loader-spin {
    to {
        transform: rotate(360deg);
    }
}

.webstamp-auth-bg {
    background-image: url("../images/auth-one-bg.jpg");
    background-position: center;
    background-size: cover;
}

.auth-remember-check .form-check-input {
    width: 13px;
    height: 13px;
    min-height: 13px;
    margin-top: 0.28em;
    padding: 0;
}

.auth-main {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}

.login-card {
    width: min(100%, 420px);
    display: grid;
    gap: 18px;
    padding: 28px;
    border: 1px solid var(--vz-border-color);
    border-radius: 8px;
    background: var(--vz-card-bg);
    box-shadow: 0 18px 45px rgba(30, 41, 51, 0.12);
}

.header-avatar {
    display: inline-grid;
    place-items: center;
    background: var(--ws-primary);
    color: #fff;
    font-weight: 700;
}

.d-inline-grid {
    display: inline-grid !important;
}

.place-center {
    place-items: center;
}

.header-avatar {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}

img.header-avatar {
    display: inline-block;
    object-fit: cover;
    background: var(--vz-light);
}

#notificationDropdown .dropdown-menu {
    width: 360px;
    min-width: 320px;
    max-width: calc(100vw - 24px);
    overflow: hidden;
    border: 0;
    box-shadow: 0 10px 35px rgba(30, 32, 37, 0.18);
}

#notificationDropdown .dropdown-head {
    background-color: #405189 !important;
    color: #fff;
}

#notificationDropdown .dropdown-head.bg-pattern {
    background-image:
        radial-gradient(circle at 20px 18px, rgba(255, 255, 255, 0.08) 0 2px, transparent 3px),
        radial-gradient(circle at 92% 26px, rgba(255, 255, 255, 0.08) 0 3px, transparent 4px);
    background-size: 86px 70px, 112px 84px;
}

#notificationDropdown .dropdown-head .p-3 {
    padding: 1rem !important;
}

#notificationDropdown .dropdown-tabs.nav-tabs {
    padding: 0;
    border-bottom: 0;
    background: transparent;
    gap: 0;
}

#notificationDropdown .dropdown-tabs .nav-link {
    min-width: 0;
    margin-bottom: 0;
    padding: 0.72rem 1rem;
    border: 0;
    border-radius: 4px 4px 0 0;
    color: rgba(255, 255, 255, 0.62);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

#notificationDropdown .dropdown-tabs .nav-link:hover {
    color: #fff;
}

#notificationDropdown .dropdown-tabs .nav-link.active {
    background-color: #fff;
    color: #405189;
}

#notificationDropdown .tab-content {
    padding: 0;
    background: #fff;
}

#notificationDropdown .tab-pane {
    display: none;
    gap: 0;
    background: #fff;
}

#notificationDropdown .tab-pane.active {
    display: block;
}

#notificationDropdown .webchat-notification-scroll {
    max-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
}

#notificationDropdown .empty-notification-elem {
    display: none !important;
}

#notificationDropdown .webchat-notification-empty {
    display: flex;
    min-height: 138px;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
    color: #495057;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.45;
    text-align: center;
}

#notificationDropdown .webchat-notification-empty span {
    max-width: 260px;
}

#notificationDropdown .notification-item {
    padding: 0.72rem 0.75rem;
    border-radius: 0;
    white-space: normal;
}

#notificationDropdown .notification-item:hover {
    background-color: #f3f6f9;
}

#notificationDropdown .notification-item h6 {
    color: #343a40;
    font-size: 13px;
    line-height: 1.38;
}

#notificationDropdown .notification-item .fs-13 {
    font-size: 13px !important;
    line-height: 1.35;
}

#notificationDropdown .avatar-xs {
    width: 2rem;
    height: 2rem;
}

#notificationDropdown .avatar-title {
    width: 100%;
    height: 100%;
}

#notificationDropdown .notification-check {
    min-height: 0;
    margin: 0;
}

#notificationDropdown .notification-check .form-check-input {
    width: 16px;
    height: 16px;
    min-height: 16px;
    margin: 0;
    padding: 0;
}

#notificationDropdown .notification-actions {
    padding: 0.65rem 1rem;
    border-top: 1px solid var(--vz-border-color);
    background: #fff;
    font-size: 13px;
}

#notificationDropdown .view-all {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
}

#notificationDropdown .view-all .btn {
    padding: 0.45rem 0.75rem;
    font-size: 13px;
}

.webchat-floating-notification {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1085;
    width: 344px;
    max-width: calc(100vw - 24px);
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.24);
}

.webchat-floating-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 14px 12px;
    background: #405189;
    color: #fff;
}

.webchat-floating-head strong,
.webchat-floating-head span {
    display: block;
}

.webchat-floating-head strong {
    font-size: 14px;
    line-height: 1.2;
}

.webchat-floating-head span {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.68);
    font-size: 12px;
}

.webchat-floating-body {
    display: block;
    padding: 22px 18px 18px;
    background:
        linear-gradient(rgba(255, 255, 255, .86), rgba(255, 255, 255, .86)),
        url("../velzon/images/chat-bg-pattern.png");
    background-size: 260px auto;
}

.webchat-floating-body-clickable {
    cursor: pointer;
}

.webchat-floating-body-clickable:hover .webchat-floating-bubble {
    background: #e8edf5;
}

.webchat-floating-message-row {
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.webchat-floating-avatar {
    display: grid;
    width: 28px;
    height: 28px;
    min-width: 28px;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #405189;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(64, 81, 137, .24);
}

.webchat-floating-bubble {
    max-width: 224px;
    padding: 12px 14px;
    border-radius: 4px;
    background: #f1f4f8;
    color: #111827;
    font-size: 13px;
    line-height: 1.45;
}

.webchat-floating-time {
    display: block;
    margin-top: 7px;
    color: #74788d;
    font-size: 12px;
}

.webchat-floating-reply {
    display: flex;
    gap: 8px;
    padding: 14px 18px 16px;
    border-top: 1px dashed #e5e7eb;
    background: #fff;
}

.webchat-floating-reply .form-control {
    height: 38px;
    border-color: transparent;
    background: #f3f6f9;
    font-size: 13px;
}

.webchat-floating-reply .btn-icon {
    width: 42px;
    height: 38px;
    min-width: 42px;
}

.webchat-floating-alert-actions {
    padding: 0 18px 16px;
    background: #fff;
}

.webchat-system-alert-stack {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1084;
    display: grid;
    gap: 10px;
    width: 344px;
    max-width: calc(100vw - 24px);
    pointer-events: none;
}

.webchat-system-alert-stack-above-chat {
    bottom: 260px;
}

.webchat-system-alert {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 28px;
    gap: 12px;
    align-items: flex-start;
    padding: 14px;
    border-left: 3px solid #f7b84b;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(15, 23, 42, .2);
    pointer-events: auto;
}

.webchat-system-alert-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: rgba(247, 184, 75, .14);
    color: #f7b84b;
    font-size: 18px;
}

.webchat-system-alert-content {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.webchat-system-alert-content strong {
    color: #111827;
    font-size: 13px;
    line-height: 1.25;
}

.webchat-system-alert-content span {
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
}

.webchat-system-alert-content small {
    color: #94a3b8;
    font-size: 11px;
}

.webchat-system-alert-content a {
    width: max-content;
    margin-top: 3px;
    color: #405189;
    font-size: 12px;
    font-weight: 600;
}

@media (max-width: 575.98px) {
    #notificationDropdown .dropdown-menu {
        width: calc(100vw - 24px);
        min-width: 0;
    }

    .webchat-floating-notification {
        right: 12px;
        bottom: 12px;
        width: calc(100vw - 24px);
    }

    .webchat-system-alert-stack {
        right: 12px;
        bottom: 12px;
        width: calc(100vw - 24px);
    }

    .webchat-system-alert-stack-above-chat {
        bottom: 260px;
    }
}

#theme-settings-offcanvas .btn-close,
#customerFilters .btn-close,
#productFilters .btn-close,
#product-colors-modal .btn-close,
#product-brands-modal .btn-close,
#quick-group-modal .btn-close,
#quick-section-modal .btn-close,
#product-components-modal .btn-close,
#universalEmailModal .btn-close {
    background-color: transparent !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 1em;
    box-shadow: none;
    filter: none;
    opacity: 1;
}

#theme-settings-offcanvas .btn-close {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293A1 1 0 0 1 .293 14.293L6.586 8 .293 1.707A1 1 0 0 1 .293.293z'/%3e%3c/svg%3e") !important;
}

#customerFilters .btn-close,
#productFilters .btn-close {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230f766e'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293A1 1 0 0 1 .293 14.293L6.586 8 .293 1.707A1 1 0 0 1 .293.293z'/%3e%3c/svg%3e") !important;
}

#product-colors-modal .btn-close,
#product-brands-modal .btn-close,
#quick-group-modal .btn-close,
#quick-section-modal .btn-close,
#product-components-modal .btn-close,
#universalEmailModal .btn-close {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230f766e'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293A1 1 0 0 1 .293 14.293L6.586 8 .293 1.707A1 1 0 0 1 .293.293z'/%3e%3c/svg%3e") !important;
}

.navbar-menu .navbar-nav .nav-link,
.navbar-menu .navbar-nav .menu-title span {
    font-weight: 400;
}

.navbar-menu .navbar-nav .nav-link.active {
    border: 0;
    box-shadow: none;
}

.settings-required-note {
    margin-top: -20px;
    margin-right: 20px;
    font-size: 12px;
}

.settings-logo-panel {
    position: relative;
    min-height: 210px;
}

.settings-logo-hint {
    float: right;
    margin: -17px 9px 8px 0;
    color: var(--vz-secondary-color);
    font-size: 10px;
    font-style: italic;
    text-align: right;
}

.settings-logo-preview {
    clear: both;
    min-height: 120px;
    display: grid;
    place-items: center;
    border: 1px dashed var(--vz-border-color);
    border-radius: var(--vz-border-radius);
    /* background: var(--vz-light); */
}

.settings-logo-preview img {
    max-width: 70%;
    max-height: 110px;
    object-fit: contain;
}

#ie_exempt.form-check-input {
    width: 1em;
    height: 1em;
    min-height: 0;
    padding: 0;
    margin-top: 0.25em;
}

.header-user-text {
    min-width: 150px;
}

.header-user-text span {
    line-height: 1.2;
}

@media (max-width: 1199.98px) {
    #page-topbar .header-user-text {
        display: none !important;
        min-width: 0 !important;
    }

    #page-topbar #page-header-user-dropdown {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    #page-topbar .topbar-user .header-avatar {
        height: 32px;
        width: 32px;
    }
}

.page-content .module-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.module-header h2 {
    margin: 0 0 6px;
    font-size: 20px;
}

.module-header p,
.empty-state p,
.panel p {
    margin: 0;
    color: var(--vz-secondary-color);
}

.grid {
    display: grid;
    gap: 16px;
}

.cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 18px;
}

.two-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 18px;
}

.card,
.panel,
.empty-state,
.table-panel,
fieldset,
.tab-card {
    background: var(--vz-card-bg);
    border: 1px solid var(--vz-border-color);
    border-radius: 8px;
}

.panel,
.empty-state,
fieldset {
    padding: 20px;
}

.metric span {
    display: block;
    color: var(--vz-secondary-color);
    font-size: 14px;
}

.metric strong {
    display: block;
    margin-top: 10px;
    font-size: 34px;
}

.flow {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.flow span {
    padding: 9px 11px;
    border: 1px solid var(--vz-border-color);
    border-radius: 6px;
    background: var(--vz-light);
    font-size: 14px;
}

.button-link,
button:not(.btn):not(.dropdown-item):not(.icon-action):not(.password-toggle):not(.nav-link):not(.remove-row):not(.choices__button):not(.accordion-button):not(.quote-customer-result):not(.quote-product-result):not(.quote-item-action) {
    /* display: inline-flex; */
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 8px 14px;
    border: 0;
    border-radius: 6px;
    /* background: var(--ws-primary); */
    /* color: #fff; */
    color: #000000;
    font: inherit;
    cursor: pointer;
}

.button-link:hover,
button:not(.btn):not(.dropdown-item):not(.icon-action):not(.password-toggle):not(.nav-link):not(.remove-row):not(.choices__button):not(.accordion-button):not(.quote-customer-result):not(.quote-product-result):not(.quote-item-action):hover {
    background: #e3e3e3;
    color: #fff;
}

.alert {
    margin-bottom: 16px;
}

.table-panel {
    overflow-x: auto;
}

.action-submenu {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

table {
    width: 100%;
    border-collapse: collapse;
    min-width: 920px;
}

th,
td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--vz-border-color);
    text-align: left;
    vertical-align: middle;
}

th {
    color: var(--vz-secondary-color);
    font-size: 12px;
    text-transform: uppercase;
    background: var(--vz-light);
}

tr:last-child td {
    border-bottom: 0;
}

td small {
    display: block;
    margin-top: 4px;
    color: var(--vz-secondary-color);
}

tbody tr.clickable-row {
    cursor: pointer;
    transition: background-color 0.15s ease;
}

tbody tr.clickable-row:hover,
tbody tr.clickable-row:focus {
    background: rgba(64, 81, 137, 0.08);
}

.actions {
    white-space: nowrap;
    text-align: right;
}

.actions form {
    display: inline;
}

.icon-action {
    min-width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--ws-primary);
    font: inherit;
    font-size: 17px;
    line-height: 1;
}

.icon-action:hover {
    background: var(--vz-light);
}

.link-danger {
    color: var(--ws-danger) !important;
}

.icon-action.is-disabled {
    color: var(--vz-secondary-color);
    cursor: default;
}

.registry-badge,
.status,
.ws-registry-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.registry-badge {
    min-height: 24px;
    padding: 4px 10px;
    color: #26323d;
}

.registry-badge.registry-cliente {
    background: #bfffcb;
}

.ws-registry-badge.registry-cliente {
    background: #daf4f0;
    color: #0ab39c;
}

.ws-registry-badge.registry-fornecedor {
    background: #fde8e4;
    color: #f06548;
}

.ws-registry-badge.registry-cliente_fornecedor {
    background: #e1ebfd;
    color: #405189;
}

.ws-registry-badge.registry-prestador {
    background: #fef4e4;
    color: #f7b84b;
}

.ws-registry-badge.registry-transportador {
    background: #e2e5ed;
    color: #64748b;
}

.table-card .clickable-row:focus {
    outline: 2px solid rgba(64, 81, 137, 0.25);
    outline-offset: -2px;
}

.table-sort {
    cursor: pointer;
    user-select: none;
}

.table-sort:hover,
.table-sort:focus {
    color: var(--ws-primary);
}

.table-sort i {
    color: var(--vz-secondary-color);
    font-size: 13px;
}

.table-sort.asc i,
.table-sort.desc i {
    color: var(--ws-primary);
}

.customer-list-avatar {
    width: 34px;
    height: 34px;
    object-fit: cover;
    font-size: 14px;
}

#customersList .table > :not(caption) > * > * {
    padding: 0.85rem 0.9rem;
}


.registry-badge.registry-fornecedor {
    background: #fce3e3;
}

.registry-badge.registry-cliente_fornecedor {
    background: linear-gradient(90deg, #bfffcb 0%, #fce3e3 100%);
}

.registry-badge.registry-prestador {
    background: #f7f6d5;
}

.registry-badge.registry-transportador {
    background: #dce2fc;
}

.status {
    min-width: 64px;
    padding: 5px 8px;
}

.status.active {
    background: #e6f7f1;
    color: #145c45;
}

.status.inactive {
    background: #eef2f5;
    color: var(--vz-secondary-color);
}

.empty-row {
    color: var(--vz-secondary-color);
    text-align: center;
}

.user-form {
    margin-bottom: 18px;
}

fieldset {
    min-width: 0;
}

legend {
    float: none;
    width: auto;
    margin-bottom: 12px;
    padding: 0 8px;
    font-size: 15px;
    font-weight: 700;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

label {
    /* display: grid; */
    /* Este display: grid foi gerado pelo codex, removi por conta dos tooltips, mas analisar em outras situações */
    gap: 6px;
    color: var(--vz-secondary-color);
    font-size: 13px;
}

input,
select,
textarea {
    width: 100%;
    min-height: 40px;
    border: 1px solid var(--vz-border-color);
    border-radius: 6px;
    padding: 9px 10px;
    color: var(--vz-body-color);
    background: var(--vz-input-bg);
    font: inherit;
}

input:focus,
select:focus,
textarea:focus {
    outline: 2px solid rgba(15, 118, 110, 0.18);
    border-color: var(--ws-primary);
}

input.is-invalid,
select.is-invalid,
textarea.is-invalid {
    border-color: #dc3545;
}

input.is-valid,
select.is-valid,
textarea.is-valid {
    border-color: #198754;
}

.invalid-feedback {
    display: none;
    color: #dc3545;
    font-size: 12px;
    line-height: 1.3;
}

.is-invalid ~ .invalid-feedback {
    display: block;
}

.span-2 {
    grid-column: span 2;
}

.span-4 {
    grid-column: span 4;
}

.password-field,
.document-field,
.checkable-field {
    position: relative;
}

.password-field {
    display: block;
}

.password-field input,
.document-field input,
.checkable-field input {
    padding-right: 38px;
}

.password-toggle {
    position: absolute;
    right: 10px;
    top: 50%;
    width: 22px;
    height: 22px;
    min-height: 0;
    padding: 0;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: var(--vz-secondary-color);
    line-height: 0;
}

.password-toggle:hover,
.password-toggle:focus {
    color: var(--vz-body-color);
}

.password-toggle svg {
    width: 22px;
    height: 22px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.password-toggle.is-visible {
    color: var(--ws-primary);
}

.document-valid-icon,
.valid-check-icon {
    position: absolute;
    right: 10px;
    top: 30px;
    width: 22px;
    height: 22px;
    display: none;
    place-items: center;
    border-radius: 50%;
    background: #198754;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    pointer-events: none;
}

.document-field.has-valid-check .document-valid-icon,
.checkable-field.has-valid-check .valid-check-icon {
    display: grid;
}

.customer-photo-preview {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border: 1px solid var(--vz-border-color);
    border-radius: 8px;
}

.hidden {
    display: none !important;
}

.tab-card {
    overflow: hidden;
}

.nav-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 0 16px;
    border-bottom: 1px solid var(--vz-border-color);
    background: var(--vz-light);
}

.nav-link {
    margin-bottom: -1px;
    padding: 11px 16px;
    border: 1px solid transparent;
    border-radius: 6px 6px 0 0;
    background: transparent;
    color: var(--vz-secondary-color);
    font-weight: 700;
    cursor: pointer;
}

.nav-link.active {
    border-color: var(--vz-border-color) var(--vz-border-color) var(--vz-card-bg);
    background: var(--vz-card-bg);
    color: var(--vz-body-color);
}

.tab-content {
    padding: 18px;
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: grid;
    gap: 14px;
}

.nested-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.nested-card {
    position: relative;
    padding: 16px;
    border: 1px solid var(--vz-border-color);
    border-radius: 8px;
    background: var(--vz-light);
}

.remove-row {
    position: absolute;
    top: 8px;
    right: 8px;
    min-width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--ws-danger);
    color: #fff;
}

.compact-table table {
    min-width: 820px;
}

.compact-table th,
.compact-table td {
    padding: 8px;
}

.compact-table input {
    min-height: 36px;
}

.customer-actions-card,
.customer-editor,
.user-editor {
    margin-bottom: 18px;
    background: var(--vz-card-bg);
    box-shadow: var(--vz-box-shadow);
}

.customer-actions-card .card-header {
    padding: 16px 20px;
    border-color: var(--vz-border-color);
    background: transparent;
}

.customer-editor .card-header,
.customer-editor .card-footer,
.user-editor .card-header,
.user-editor .card-footer {
    border-color: var(--vz-border-color);
}

.customer-editor .card-header,
.user-editor .card-header {
    padding: 16px 20px;
}

.customer-editor .card-body,
.user-editor .card-body {
    display: grid;
    gap: 24px;
    padding: 20px;
}

.customer-editor fieldset,
.customer-editor .tab-card,
.user-editor fieldset {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.customer-editor fieldset,
.user-editor fieldset {
    display: grid;
    gap: 14px;
}

.customer-editor legend,
.user-editor legend {
    float: none;
    width: auto;
    margin: 0;
    padding: 20px 0px;
    color: var(--vz-heading-color);
    font-size: 15px;
    font-weight: 600;
}

.customer-editor label,
.user-editor label,
.user-submit-field {
    display: grid;
    gap: 6px;
    margin-bottom: 0;
    color: var(--vz-secondary-color);
    font-size: 13px;
    font-weight: 500;
}

.customer-editor input,
.customer-editor select,
.customer-editor textarea,
.user-editor input,
.user-editor select,
.user-editor textarea {
    min-height: 38px;
    border-color: var(--vz-input-border-custom);
    border-radius: var(--vz-border-radius);
    padding: 0.47rem 0.9rem;
    background-color: var(--vz-input-bg-custom);
    box-shadow: none;
}

.customer-editor textarea,
.user-editor textarea {
    padding-top: 0.7rem;
}

.customer-editor input:focus,
.customer-editor select:focus,
.customer-editor textarea:focus,
.user-editor input:focus,
.user-editor select:focus,
.user-editor textarea:focus {
    border-color: var(--vz-primary);
    outline: 0;
    box-shadow: none;
}

.customer-editor .form-grid,
.user-editor .form-grid {
    gap: 16px;
}

.user-status-action {
    display: grid;
    grid-template-columns: minmax(115px, 0.8fr) 74px minmax(135px, 0.9fr);
    gap: 12px;
    align-items: end;
}

.user-identity-fields,
.user-compact-fields {
    display: grid;
    gap: 16px;
}

.user-identity-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.user-compact-fields {
    grid-template-columns: 0.85fr 1fr 1fr;
}

.user-status-action label,
.user-status-action .user-submit-field,
.user-identity-fields label,
.user-compact-fields label {
    min-width: 0;
}

.user-photo-field {
    display: grid;
    justify-content: center;
    gap: 6px;
    color: var(--vz-secondary-color);
    font-size: 13px;
    font-weight: 500;
    text-align: center;
}

.user-editor .user-photo-picker {
    position: relative;
    display: block;
    width: 58px;
    height: auto;
    aspect-ratio: 1;
    margin: 0 auto;
    border-radius: 50%;
    cursor: pointer;
}

.user-editor .user-photo-placeholder,
.user-editor .user-photo-preview {
    width: 100%;
    height: 100%;
}

.user-editor .user-photo-preview {
    display: block;
    object-fit: cover;
    border: 1px solid var(--vz-border-color);
}

.user-editor .user-photo-picker:has(.user-photo-preview:not(.hidden)) .user-photo-placeholder {
    display: none;
}

.user-photo-edit {
    position: absolute;
    right: -2px;
    bottom: -2px;
    width: 22px;
    height: 22px;
}

.user-photo-edit .avatar-title {
    border: 1px solid var(--vz-border-color);
    box-shadow: var(--vz-box-shadow);
    font-size: 11px;
}

.user-photo-input {
    position: absolute;
    width: 1px;
    height: 1px;
    min-height: 1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.customer-editor .customer-main-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: start;
}
.product-editor {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: start;
}

.customer-editor .customer-main-grid > label.span-2 {
    grid-column: span 5;
}

.customer-editor .customer-main-grid > label.product-description-field {
    grid-column: span 8;
}

.customer-editor .customer-main-grid > label:not(.span-2) {
    grid-column: span 2;
}

.customer-editor .customer-main-grid > label.product-characteristic-field {
    grid-column: span 3;
}

.customer-editor .customer-main-grid > label.product-unit-field {
    grid-column: span 1;
}

.customer-editor .customer-main-grid > label.product-suppliers-field {
    grid-column: span 4;
}

.product-suppliers-field .choices {
    margin-bottom: 0;
}

.product-suppliers-field .choices__inner {
    min-height: 38px;
    border-color: var(--vz-border-color);
    background: var(--vz-card-bg);
}

.product-components-action {
    display: flex;
    align-items: end;
    /* grid-column: span 2; */
    min-height: 62px;
}

.product-components-action .btn {
    width: 100%;
    height: 40px;
}

.product-sale-price-field input {
    border-color: #a7d7b5;
    background: #eaf7ee;
    color: #216e39;
    font-weight: 600;
}

.product-profitability-field input {
    border-color: #f2c58f;
    background: #fff4e5;
    color: #b35c00;
    font-weight: 600;
}

.product-components-table .product-component-number {
    width: 160px;
}

.product-components-table .product-component-action {
    width: 52px;
}

.product-technical-fields {
    display: grid;
    gap: 10px;
}

.product-technical-field-row {
    display: grid;
    grid-template-columns: minmax(170px, 0.35fr) minmax(260px, 1fr) 38px;
    align-items: end;
    gap: 10px;
}

.product-technical-field-row .btn-icon {
    width: 38px;
    min-height: 38px;
}

.product-technical-components-table th:first-child,
.product-technical-components-table td:first-child {
    width: 70px;
}

.product-technical-image-field {
    display: grid;
    justify-items: start;
    gap: 8px;
}

.product-technical-image-picker {
    display: grid;
    width: min(100%, 260px);
    aspect-ratio: 4 / 3;
    place-items: center;
    overflow: hidden;
    border: 1px dashed var(--vz-border-color);
    border-radius: var(--vz-border-radius);
    background: var(--vz-light);
    cursor: pointer;
}

.product-technical-image-placeholder,
.product-technical-image-preview {
    width: 100%;
    height: 100%;
}

.product-technical-image-preview {
    object-fit: contain;
    background: var(--vz-card-bg);
}

.product-technical-image-picker:has(.product-technical-image-preview:not(.hidden)) .product-technical-image-placeholder {
    display: none;
}

.product-technical-image-actions {
    grid-template-columns: 180px minmax(220px, 1fr);
    align-items: center;
}

.product-technical-image-side {
    display: grid;
    justify-items: start;
    gap: 0.55rem;
}

.product-technical-print-sheet {
    width: min(100%, 760px);
    min-height: 1075px;
    padding: 30px;
    background: #fff;
    color: #212529;
    box-shadow: 0 0.75rem 2rem rgba(15, 23, 42, 0.12);
}

.product-technical-print-header {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 0;
    margin-bottom: 0;
    border: 1px solid #4b5563;
    border-bottom: 0;
}

.product-technical-print-header > div:first-child {
    flex: 1;
    padding: 0.38rem 0.55rem;
}

.product-technical-print-header span,
.product-technical-print-code small,
.product-technical-print-summary small {
    display: block;
    color: #64748b;
    font-size: 0.56rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.product-technical-print-header h1 {
    margin: 0.12rem 0 0;
    color: #111827;
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.15;
}

.product-technical-print-code {
    display: grid;
    place-content: center;
    min-width: 96px;
    padding: 0.38rem 0.55rem;
    border-left: 1px solid #4b5563;
    text-align: center;
}

.product-technical-print-code strong {
    color: #111827;
    font-size: 1rem;
}

.product-technical-print-summary {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    border: 1px solid #4b5563;
    border-bottom: 0;
}

.product-technical-print-summary > div {
    min-height: 42px;
    padding: 0.36rem 0.48rem;
    border-right: 1px solid #4b5563;
    border-bottom: 1px solid #4b5563;
}

.product-technical-print-summary > div:nth-child(2n) {
    border-right: 0;
}

.product-technical-print-summary strong {
    display: block;
    margin-top: 0.12rem;
    color: #111827;
    font-size: 0.66rem;
    font-weight: 600;
    line-height: 1.18;
    white-space: pre-wrap;
}

.product-technical-print-grid {
    /* display: grid; */
    grid-template-columns: 1.08fr 0.92fr;
    border-left: 1px solid #4b5563;
}

.product-technical-print-block {
    min-height: 116px;
    border-right: 1px solid #4b5563;
    border-bottom: 1px solid #4b5563;
}

.product-technical-print-block h2 {
    margin: 0;
    padding: 0.24rem 0.42rem;
    border-bottom: 1px solid #4b5563;
    background: #f3f6f9;
    color: #111827;
    font-size: 0.62rem;
    font-weight: 700;
}

.product-technical-print-components table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.58rem;
    min-width: 0;
}

.product-technical-print-components th,
.product-technical-print-components td {
    padding: 0.22rem 0.32rem;
    border-bottom: 1px solid #d1d5db;
    line-height: 1.15;
}

.product-technical-print-components th {
    color: #111827;
    font-weight: 700;
}

.product-technical-print-reference {
    grid-row: span 2;
}

.product-technical-print-image-wrap {
    display: grid;
    place-items: center;
    height: 392px;
    padding: 0.5rem;
}

.product-technical-print-image-wrap img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.product-technical-print-instructions p,
.product-technical-print-fields {
    margin: 0;
    padding: 0.45rem;
    font-size: 0.62rem;
    line-height: 1.25;
}

.product-technical-print-field {
    display: grid;
    grid-template-columns: 105px 1fr;
    gap: 0.35rem;
    padding: 0.28rem 0;
    border-bottom: 1px solid #e5e7eb;
}

.product-technical-print-field:last-child {
    border-bottom: 0;
}

.product-technical-print-field strong {
    color: #111827;
}

.product-grid-variants-table {
    min-width: 1080px;
}

.product-grid-variants-table th:first-child {
    width: 72px;
    min-width: 72px;
}

.product-grid-variants-table th:nth-child(2) {
    min-width: 220px;
}

.product-grid-variants-table .variant-money,
.product-grid-variants-table .product-grid-stock-input {
    min-width: 108px;
    text-align: right;
}

.product-grid-order-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.product-grid-drag-handle {
    display: inline-grid;
    width: 24px;
    height: 26px;
    place-items: center;
    color: var(--vz-secondary-color);
    cursor: grab;
    font-size: 16px;
}

.product-grid-drag-handle:active {
    cursor: grabbing;
}

.product-grid-order-actions .btn-icon {
    width: 26px;
    height: 26px;
    padding: 0;
}

.product-grid-order-actions .btn-icon:disabled {
    pointer-events: none;
    opacity: 0.35;
}

.product-grid-variants-table tr.product-grid-row-dragging {
    opacity: 0.55;
}

.product-grid-variant-label,
.product-grid-variant-segment {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: 500;
}

.product-grid-variant-label {
    flex-wrap: wrap;
}

.product-grid-variant-separator {
    margin: 0 4px;
    color: var(--vz-secondary-color);
}

.product-grid-color-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 2px 8px;
    border: 1px solid rgba(0, 0, 0, 0.22);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
}

.product-grid-color-choice {
    border: 1px solid rgba(0, 0, 0, 0.22) !important;
    background: var(--product-grid-color-bg) !important;
    color: var(--product-grid-color-text) !important;
}

.product-grid-color-choice .choices__button {
    border-left-color: rgba(255, 255, 255, 0.38) !important;
    filter: none;
}

.product-taxonomy-select {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    gap: 4px;
}

.product-taxonomy-add {
    display: inline-grid;
    width: 30px;
    min-height: 38px;
    place-items: center;
    padding: 0;
}

.product-other-costs-field {
    display: grid;
    gap: 0.35rem;
}

.product-other-costs-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    min-height: 18px;
}

.product-other-costs-switch {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--vz-secondary-color);
    font-size: 0.68rem;
    font-weight: 500;
}

.product-other-costs-switch .form-check-input {
    width: 2em;
    height: 1em;
    min-height: 0;
    cursor: pointer;
}

.product-other-costs-input {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    min-height: 38px;
    border: 1px solid var(--vz-border-color);
    border-radius: var(--vz-border-radius);
    background: var(--vz-card-bg);
}

.product-other-costs-input input {
    min-height: 36px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.product-other-costs-input input:focus {
    box-shadow: none;
}

.product-other-costs-prefix,
.product-other-costs-suffix {
    min-width: 2rem;
    color: var(--vz-secondary-color);
    font-size: 0.78rem;
    font-weight: 600;
    text-align: center;
}

.product-other-costs-input.is-currency .product-other-costs-suffix,
.product-other-costs-input.is-percentage .product-other-costs-prefix {
    display: none;
}

.product-additional-information {
    min-height: 38px !important;
    height: 38px;
    resize: none;
}

.product-ncm-field {
    position: relative;
}

.product-ncm-results {
    position: absolute;
    z-index: 30;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid var(--vz-border-color);
    border-radius: var(--vz-border-radius);
    background: #fff;
    box-shadow: 0 6px 16px rgba(30, 41, 59, 0.12);
}

button.product-ncm-result,
.product-ncm-result {
    display: grid;
    gap: 2px;
    width: 100%;
    min-height: 0;
    padding: 9px 11px;
    border: 0;
    border-bottom: 1px solid #d9d9d9;
    border-radius: 0;
    background: #fff !important;
    color: var(--vz-body-color) !important;
    text-align: left;
    justify-items: start;
}

.product-ncm-result:last-child {
    border-bottom: 0;
}

button.product-ncm-result:hover,
button.product-ncm-result:focus,
.product-ncm-result:hover,
.product-ncm-result:focus {
    background: #f3f6f9 !important;
    color: var(--vz-body-color) !important;
}

.product-ncm-result-head {
    display: block;
    overflow: hidden;
    color: var(--vz-body-color);
    font-size: 12px;
    line-height: 1.35;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-ncm-result-head strong {
    color: var(--vz-body-color);
    font-size: 12px;
}

.product-cest-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.product-cest-label a {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: var(--vz-primary);
    font-size: 10px;
    font-weight: 500;
}

.product-grid-sku-heading {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.product-grid-sku-heading .btn-icon,
.product-grid-price-fill .btn-icon {
    width: 26px;
    height: 26px;
    padding: 0;
}

.product-grid-price-heading {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.product-grid-price-fill {
    display: inline-grid;
    grid-template-columns: 74px 26px;
    align-items: center;
    gap: 4px;
}

.product-grid-price-fill .product-grid-price-input {
    width: 74px;
    min-height: 26px !important;
    height: 26px;
    padding: 2px 6px;
    font-size: 12px;
}

.settings-product-column {
    min-height: 100%;
    padding: 2px 8px 2px 0;
    border-right: 1px solid var(--vz-border-color);
}

.settings-preference-section .col-xl-3:last-child .settings-product-column {
    border-right: 0;
}

.settings-products-header h4 {
    font-size: 16px;
}

.settings-products-header p {
    font-size: 12px;
}

.settings-product-column h5 {
    font-size: 13px;
}

.settings-product-column .form-label,
.settings-product-column .form-check-label {
    font-size: 12px;
}

.settings-calculator-card {
    border-color: var(--vz-border-color) !important;
    border-radius: 6px;
    background: var(--vz-card-bg);
}

.settings-calculator-card .card-header h5 {
    font-size: 14px;
    font-weight: 500;
}

.settings-customization-list {
    border: 1px solid var(--vz-border-color);
    border-radius: 4px;
    overflow: hidden;
}

.settings-textile-customization-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    padding: 5px 8px;
    border-bottom: 1px solid var(--vz-border-color);
    font-size: 12px;
}

.settings-textile-customization-row:last-child {
    border-bottom: 0;
}

.settings-customization-actions {
    display: inline-flex;
    gap: 2px;
}

.settings-graphic-customization-table {
    font-size: 12px;
}

.settings-graphic-customization-table th,
.settings-graphic-customization-table td {
    padding: 5px 8px;
}

.grid-attribute-row .form-label {
    margin-bottom: 2px;
    font-size: 11px;
}

.grid-attribute-row .form-control {
    min-height: 28px;
    padding: 3px 7px;
    font-size: 12px;
}

.grid-attribute-row .btn-icon {
    width: 28px;
    height: 28px;
    padding: 0;
}

.price-table-name-field {
    flex: 1 1 auto;
    min-width: 0;
}

.price-table-discount-field {
    flex: 0 0 78px;
}

.price-table-row .form-label {
    margin-bottom: 2px;
    font-size: 11px;
}

.price-table-row .form-control {
    min-height: 28px;
    height: 28px;
    padding: 3px 7px;
    font-size: 12px;
}

.price-table-row .btn-icon {
    width: 28px;
    height: 28px;
    padding: 0;
    flex: 0 0 23px;
    position: relative;
    top: -8px;
}

.price-table-default.active {
    color: #f7b84b;
}

.product-price-table-modal-dialog {
    width: 90%;
    max-width: 90%;
}

.product-price-table-result .table > :not(caption) > * > * {
    padding: 0.24rem 0.45rem;
    font-size: 12px;
}

.product-price-table-result tbody tr.product-price-table-product-row.is-even {
    background: #ffffff;
}

.product-price-table-result tbody tr.product-price-table-product-row.is-odd {
    background: #f8f9fb;
}

.product-price-table-result tbody tr.product-price-table-product-row:hover {
    background: #eef4ff;
}

.product-price-table-result tr.product-price-table-product-row.is-active,
.product-price-table-result tr.product-price-table-variant-item.is-active {
    outline: 2px solid #405189;
    outline-offset: -2px;
    position: relative;
    z-index: 1;
}

.product-price-table-result tr.product-price-table-product-row.is-active > td,
.product-price-table-result tr.product-price-table-variant-item.is-active > td {
    background: #eef4ff !important;
}

.product-price-table-expand-column {
    width: 38px;
    text-align: center;
}

.product-price-table-expand-column .btn-icon {
    width: 26px;
    height: 26px;
    padding: 0;
}

.product-price-table-variant-row > td {
    background: #f4f7fb !important;
    padding: 0.45rem 0.7rem !important;
}

.product-price-table-variant-wrap {
    border: 1px solid var(--vz-border-color);
    border-radius: 6px;
    overflow: hidden;
}

.product-price-table-variant-wrap .table > :not(caption) > * > * {
    padding: 0.22rem 0.45rem;
    font-size: 12px;
}

.product-price-table-variant-chip {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    margin: 1px 3px 1px 0;
    padding: 2px 7px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    background: #fff;
    font-size: 11px;
    font-weight: 500;
}

.product-price-table-color-chip {
    border-color: rgba(0, 0, 0, 0.24);
    font-weight: 600;
}

.product-price-table-product-link {
    border: 0;
    background: transparent;
    padding: 0;
    color: #212529;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    line-height: 1.15;
}

.product-price-table-product-link:hover,
.product-price-table-product-link:focus {
    color: #212529;
    text-decoration: none;
    outline: none;
}

.product-price-popover {
    max-width: 360px;
}

.product-price-popover-content {
    display: grid;
    gap: 6px;
    font-size: 12px;
}

.product-price-popover-content span {
    color: var(--vz-secondary-color);
    font-weight: 600;
}

.product-price-popover-title {
    font-weight: 700;
}

.price-adjustment-card {
    margin-bottom: 14px;
}

.price-adjustment-section-header {
    min-height: 36px;
    padding: 8px 14px;
    background: #f3f6f9;
    border-bottom: 0;
}

.price-adjustment-section-header .card-title {
    color: #5f7dab;
    font-size: 14px;
    font-weight: 600;
}

.price-adjustment-table-wrap {
    max-height: calc(100vh - 310px);
}

.price-adjustment-table thead th {
    background: #e9ecef;
    color: #212529;
    font-size: 12px;
    font-weight: 600;
    padding: 0.35rem 0.5rem;
}

.price-adjustment-table > :not(caption) > * > * {
    padding: 0.28rem 0.5rem;
    font-size: 13px;
}

.price-adjustment-table tbody tr.price-adjustment-product-row:nth-child(odd) {
    background: #ffffff;
}

.price-adjustment-table tbody tr.price-adjustment-product-row:nth-child(even) {
    background: #f8f9fb;
}

.price-adjustment-toggle.btn-icon {
    width: 26px;
    height: 26px;
    padding: 0;
    flex: 0 0 26px;
}

.price-adjustment-price-field {
    max-width: 160px;
}

.price-adjustment-price-field .form-control,
.price-adjustment-price-field .input-group-text {
    height: 28px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12px;
    font-weight: 600;
}

.price-adjustment-variant-row > td {
    background: #f4f7fb !important;
    padding: 0.45rem 0.7rem !important;
}

.price-adjustment-variant-box {
    border: 1px solid var(--vz-border-color);
    border-radius: 6px;
    overflow: hidden;
}

.price-adjustment-variant-box .table > :not(caption) > * > * {
    padding: 0.22rem 0.45rem;
    font-size: 12px;
}

.product-price-popover-photo {
    width: 100%;
    height: 150px;
    object-fit: contain;
    border-radius: 6px;
    /* background: #f3f6f9; */
}

.product-price-popover-photo-empty {
    display: grid;
    place-items: center;
    color: var(--vz-secondary-color);
    font-size: 32px;
}

.settings-product-check.form-check-input {
    width: 1em;
    height: 1em;
    min-height: 0;
    padding: 0;
    margin-top: 0.25em;
}

.webstamp-check-sm.form-check {
    align-items: center;
    display: flex;
    gap: 6px;
    min-height: 18px;
    padding-left: 0;
}

.webstamp-check-sm .form-check-input,
.webstamp-check-sm.form-check-input {
    flex: 0 0 13px;
    float: none;
    height: 13px !important;
    margin: 0 !important;
    min-height: 13px !important;
    min-width: 13px !important;
    padding: 0 !important;
    width: 13px !important;
}

.webstamp-check-sm .form-check-label {
    font-size: 12px;
    line-height: 1.25;
}

.product-grid-attribute-check.form-check-input {
    width: 1em;
    height: 1em;
    min-height: 0;
    padding: 0;
    margin-top: 0.25em;
}

.settings-color-swatch {
    display: inline-block;
    width: 22px;
    height: 22px;
    border: 1px solid var(--vz-border-color);
    border-radius: 4px;
    vertical-align: middle;
}

.product-colors-table {
    table-layout: fixed;
    width: min(100%, 560px);
}

.product-colors-table .product-color-preview-column {
    width: 52px;
}

.product-colors-table .product-color-name-column {
    width: 46%;
}

.product-colors-table .product-color-code-column {
    width: 92px;
}

.product-colors-table .product-color-actions-column {
    width: 78px;
}

.product-colors-table td {
    padding-top: 6px;
    padding-bottom: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-colors-table .btn-icon {
    width: 28px;
    height: 28px;
    padding: 0;
}

.product-brands-table .product-brand-actions-column {
    width: 82px;
}

.product-brands-table .btn-icon {
    width: 28px;
    height: 28px;
    padding: 0;
}

.customer-editor .customer-main-grid > .customer-photo-field {
    grid-column: 11 / span 2;
    grid-row: 1 / span 3;
}

.customer-section-headline {
    margin: 8px 0 -4px;
    padding-top: 8px;
    border-top: 1px solid var(--vz-border-color);
}

.customer-section-headline h5 {
    margin: 0;
    color: var(--vz-heading-color);
    font-size: 15px;
    font-weight: 600;
}

.customer-photo-field {
    display: grid;
    gap: 6px;
    color: var(--vz-secondary-color);
    font-size: 13px;
    font-weight: 500;
}

.customer-editor .customer-photo-picker {
    position: relative;
    display: block;
    width: 60%;
    height: auto;
    aspect-ratio: 1;
    margin: 0 auto;
    border-radius: 50%;
    cursor: pointer;
}

.customer-editor .customer-photo-placeholder {
    width: 100%;
    height: 100%;
}

.customer-editor .customer-photo-preview {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border: 1px solid var(--vz-border-color);
}

.customer-editor .customer-photo-picker:has(.customer-photo-preview:not(.hidden)) .customer-photo-placeholder {
    display: none;
}

.customer-editor .product-photo-picker {
    width: min(100%, 190px);
    aspect-ratio: 1;
    border: 1px solid var(--vz-border-color);
    border-radius: 4px;
    overflow: visible;
}

.customer-editor .product-photo-picker .customer-photo-placeholder,
.customer-editor .product-photo-preview {
    border-radius: 3px;
}

.customer-editor .product-photo-preview {
    object-fit: contain;
    background: var(--vz-card-bg);
}

.customer-photo-edit {
    position: absolute;
    right: 0;
    bottom: 0;
}

.customer-photo-edit .avatar-title {
    border: 1px solid var(--vz-border-color);
    box-shadow: var(--vz-box-shadow);
}

.customer-photo-input {
    position: absolute;
    width: 1px;
    height: 1px;
    min-height: 1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.customer-editor .tab-card {
    overflow: visible;
}

.customer-editor .nav-tabs {
    gap: 0;
    padding: 0;
    border-bottom: 1px solid var(--vz-border-color);
    background: transparent;
}

.customer-editor .nav-tabs .nav-link {
    margin-bottom: -1px;
    padding: 0.5rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--vz-border-radius) var(--vz-border-radius) 0 0;
    color: var(--vz-secondary-color);
    font-weight: 500;
}

.customer-editor .nav-tabs .nav-link.active {
    border-color: var(--vz-border-color) var(--vz-border-color) var(--vz-card-bg);
    background: var(--vz-card-bg);
    color: var(--vz-success);
}

.customer-editor .tab-content {
    padding: 20px 0 0;
}

#product-form .tab-content {
    padding-top: 8px;
}

.product-field-label {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.product-tooltip-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--vz-info);
    cursor: help;
    font-size: 0.85rem;
    line-height: 1;
}

.product-tooltip {
    --bs-tooltip-bg: var(--vz-info);
    --bs-tooltip-color: #fff;
}

.product-tooltip .tooltip-inner {
    max-width: 220px;
    padding: 0.35rem 0.5rem;
    font-size: 0.7rem;
    line-height: 1.35;
    text-align: center;
}

.settings-tooltip-trigger {
    margin-left: 0.3rem;
    vertical-align: middle;
}

.form-check-label .settings-tooltip-trigger,
h5 .settings-tooltip-trigger {
    transform: translateY(-1px);
}

.product-taxonomy-card .card-header {
    padding-bottom: 0.9rem;
}

.product-taxonomy-toolbar {
    display: grid;
    grid-template-columns: minmax(190px, 0.9fr) minmax(260px, 1.5fr) auto;
    align-items: end;
    gap: 0.75rem;
    max-width: 780px;
}

.product-taxonomy-toolbar label {
    display: grid;
    gap: 0.35rem;
    color: var(--vz-secondary-color);
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
}

.product-taxonomy-save {
    min-height: 38px;
}

.product-taxonomy-list {
    overflow: hidden;
}

.product-taxonomy-list thead th:first-child {
    width: 34%;
}

.product-taxonomy-list tbody td {
    padding: 0;
    vertical-align: top;
}

.product-taxonomy-group-cell {
    border-right: 1px solid var(--vz-border-color);
}

.product-taxonomy-group {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 0.9rem;
}

.product-taxonomy-group strong {
    color: var(--vz-heading-color);
    font-size: 0.78rem;
    font-weight: 600;
}

.product-taxonomy-sections {
    display: grid;
}

.product-taxonomy-empty {
    padding: 0.75rem;
    color: var(--vz-secondary-color);
    font-size: 0.75rem;
    font-style: italic;
}

.product-taxonomy-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 34px;
    padding: 0.35rem 0.75rem;
    border-bottom: 1px dotted var(--vz-border-color);
    color: var(--vz-body-color);
    font-size: 0.76rem;
}

.product-taxonomy-section:last-child {
    border-bottom: 0;
}

.product-taxonomy-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    flex-shrink: 0;
}

.product-taxonomy-actions .icon-action {
    width: 22px;
    height: 22px;
    font-size: 0.9rem;
}

.cash-register-table th,
.cash-register-table td {
    padding: 0.95rem 1rem !important;
    vertical-align: middle;
}

.cash-register-table th:first-child,
.cash-register-table td:first-child {
    width: 92px;
    max-width: 92px;
    white-space: nowrap;
}

.payment-plan-installments {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem 1.35rem;
}

.payment-plan-installment-row {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    width: auto;
    padding: 0.45rem 0.55rem;
    border: 1px solid var(--vz-border-color);
    border-radius: 6px;
    background: var(--vz-light);
}

.payment-plan-installment-row:not(.is-first)::before {
    position: absolute;
    left: -1rem;
    color: var(--vz-secondary-color);
    content: "+";
    font-size: 1rem;
    font-weight: 600;
}

.payment-plan-installment-row i {
    color: var(--vz-secondary-color);
    font-size: 0.75rem;
}

.payment-plan-installment-row input {
    width: 72px;
    min-height: 32px;
    padding: 0.35rem 0.45rem;
}

.payment-plan-installment-control {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

@media (max-width: 767.98px) {
    .product-taxonomy-toolbar {
        grid-template-columns: 1fr;
    }

    .product-taxonomy-save {
        justify-self: start;
    }

    .product-taxonomy-list thead th:first-child {
        width: 40%;
    }
}

.saas-auth-body,
.saas-admin-body {
    background: #f4f6f9;
    color: #1f2937;
}

.saas-login {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}

.saas-login-card {
    width: min(420px, 100%);
    padding: 32px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
}

.saas-login-mark,
.saas-brand span {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: #243782;
    color: #fff;
    font-weight: 700;
}

.saas-login-card h1 {
    margin: 18px 0 6px;
    font-size: 1.45rem;
}

.saas-login-card p,
.saas-login-card small {
    color: #64748b;
}

.saas-admin-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
}

.saas-sidebar {
    background: #111827;
    color: #fff;
    padding: 20px 16px;
}

.saas-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-size: 1rem;
    text-decoration: none;
    margin-bottom: 24px;
}

.saas-sidebar nav {
    display: grid;
    gap: 6px;
}

.saas-sidebar nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 12px;
    border-radius: 6px;
    color: #cbd5e1;
    text-decoration: none;
}

.saas-sidebar nav a.active,
.saas-sidebar nav a:hover {
    background: #243782;
    color: #fff;
}

.saas-main {
    min-width: 0;
}

.saas-topbar {
    min-height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
}

.saas-topbar span {
    color: #64748b;
    font-size: 0.78rem;
    text-transform: uppercase;
}

.saas-topbar h1 {
    margin: 0;
    font-size: 1.3rem;
}

.saas-topbar form {
    display: flex;
    align-items: center;
    gap: 10px;
}

.saas-content {
    padding: 24px;
}

.saas-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.saas-kpis article,
.saas-panel,
.saas-inline-editor {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.saas-kpis article {
    padding: 18px;
}

.saas-kpis article > span {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    margin-bottom: 14px;
    font-size: 1.2rem;
}

.saas-kpis small {
    display: block;
    color: #64748b;
}

.saas-kpis strong {
    display: block;
    font-size: 1.8rem;
}

.saas-panel {
    padding: 18px;
}

.saas-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.saas-panel-head h2 {
    margin: 0;
    font-size: 1rem;
}

.saas-panel-head p {
    margin: 4px 0 0;
    color: #64748b;
}

.saas-stack {
    display: grid;
    gap: 12px;
}

.saas-inline-editor {
    padding: 14px;
}

.saas-feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 8px 14px;
}

.saas-feature-grid label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.saas-usage-note {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(64, 81, 137, .18);
    border-radius: 8px;
    background: rgba(64, 81, 137, .06);
    color: #405189;
    font-size: 13px;
}

.saas-usage-note i {
    font-size: 18px;
    line-height: 1;
}

.saas-usage-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.saas-usage-card {
    display: grid;
    gap: 16px;
    padding: 18px;
    border: 1px solid var(--vz-border-color);
    border-radius: 8px;
    background: var(--vz-card-bg);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
}

.saas-usage-card-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.saas-usage-card-head h3 {
    margin: 0;
    color: var(--vz-heading-color);
    font-size: 16px;
}

.saas-usage-card-head span {
    display: block;
    margin-top: 0.25rem;
    color: var(--vz-secondary-color);
    font-size: 12px;
}

.saas-usage-card-head strong {
    color: #405189;
    font-size: 16px;
    white-space: nowrap;
}

.saas-usage-meter {
    display: grid;
    gap: 0.45rem;
}

.saas-usage-meter-label {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--vz-body-color);
    font-size: 13px;
}

.saas-usage-meter-label strong {
    font-size: 12px;
    white-space: nowrap;
}

.saas-usage-meter .progress {
    height: 8px;
    background: #eef2f7;
}

.saas-usage-meter small {
    color: var(--vz-secondary-color);
    font-size: 11px;
}

.saas-edit-row td {
    background: #f8fafc;
}

@media (max-width: 991.98px) {
    .saas-admin-shell {
        grid-template-columns: 1fr;
    }

    .saas-sidebar {
        position: static;
    }

    .saas-sidebar nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .saas-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .saas-usage-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .saas-topbar,
    .saas-panel-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .saas-content {
        padding: 14px;
    }

    .saas-sidebar nav,
    .saas-kpis {
        grid-template-columns: 1fr;
    }
}

.customer-editor .tab-pane.active {
    display: grid;
    gap: 16px;
}

.customer-editor .nested-header {
    min-height: 38px;
}

.customer-editor .nested-header strong {
    color: var(--vz-heading-color);
    font-weight: 600;
}

.customer-editor .nested-card {
    margin-top: 14px;
    border-radius: var(--vz-border-radius);
    background: var(--vz-light);
}

.customer-editor .remove-row {
    background: transparent;
    color: var(--vz-danger);
    font-size: 18px;
}

.customer-editor .remove-row:hover {
    background: rgba(var(--vz-danger-rgb), 0.08);
}

.customer-editor .table-panel {
    border-radius: var(--vz-border-radius);
}

.customer-editor .compact-table table {
    margin-bottom: 0;
}

.customer-editor .compact-table th {
    background: var(--vz-light);
}

.customer-editor .card-footer {
    padding: 16px 20px;
}

@media (max-width: 900px) {
    .cards,
    .two-columns,
    .form-grid {
        grid-template-columns: 1fr;
    }

    .span-2,
    .span-4 {
        grid-column: span 1;
    }

    .page-content .module-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .customer-editor .customer-main-grid {
        grid-template-columns: 1fr;
    }

    .customer-editor .customer-main-grid > label.span-2,
    .customer-editor .customer-main-grid > label:not(.span-2),
    .customer-editor .customer-main-grid > .customer-photo-field {
        grid-column: 1;
        grid-row: auto;
    }

    #product-form,
    #product-form .card-body,
    #product-form .tab-content,
    #product-form .tab-pane,
    #product-form fieldset,
    #product-form .customer-main-fieldset,
    #product-form .form-grid {
        max-width: 100%;
        min-width: 0;
    }

    #product-form .card-body {
        overflow-x: hidden;
    }

    #product-form .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        max-width: 100%;
        -webkit-overflow-scrolling: touch;
    }

    #product-form .nav-tabs .nav-item {
        flex: 0 0 auto;
    }

    #product-form .form-grid,
    #product-form .customer-main-grid,
    #product-form .product-editor {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    #product-form .span-2,
    #product-form .span-3,
    #product-form .span-4,
    #product-form .span-full,
    #product-form .product-description-field,
    #product-form .product-suppliers-field,
    #product-form .product-components-action,
    #product-form .product-packaging-frame,
    #product-form .product-photo-field,
    #product-form .product-acquisition-cost-field,
    #product-form .product-production-cost-field,
    #product-form .product-sale-price-field,
    #product-form .product-profitability-field {
        grid-column: 1 / -1 !important;
        min-width: 0;
        width: 100%;
    }

    #product-form label,
    #product-form input,
    #product-form select,
    #product-form textarea,
    #product-form .choices,
    #product-form .choices__inner,
    #product-form .product-taxonomy-select,
    #product-form .product-other-costs-field,
    #product-form .product-other-costs-input {
        max-width: 100%;
        min-width: 0;
    }

    #product-form .product-packaging-picker,
    #product-form .product-technical-field-row,
    #product-form .product-technical-image-field {
        grid-template-columns: minmax(0, 1fr) !important;
        flex-direction: column;
        align-items: stretch;
        max-width: 100%;
    }

    #product-form .product-packaging-picker .btn,
    #product-form .product-technical-image-side .btn {
        width: 100%;
    }

    #product-form .table-responsive {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .product-components-action {
        grid-column: 1;
    }

    .settings-product-column {
        padding-right: 0;
        padding-bottom: 18px;
        border-right: 0;
        border-bottom: 1px solid var(--vz-border-color);
    }

    .user-status-action,
    .user-compact-fields {
        grid-template-columns: 1fr;
    }

    .user-identity-fields {
        grid-template-columns: 1fr;
    }

    .user-photo-field {
        justify-content: start;
    }
}

.permissions-grid .form-check-input {
    width: 1em;
    height: 1em;
    min-height: 0;
    padding: 0;
    margin-top: 0.25em;
}

.customer-summary-card .card-body {
    min-height: 82px;
    padding: 0.9rem 1rem;
}

.customer-summary-card .avatar-sm {
    width: 2.5rem;
    height: 2.5rem;
}

@media (max-width: 767.98px) {
    .customer-summary-row {
        --vz-gutter-y: 0.55rem;
        margin-bottom: 0.65rem;
    }

    .customer-summary-row .customer-summary-card,
    .customer-summary-row .service-order-summary-card,
    .page-content > .container-fluid > .row:first-of-type > [class*="col-"] > .card.card-animate,
    .cash-control-card {
        margin-bottom: 0.55rem;
    }

    .customer-summary-card .card-body,
    .service-order-summary-card .card-body {
        min-height: 68px;
        padding-top: 0.7rem;
        padding-bottom: 0.7rem;
    }

    .cash-control-card .card-body {
        padding-top: 0.8rem;
        padding-bottom: 0.8rem;
    }

    .operational-summary,
    .pcp-summary-grid,
    .cards {
        gap: 0.55rem !important;
        margin-bottom: 0.65rem !important;
    }

    .operational-summary-item,
    .pcp-summary-card,
    .card.metric {
        padding-top: 0.75rem !important;
        padding-bottom: 0.75rem !important;
    }

    .mobile-hide-print-action {
        display: none !important;
    }
}

.customer-status-badge {
    padding: 0.42rem 0.65rem;
    font-size: 0.78rem;
}

.customer-registry-badge {
    padding: 0.42rem 0.65rem;
    font-size: 0.78rem;
}

.customer-provider-services-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.25rem;
}

.customer-editor .customer-main-grid > .customer-provider-services-field {
    grid-column: span 2;
}

.customer-provider-services-label {
    color: var(--vz-heading-color);
    font-size: 0.8rem;
    font-weight: 500;
}

.customer-provider-price-button {
    align-self: center;
    height: 24px;
    line-height: 1;
    min-height: 24px;
    padding: 0 0.45rem;
    width: auto;
}

.customer-provider-services-field > select,
.customer-provider-services-field > .choices,
.customer-provider-services-field > input[type="hidden"] {
    grid-column: 1 / -1;
}

.customer-provider-services-label i {
    color: var(--vz-secondary-color);
    cursor: help;
    font-size: 0.9rem;
}

.customer-provider-services-field .choices {
    margin-bottom: 0;
}

.customer-provider-services-field .choices__inner {
    min-height: 40px;
    border-color: var(--vz-border-color);
    background: var(--vz-input-bg);
}

.customer-provider-services-field .choices__button,
.customer-provider-services-field .choices__button:hover,
.customer-provider-services-field .choices__button:focus {
    min-height: 0;
    padding: 0 0 0 1rem;
    border-radius: 0;
    background-color: transparent;
    box-shadow: none;
}

.seller-performance-placeholder {
    min-height: 90px;
}

.seller-activity-areas-field {
    display: grid;
    gap: 0.25rem;
}

.seller-activity-areas-field > span {
    color: var(--vz-heading-color);
    font-size: 0.8rem;
    font-weight: 500;
}

.seller-activity-areas-field > small {
    font-size: 0.7rem;
}

.seller-activity-areas-field .choices__button,
.seller-activity-areas-field .choices__button:hover,
.seller-activity-areas-field .choices__button:focus {
    min-height: 0;
    padding: 0 0 0 1rem;
    border-radius: 0;
    background-color: transparent;
    box-shadow: none;
}

.seller-goals-table .seller-goal-month {
    min-width: 7.5rem;
    max-width: 9rem;
}

.seller-goals-table .seller-money-input {
    min-width: 8rem;
    max-width: 11rem;
    text-align: right;
}

.seller-goals-table input[readonly] {
    background: var(--vz-light);
    color: var(--vz-secondary-color);
}

.customer-print-sheet {
    max-width: 1180px;
    min-height: 100%;
    padding: 2.25rem;
    background: #fff;
}

.customer-print-toolbar {
    min-height: 78px;
    padding: 1rem 1.5rem;
}

.customer-print-toolbar-title {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.customer-print-toolbar-title p {
    font-size: 0.82rem;
}

.customer-print-header {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--vz-border-color);
}

.customer-print-logo {
    width: 150px;
    max-height: 72px;
    object-fit: contain;
    object-position: left center;
}

.customer-print-header h1 {
    margin: 0;
    color: var(--vz-heading-color);
    font-size: 1.5rem;
    font-weight: 600;
}

.customer-print-header p,
.customer-print-meta {
    color: var(--vz-secondary-color);
}

.customer-print-header p {
    margin: 0.35rem 0 0;
}

.customer-print-meta {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 0;
    font-size: 0.8rem;
}

.customer-print-table {
    font-size: 0.82rem;
}

.customer-print-table thead th {
    background: #f3f6f9;
    color: var(--vz-heading-color);
    font-weight: 600;
}

@media print {
    @page {
        size: A4 portrait;
        margin: 0;
    }

    html,
    body {
        width: 210mm !important;
        min-height: 297mm !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body * {
        visibility: hidden !important;
    }

    #customerPrintModal,
    #customerPrintModal *,
    #sellerPrintModal,
    #sellerPrintModal *,
    #product-technical-preview-modal,
    #product-technical-preview-modal *,
    #quoteCalculatorPrintModal,
    #quoteCalculatorPrintModal * {
        visibility: visible !important;
    }

    #customerPrintModal,
    #sellerPrintModal,
    #product-technical-preview-modal,
    #quoteCalculatorPrintModal {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: auto !important;
        overflow: visible !important;
    }

    #customerPrintModal .modal-dialog,
    #customerPrintModal .modal-content,
    #customerPrintModal .modal-body,
    #sellerPrintModal .modal-dialog,
    #sellerPrintModal .modal-content,
    #sellerPrintModal .modal-body,
    #product-technical-preview-modal .modal-dialog,
    #product-technical-preview-modal .modal-content,
    #product-technical-preview-modal .modal-body,
    #quoteCalculatorPrintModal .modal-dialog,
    #quoteCalculatorPrintModal .modal-content,
    #quoteCalculatorPrintModal .modal-body {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        background: #fff !important;
    }

    .customer-print-actions,
    .modal-backdrop {
        display: none !important;
    }

    .customer-print-sheet {
        max-width: none;
        min-height: 0;
        padding: 0;
    }

    .quote-calculator-print-sheet {
        max-width: none;
        min-height: 0;
        padding: 0 !important;
        box-shadow: none !important;
    }

    .product-technical-print-sheet {
        width: 210mm;
        min-height: 297mm;
        margin: 0 !important;
        padding: 10mm;
        border: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
        color: #111827 !important;
        page-break-after: avoid;
        break-after: avoid;
    }

    .product-technical-print-sheet,
    .product-technical-print-sheet * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

@media (max-width: 575.98px) {
    .customer-print-toolbar {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .customer-print-toolbar-buttons {
        align-self: flex-end;
    }
}

.permission-sections {
    display: grid;
    gap: 0;
}

.permission-section-divider {
    margin: 0.75rem 0 1.4rem;
    opacity: 1;
    border-color: var(--vz-border-color);
}

.permission-section-header {
    margin-bottom: 0.75rem;
}

.permission-section-title {
    color: var(--vz-heading-color);
    font-size: 0.95rem;
    font-weight: 600;
}

.quote-editor {
    overflow: hidden;
}

.quote-head {
    display: grid;
    grid-template-columns: 124px minmax(0, 1fr);
    gap: 0.65rem;
    align-items: stretch;
}
.sales-head {
    display: grid;
    grid-template-columns: 124px minmax(0, 1fr);
    gap: 0.65rem;
    align-items: stretch;
    height: 90px;
}

.quote-number-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 96px;
    padding: 1.75rem 0.7rem;
    background: #d9f0f2;
    color: #111827;
    text-align: center;
}

.quote-number-panel span {
    font-size: 0.9rem;
    line-height: 1.1;
}

.quote-number-panel strong {
    display: block;
    margin-top: 0.15rem;
    font-size: 1.05rem;
    font-weight: 700;
}

.quote-date-display {
    margin-top: auto;
    padding-top: 0.65rem;
    font-size: 0.9rem;
    font-weight: 700;
}

.quote-head-fields {
    min-width: 0;
}

.quote-head-fields .form-label {
    margin-bottom: 0.25rem;
    color: var(--vz-heading-color);
    font-size: 0.9rem;
    font-weight: 400;
}

.quote-head-fields .form-control,
.quote-head-fields .form-select {
    height: 36px;
    border-color: #d0d7de;
    font-size: 0.9rem;
}

.quote-head-fields .form-control::placeholder {
    color: #767f8d;
    font-size: 0.95rem;
    font-weight: 600;
}

.quote-client-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 236px;
    gap: 0.75rem;
    align-items: end;
    margin-bottom: 0.45rem;
}

.quote-client-field {
    position: relative;
    min-width: 0;
}

.quote-customer-lookup {
    position: relative;
}

.quote-customer-id-badge {
    font-size: 13px;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 2;
    line-height: 15px;
}

.quote-customer-lookup.has-customer-badge .form-control {
    padding-right: 112px;
}

.sale-payment-date-wrap {
    position: relative;
}

.sale-payment-date-wrap.has-paid-badge .form-control {
    padding-right: 68px;
}

.sale-payment-date-wrap.has-check-badge .form-control {
    padding-right: 116px;
}

.sale-payment-paid-badge {
    font-size: 11px;
    line-height: 14px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 2;
}

.sale-payment-check-group {
    position: absolute;
    top: 50%;
    right: 8px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    transform: translateY(-50%);
}

.sale-payment-check-group .sale-payment-paid-badge {
    position: static;
    transform: none;
}

.sale-payment-check-badge {
    font-weight: 600;
    white-space: nowrap;
}

.sale-payment-check-button {
    display: inline-grid;
    width: 18px;
    height: 18px;
    padding: 0;
    place-items: center;
    border: 1px solid #16a34a;
    border-radius: 50%;
    background: #ecfdf3;
    color: #16a34a;
    font-size: 13px;
    line-height: 1;
}

.sale-payment-check-button:hover,
.sale-payment-check-button:focus {
    background: #16a34a;
    color: #fff;
}

.quote-customer-results {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 20;
    overflow: hidden;
    border: 1px solid var(--vz-border-color);
    border-radius: 0.35rem;
    background: var(--vz-card-bg);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}

.quote-customer-result {
    display: block;
    width: 100%;
    min-height: 0;
    padding: 0.55rem 0.75rem;
    border: 0;
    border-bottom: 1px solid var(--vz-border-color);
    background: transparent;
    color: var(--vz-body-color);
    text-align: left;
}

.quote-customer-result:last-child {
    border-bottom: 0;
}

.quote-customer-result:hover,
.quote-customer-result.active {
    background: var(--vz-light);
    color: var(--vz-body-color);
}

.quote-customer-result:focus {
    color: var(--vz-body-color);
    outline: 0;
}

.quote-customer-result strong {
    display: block;
    color: var(--vz-heading-color);
    font-size: 0.8125rem;
    font-weight: 600;
}

.quote-customer-result span {
    display: block;
    margin-top: 0.15rem;
    color: var(--vz-secondary-color);
    font-size: 0.75rem;
}

.quote-client-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.35rem;
    color: var(--vz-heading-color);
    font-size: 1.15rem;
    vertical-align: middle;
}

.quote-product-entry {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 112px 112px auto;
    gap: 0.75rem;
    align-items: end;
    padding: 0.55rem 0.65rem 0.7rem;
    background: #d9f0f2;
}

.quote-product-entry:has(.quote-product-observation-field) {
    grid-template-columns: minmax(280px, 1fr) 112px 112px 150px auto;
}

.quote-product-observation-field {
    width: 150px;
}

.quote-product-entry .form-label {
    margin-bottom: 0;
    color: var(--vz-heading-color);
    font-size: 0.9rem;
    font-weight: 400;
}

.quote-product-entry .form-control {
    height: 34px;
    border-color: #c4ccd5;
    font-size: 0.86rem;
}

.quote-product-field,
.quote-product-lookup {
    position: relative;
    min-width: 0;
}

.quote-product-results {
    position: absolute;
    top: calc(100% + 3px);
    left: 0;
    right: 0;
    z-index: 25;
    overflow: auto;
    max-height: 330px;
    border: 1px solid #b7bfc7;
    background: var(--vz-card-bg);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.14);
}

.quote-product-result {
    display: block;
    width: 100%;
    min-height: 0;
    padding: 0.45rem 0.65rem;
    border: 0;
    border-bottom: 1px solid #c7c7c7;
    background: #fff;
    color: var(--vz-body-color);
    text-align: left;
}

.quote-product-result.active {
    background: #fffde0;
    color: var(--vz-body-color);
    outline: 0;
}

.quote-product-result:hover,
.quote-product-result:focus {
    color: var(--vz-body-color);
    outline: 0;
}

.quote-product-result strong {
    display: block;
    color: var(--vz-heading-color);
    font-size: 0.94rem;
    font-weight: 500;
    line-height: 1.2;
}

.quote-product-result span,
.quote-product-result small {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
    color: var(--vz-body-color);
    font-size: 0.8rem;
    line-height: 1.25;
}

.quote-product-result em {
    color: var(--vz-secondary-color);
    font-style: normal;
}

.quote-product-param {
    display: inline-flex;
    align-items: center;
    min-height: 18px;
    padding: 0 0.35rem;
    border: 1px solid #b7bfc7;
    background: #fff;
    color: var(--vz-body-color);
}

.quote-product-color-param {
    color: #111827;
    font-weight: 600;
}

.quote-add-item-wrap {
    display: flex;
    align-items: end;
    gap: 0.5rem;
}

.quote-add-item-button,
.quote-calculate-product-button {
    height: 38px;
    white-space: nowrap;
}

.quote-product-calculator-modal .modal-header {
    padding: 0.55rem 0.85rem;
    background: var(--vz-indigo);
    color: #fff;
}

.quote-product-calculator-modal .modal-title {
    color: #fff;
    font-size: 1.35rem;
    font-weight: 600;
}

.quote-product-calculator-modal .btn-close {
    background-color: transparent;
    filter: invert(1) grayscale(100%) brightness(200%);
    opacity: 1;
}

.quote-calculator-grid {
    display: grid;
    grid-template-columns: 116px minmax(205px, 1fr) minmax(200px, 0.8fr) minmax(200px, 0.8fr);
    gap: 0.75rem;
    align-items: end;
}
.quote-calculator-grid-2 {
    display: grid;
    grid-template-columns:  minmax(200px, 1fr) minmax(200px, 1fr);
    gap: 0.75rem;
    align-items: end;
    padding: 15px 0px;
}
.quote-calculator-grid-3 {
    display: grid;
    grid-template-columns: minmax(125px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr);
    gap: 0.75rem;
    align-items: end;
    padding: 6px 0px;
}

.quote-calculator-grid label {
    margin: 0;
}

.quote-calculator-grid label span {
    display: block;
    margin-bottom: 0.2rem;
    color: var(--vz-heading-color);
    font-size: 0.86rem;
    font-weight: 400;
}

.quote-calculator-grid .form-control,
.quote-calculator-grid .form-select {
    height: 34px;
    border-color: #c4ccd5;
    font-size: 0.86rem;
}

.quote-calculator-product-field {
    grid-column: span 3;
}

.quote-calculator-product-lookup {
    position: relative;
}

.quote-calculator-product-results {
    position: absolute;
    top: calc(100% + 3px);
    left: 0;
    right: 0;
    z-index: 40;
    overflow: auto;
    max-height: 310px;
    border: 1px solid #b7bfc7;
    background: var(--vz-card-bg);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.14);
}

.quote-calculator-action {
    display: flex;
    align-items: end;
}

.quote-calculator-action .btn {
    height: 40px;
    width: 90%;
    white-space: nowrap;
    position: relative;
    top: -8px;
}

.quote-calculator-preview {
    margin-top: 1rem;
    padding: 0;
    border: 0;
    background: #fff;
}

.quote-calculator-summary-table {
    display: table;
    grid-template-columns: 78px minmax(360px, 1fr) 124px 150px;
    border: 1px solid #3f3f3f;
    color: #111827;
    font-size: 1rem;
}

.quote-calculator-summary-head {
    padding: 0.42rem 0.85rem;
    border-right: 1px solid #898989;
    background: #302f91;
    color: #fff;
    font-size: 13px;
    line-height: 1.1;
}

.quote-calculator-summary-head:last-of-type {
    border-right: 0;
}

.quote-calculator-summary-cell {
    min-height: 34px;
    padding: 0.28rem 0.65rem;
    border-top: 1px solid #707070;
    border-right: 1px solid #707070;
    background: #fff;
    line-height: 1.25;
}

.quote-calculator-summary-cell:nth-child(4n) {
    border-right: 0;
}

.quote-calculator-product-quantity,
.quote-calculator-product-name {
    font-size: 14px;
}

.quote-calculator-product-name {
    overflow: hidden;
}

.quote-calculator-money {
    font-size: 1.25rem;
    font-weight: 700;
}

.quote-calculator-product-variation {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.18rem;
}

.quote-calculator-product-variation .quote-product-param {
    min-height: 17px;
    font-size: 0.74rem;
    font-weight: 500;
}

.quote-calculator-composition-line {
    font-size: 1rem;
}

.quote-calculator-composition-line strong,
.quote-calculator-graphic-detail strong {
    font-weight: 700;
}

.quote-calculator-empty-cell {
    border-top: 1px solid #707070;
    border-bottom: 0;
}

.quote-calculator-graphic-spacer,
.quote-calculator-graphic-detail,
.quote-calculator-graphic-values {
    min-height: 108px;
    border-bottom: 1px solid #707070;
}

.quote-calculator-graphic-detail,
.quote-calculator-graphic-values {
    font-size: 1.04rem;
}

.quote-calculator-graphic-values {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.15rem;
    font-weight: 700;
}

.quote-calculator-summary-actions {
    grid-column: 1 / 3;
    display: flex;
    gap: 0.65rem;
    align-items: center;
    padding: 1.15rem 1rem;
    border-right: 1px solid #707070;
    background: #fff;
}

.quote-calculator-summary-actions .btn {
    min-width: 138px;
}

.quote-calculator-summary-total-label,
.quote-calculator-summary-total {
    min-height: 66px;
    padding: 0.75rem 0.95rem;
    border-top: 1px solid #707070;
    background: #fff;
}

.quote-calculator-summary-total-label {
    border-right: 1px solid #707070;
}

.quote-calculator-summary-total {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-right: 1px solid #707070;
    font-size: 20px;
    font-weight: 700;
    border-top: none;
}

.quote-calculator-summary-total:last-child {
    border-right: 0;
}

.quote-calculator-preview table.quote-calculator-summary-table {
    display: table;
    min-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border: 1px solid #3f3f3f;
    background: #fff;
    color: #202124;
}

.quote-calculator-summary-table .quote-calculator-col-quantity {
    width: 9%;
}

.quote-calculator-summary-table .quote-calculator-col-product {
    width: 63%;
}

.quote-calculator-summary-table .quote-calculator-col-unit {
    width: 12%;
}

.quote-calculator-summary-table .quote-calculator-col-total {
    width: 16%;
}

.quote-calculator-summary-table th {
    padding: 0.32rem 0.75rem;
    border-right: 1px solid #25255f;
    background: #302f91;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.15;
}

.quote-calculator-summary-table th:last-child {
    border-right: 0;
}

.quote-calculator-summary-table td {
    padding: 0.22rem 0.65rem;
    border-top: 1px solid #666;
    border-right: 1px solid #666;
    vertical-align: top;
    line-height: 1.18;
    font-size: 15px;
}

.quote-calculator-summary-table td:last-child {
    border-right: 0;
}

.quote-calculator-product-row td {
    vertical-align: middle;
}

.quote-calculator-quantity-cell,
.quote-calculator-product-title {
    font-size: 15px;
}

.quote-calculator-product-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.quote-calculator-textile-row td {
    min-height: 34px;
    font-size: 1rem;
    vertical-align: middle;
}

.quote-calculator-graphic-row td {
    min-height: 110px;
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid #666;
}

.quote-calculator-setup-row td {
    background: #f8fafc;
    font-size: 0.9rem;
}

.quote-calculator-setup-mode {
    display: inline-block;
    margin-left: 0.35rem;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 400;
}

.quote-calculator-summary-table .quote-calculator-money {
    font-size: 14px;
    vertical-align: middle;
}

.quote-calculator-summary-table .quote-calculator-graphic-values {
    font-size: 15px;
    vertical-align: text-bottom;
    padding-top: 20px;
    display: table-cell;
}

.quote-calculator-summary-table .quote-calculator-graphic-values div,
.quote-calculator-summary-table .quote-calculator-graphic-detail div {
    min-height: 1.32rem;
}

.quote-calculator-summary-table tfoot td {
    height: 64px;
    border-top: 1px solid #666;
    vertical-align: middle;
}

.quote-calculator-summary-table tfoot .quote-calculator-summary-actions {
    display: table-cell;
    padding: 0.9rem 1rem;
    border-right: 1px solid #666;
}

.quote-calculator-summary-table tfoot .quote-calculator-summary-actions .btn {
    min-width: 138px;
    margin-right: 0.65rem;
}

.quote-calculator-summary-table tfoot .quote-calculator-summary-total {
    display: table-cell;
    padding: 0.55rem 0.95rem;
    border-right: 1px solid #666;
    font-size: 16px;
    font-weight: 700;
}

.quote-calculator-summary-table tfoot .quote-calculator-summary-total:last-child {
    border-right: 0;
}

.quote-calculator-contact-action {
    width: 36px;
    min-width: 36px !important;
    height: 36px;
    margin-right: 0.35rem;
}

.quote-calculator-print-sheet {
    max-width: 980px;
    padding: 1.5rem;
}

.quote-calculator-print-header {
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--vz-border-color);
}

.quote-calculator-print-title {
    margin-bottom: 1rem;
    text-align: center;
}

.quote-calculator-print-title h2 {
    margin: 0;
    color: var(--vz-heading-color);
    font-size: 1.35rem;
    font-weight: 600;
}

.quote-calculator-print-frame .quote-calculator-summary-table {
    width: 100%;
}

.quote-calculator-print-total-label {
    padding: 0.9rem 1rem;
    border-top: 1px solid #666;
    border-right: 1px solid #666;
    vertical-align: middle;
    font-size: 1.1rem;
}

.quote-personalization-area h5 {
    margin-bottom: 0.75rem;
    font-size: 1rem;
    font-weight: 600;
}

.quote-personalization-grid {
    display: inline-block;
    grid-template-columns: repeat(6, minmax(120px, 1fr));
    gap: 0.75rem;
    border: solid 1px gray;
    border-radius: 5px;
    padding: 7px 10px;
}

.quote-personalization-grid label {
    margin: 0px 12px;
}

.quote-personalization-grid span {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--vz-heading-color);
    font-size: 0.82rem;
}

.quote-personalization-grid .form-control,
.quote-personalization-grid .form-select {
    height: 34px;
    background-color: #f8fafc;
}

.quote-items-table thead th {
    background: #2b8ca3;
    color: #fff;
    font-size: 0.78rem;
    padding: 0.35rem 0.55rem;
    white-space: nowrap;
    border-color: #7d8a94;
}

.quote-items-sort {
    cursor: pointer;
    user-select: none;
}

.quote-items-table td {
    padding: 0.45rem 0.55rem;
    border-color: #8b98a3;
}

.quote-items-table {
    border-color: #8b98a3;
}

.quote-item-column-index {
    width: 34px;
}

.quote-item-column-code {
    width: 104px;
}

.quote-item-column-description {
    min-width: 420px;
}

.quote-item-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    min-height: 0;
    border: 0;
    background: transparent !important;
    color: #111827 !important;
    padding: 0;
    border-radius: 0;
}

.quote-item-action:hover,
.quote-item-action:focus {
    color: #2b8ca3 !important;
    background: transparent !important;
}

.quote-item-params {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.15rem;
}

.quote-item-param {
    display: inline-flex;
    align-items: center;
    min-height: 18px;
    padding: 0 0.35rem;
    border: 1px solid #aeb8c2;
    background: #fff;
    color: var(--vz-body-color);
    font-size: 0.75rem;
    font-weight: 500;
}

.quote-item-color-param {
    font-weight: 600;
}

.quote-freight-calculator {
    color: var(--vz-primary);
    font-size: 0.95rem;
    vertical-align: -1px;
}

.quote-items-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    border-right: 1px solid #8b98a3;
    border-bottom: 1px solid #8b98a3;
    border-left: 1px solid #8b98a3;
    background: #fff;
}

.quote-summary-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: end;
    padding: 0.65rem 0.75rem;
}

.quote-summary-controls label {
    width: 118px;
    margin: 0;
}

.quote-summary-controls span {
    /* display: block; */
    margin-bottom: 0.2rem;
    color: var(--vz-heading-color);
    font-size: 0.88rem;
}

.quote-summary-controls .form-control {
    height: 34px;
    font-size: 0.85rem;
}

.quote-total-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    padding: 0.65rem 1.25rem;
    border-left: 1px solid var(--vz-border-color);
}

.quote-total-box span {
    color: #111827;
    font-size: 1.25rem;
}

.quote-total-box strong {
    color: #000;
    font-size: 2rem;
    font-weight: 500;
}

.quote-terms-area {
    display: grid;
    grid-template-columns: minmax(260px, 2fr) minmax(360px, 1fr) minmax(360px, 1fr);
    gap: 1rem;
    padding: 0.85rem 0;
}
.sales-terms-area {
    display: grid;
    grid-template-columns: minmax(260px, 2fr) minmax(360px, 1fr);
    gap: 1rem;
    padding: 0.85rem 0;
}

.quote-terms-area .form-label,
.quote-term-fields span {
    display: block;
    margin-bottom: 0.2rem;
    color: var(--vz-heading-color);
    font-size: 0.86rem;
    font-weight: 400;
}

.quote-notes-field textarea {
    min-height: 82px;
    resize: vertical;
}

.quote-term-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    align-items: baseline;
}

.quote-term-fields label {
    margin: 0;
}

.quote-file-field {
    grid-column: 1 / -1;
}

.quote-attachment-preview {
    margin-top: 0.45rem;
}

.quote-attachment-link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    max-width: 100%;
    padding: 0.35rem 0.5rem;
    border: 1px solid #d5dbe3;
    border-radius: 6px;
    background: #f8fafc;
    color: #111827;
    text-decoration: none;
}

.quote-attachment-link:hover {
    border-color: #b8c0c8;
    background: #fff;
    color: #111827;
}

.quote-attachment-thumb {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 42px;
    flex: 0 0 54px;
    overflow: hidden;
    border-radius: 4px;
    background: #fff;
    color: #dc2626;
    font-size: 1.65rem;
}

.quote-attachment-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.quote-attachment-name {
    min-width: 0;
    overflow: hidden;
    color: #374151;
    font-size: 0.78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quote-term-fields .form-control {
    height: 34px;
    font-size: 0.85rem;
}

.quote-billing-area {
    margin-top: 0.6rem;
    padding-top: 0.75rem;
}

.quote-billing-area h5 {
    margin-bottom: 0.55rem;
    color: #111827;
    font-size: 1.05rem;
    font-weight: 600;
}

.quote-billing-plan {
    max-width: 260px;
}

.quote-billing-plan .form-label {
    margin-bottom: 0.25rem;
    font-size: 0.86rem;
    font-weight: 400;
}

.quote-billing-table {
    border-color: #b8c0c8;
    font-size: 0.82rem;
}

.quote-billing-table thead th {
    padding: 0.45rem 0.55rem;
    border-color: #b8c0c8;
    background: #d9d9d9;
    color: #111827;
    font-weight: 500;
}

.quote-billing-table tbody td {
    padding: 0.25rem 0.45rem;
    border-color: #c7cdd3;
    vertical-align: middle;
}

.quote-billing-table .form-control,
.quote-billing-table .form-select,
.quote-billing-table .form-control-plaintext {
    min-height: 28px;
    height: 28px;
    border-color: transparent;
    background-color: transparent;
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
    font-size: 0.82rem;
    box-shadow: none;
}

.quote-billing-table .form-control:focus,
.quote-billing-table .form-select:focus {
    border-color: transparent;
    background-color: transparent;
    box-shadow: none;
}

.quote-billing-table .form-control-plaintext {
    padding-right: 0.25rem;
    padding-left: 0.25rem;
}

.quote-billing-document {
    text-align: right;
}

.sale-term-fields {
    grid-template-columns: 110px 150px 150px;
}

.quote-delivery-fields,
.sale-term-fields.quote-delivery-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sale-term-fields .form-select {
    height: 34px;
    font-size: 0.85rem;
}

.sale-personalization-top {
    display: flex;
    gap: 0.85rem;
    align-items: stretch;
}

.sale-personalization-top .quote-personalization-grid {
    flex: 0 0 500px;
    margin: 0;
}

.sale-attachments-frame {
    flex: 1 1 auto;
    min-width: 260px;
    border: 1px solid var(--vz-border-color);
    border-radius: 6px;
    background: var(--vz-card-bg);
    padding: 0.55rem 0.65rem;
}

.sale-attachments-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 0.45rem;
}

.sale-attachments-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    min-height: 30px;
    align-items: center;
}

.sale-attachment-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    max-width: 190px;
    min-height: 26px;
    padding: 0.25rem 0.45rem;
    border: 1px solid var(--vz-border-color);
    border-radius: 5px;
    background: var(--vz-light);
    color: var(--vz-body-color);
    font-size: 0.78rem;
    line-height: 1;
}

.sale-attachment-pill i {
    color: #2f318b;
    font-size: 1rem;
}

.sale-attachment-pill span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sale-attachments-empty {
    color: var(--vz-secondary-color);
    font-size: 0.8rem;
}

.sale-personalization-lines {
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 0.65rem 0.8rem;
    align-items: end;
}

.sale-personalization-lines label {
    margin: 0;
}

.sale-personalization-lines span {
    display: block;
    margin-bottom: 0.2rem;
    color: var(--vz-heading-color);
    font-size: 0.86rem;
    font-weight: 400;
}

.sale-position-small .form-control {
    text-align: center;
}

.sale-position-description {
    min-width: 0;
}

.quantity-discount-tiers {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 0.45rem 0;
}

.quantity-discount-tier-row {
    display: flex;
    align-items: end;
    gap: 0.35rem;
    padding: 0 0.65rem;
    border-left: 1px solid #d5dbe3;
}

.quantity-discount-tier-row:first-child {
    padding-left: 0;
    border-left: 0;
}

.quantity-discount-tier-row label {
    margin: 0;
}

.quantity-discount-tier-row .quantity-discount-quantity {
    width: 100px;
}

.quantity-discount-tier-row .quantity-discount-percent-field input {
    width: 68px;
}

.quote-calculator-discount-row td {
    background: #fff;
    border-top: 1px solid #6b7280 !important;
    color: #111827;
}

.quote-calculator-discount-row .quote-calculator-money {
    font-weight: 500;
}

.customer-history-modal-dialog {
    max-width: min(1180px, calc(100vw - 24px));
}

.customer-history-modal {
    border: 1px solid #808080;
    border-radius: 4px;
    color: #001b45;
    font-size: 0.8rem;
}

.customer-history-header {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 0.35rem 0.6rem;
    border-bottom: 1px solid #a7a7a7;
    background: #fff;
}

.customer-history-brand {
    display: flex;
    align-items: center;
    color: #008bd2;
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.1;
    min-height: 46px;
    border-right: 3px solid #168fc9;
    width: 150px;
}

.customer-history-headline h3 {
    color: #111;
    font-size: 1.15rem;
    font-weight: 700;
    text-transform: uppercase;
}

.customer-history-headline p {
    color: #34436a;
    font-size: 0.92rem;
    font-weight: 500;
}

.customer-history-body {
    padding: 0.45rem 0.5rem 0.55rem;
    background: #f8f8f8;
}

.customer-history-summary {
    display: grid;
    grid-template-columns: 1.05fr 1.05fr 1fr 1fr 0.52fr;
    gap: 0.55rem;
    margin-bottom: 0.45rem;
    padding: 0.35rem 0.45rem;
    border-bottom: 1px solid #d4d7df;
    background: #f7f7f7;
}

.customer-history-summary-card {
    position: relative;
    display: grid;
    min-height: 78px;
    align-content: center;
    padding: 0.65rem 3.1rem 0.65rem 0.8rem;
    border: 1px solid #e3e6ee;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.08);
}

.customer-history-summary-card span {
    color: #97999f;
    font-size: 0.702rem;
    font-weight: 600;
    text-transform: uppercase;
}

.customer-history-summary-card strong {
    color: #1d1d24;
    font-size: 1rem;
    font-weight: 700;
    line-height: 2.35;
}

.customer-history-summary-card small {
    color: #24242c;
    font-size: 0.88rem;
    font-weight: 500;
}

.customer-history-summary-card i {
    position: absolute;
    top: 50%;
    right: 0.7rem;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
    color: #4974bf;
    font-size: 1.5rem;
}

.customer-history-summary-card.is-small {
    min-width: 150px;
}

.customer-history-fields label {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
    margin: 0;
    color: #000;
    line-height: 1.25;
}

.customer-history-fields strong,
.customer-history-fields em {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0.1rem 0.35rem;
    border: 1px dotted #555;
    background: #effaf6;
    color: #000076;
    font-style: normal;
    font-weight: 700;
}

.customer-history-fields strong.is-alert {
    background: #ffdada;
    color: #8a0000;
}

.customer-history-top-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.55rem;
    margin-bottom: 0.45rem;
}

.customer-history-panel,
.customer-history-section {
    border: 1px solid #bdbdbd;
    background: #fff;
}

.customer-history-panel h4,
.customer-history-section h4 {
    margin: 0;
    padding: 0.25rem 0.45rem;
    color: #e00000;
    font-size: 1rem;
    font-weight: 700;
}

.customer-history-financial-panel h4 {
    display: inline-block;
    min-width: 98%;
    margin: 0 0 0 0.65rem;
    padding: 0.55rem 0 0.24rem;
    border-bottom: 1px solid #6f6f6f;
    color: #222;
    font-size: 1.02rem;
}

.customer-history-financial {
    display: grid;
    grid-template-columns: minmax(330px, 0.9fr) minmax(520px, 1.25fr);
    gap: 0.9rem;
    min-height: 172px;
    padding: 0.25rem 0.8rem 0.65rem;
}

.customer-history-fields {
    display: grid;
    align-content: start;
    gap: 0.24rem;
    padding: 0.3rem 0.9rem 0.1rem 0;
    border-right: 1px dotted #6f6f6f;
}

.customer-history-finance-row {
    display: grid;
    grid-template-columns: minmax(130px, 1fr) 76px 86px;
    gap: 0.45rem;
    align-items: center;
    color: #1d1d24;
    font-size: 0.8rem;
}

.customer-history-finance-row span {
    color: #222;
    white-space: nowrap;
}

.customer-history-finance-row strong,
.customer-history-finance-row em {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 23px;
    padding: 0.08rem 0.35rem;
    border: 1px solid #6f6f6f;
    border-radius: 3px;
    background: #f6f7f9;
    color: #283d7a;
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 700;
}

.customer-history-finance-row em {
    border: 0;
    background: transparent;
    color: #a70000;
    font-size: 0.76rem;
    justify-content: flex-start;
}

.customer-history-finance-row strong.is-money {
    min-width: 142px;
}

.customer-history-finance-row strong.is-ok {
    background: #e7faf4;
    color: #334b8e;
}

.customer-history-finance-row strong.is-alert {
    background: #ffe1e1;
    color: #9b0000;
}

.customer-history-financial-analysis {
    display: grid;
    grid-template-columns: minmax(180px, 0.74fr) minmax(120px, 0.48fr) minmax(250px, 1fr);
    gap: 0.8rem;
    align-items: center;
    min-width: 0;
}

.customer-history-payment-rates {
    display: grid;
    gap: 0.4rem;
    align-content: start;
    align-self: start;
    padding-top: 0.25rem;
}

.customer-history-payment-rates div {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) 52px;
    align-items: center;
    gap: 0.45rem;
    color: #1d1d24;
    font-size: 0.8rem;
}

.customer-history-payment-rates span {
    white-space: nowrap;
}

.customer-history-payment-rates strong {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8792d;
    border-radius: 3px;
    background: #fff7df;
    color: #ef6c1b;
    font-size: 0.86rem;
    font-weight: 500;
}

.customer-history-risk-scale {
    display: grid;
    justify-items: start;
    gap: 0.16rem;
    align-self: center;
}

.customer-history-risk-scale span {
    color: #a1a6af;
    font-size: 0.66rem;
    font-style: italic;
}

.customer-history-risk-scale strong {
    display: inline-flex;
    min-width: 94px;
    min-height: 22px;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    font-size: 0.68rem;
    font-weight: 500;
}

.customer-history-risk-scale .is-bad {
    border: 1px solid #b03b45;
    background: #ffb4b8;
    color: #9d0010;
}

.customer-history-risk-scale .is-regular {
    border: 1px solid #f08b37;
    background: #ffe3c6;
    color: #ee6b1c;
}

.customer-history-risk-scale .is-good {
    border: 1px solid #2aa36b;
    background: #dcf8ec;
    color: #08a557;
}

.customer-history-gauge {
    width: 100%;
    min-width: 230px;
    height: 150px;
}

.customer-history-section {
    margin-top: 0.65rem;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.customer-history-section h4 {
    padding: 0.55rem 0.75rem 0.4rem;
    border-bottom: 1px solid #eef0f4;
    color: #344054;
    font-size: 0.86rem;
    font-weight: 600;
}

.customer-history-scroll-table {
    max-height: 138px;
    overflow: auto;
    padding: 0;
}

.customer-history-scroll-table.is-occurrences {
    height: 156px;
    max-height: 156px;
    overflow-x: auto;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

#customerHistoryModal .customer-history-modal-dialog {
    height: calc(100vh - 1.5rem);
}

#customerHistoryModal .customer-history-modal {
    max-height: 100%;
}

#customerHistoryModal .customer-history-body {
    max-height: calc(100vh - 96px);
    overflow: hidden;
}

#customerHistoryModal .customer-history-scroll-table {
    height: 132px;
    max-height: 132px;
    overflow-x: auto;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

#customerHistoryModal .customer-history-scroll-table.is-occurrences {
    height: 148px;
    max-height: 148px;
}

#customerHistoryModal .customer-history-tabs-section {
    margin-top: 0.65rem;
    overflow: hidden;
}

#customerHistoryModal .customer-history-tabs {
    padding: 0 0.75rem;
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
}

#customerHistoryModal .customer-history-tabs .nav-link {
    color: #344054;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.55rem 0.85rem;
}

#customerHistoryModal .customer-history-tabs .nav-link.active {
    color: #405189;
}

#customerHistoryModal .customer-history-tab-content {
    padding: 0.65rem 0.75rem 0.75rem;
}

#customerHistoryModal .customer-history-tab-content .customer-history-scroll-table {
    height: 238px;
    max-height: 238px;
}

#customerHistoryModal .customer-history-tab-content .customer-history-scroll-table.is-occurrences {
    height: 238px;
    max-height: 238px;
}

.customer-history-table {
    color: #344054;
    font-size: 0.76rem;
}

.customer-history-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid #e5e7eb;
    background: #f3f6f9 !important;
    color: #495057;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: uppercase;
}

.customer-history-table tbody td {
    border-color: #eef0f4;
    padding: 0.42rem 0.55rem;
    color: #344054;
    vertical-align: middle;
}

.customer-history-table tbody tr:nth-child(odd) td,
.customer-history-table tbody tr:nth-child(even) td {
    background: #fff;
}

.customer-history-table tbody tr:hover td {
    background: #f8fafc;
    color: #111827;
}

@media (max-width: 767.98px) {
    .quote-head,
    .quote-client-row,
    .quote-product-entry {
        grid-template-columns: 1fr;
    }

    .quote-product-entry:has(.quote-product-observation-field) {
        grid-template-columns: 1fr;
    }

    .quote-product-observation-field {
        width: 100%;
    }

    .quantity-discount-tiers {
        gap: 0.45rem;
    }

    .quantity-discount-tier-row {
        width: 100%;
        padding: 0;
        border-left: 0;
    }

    .quote-number-panel {
        min-height: 96px;
    }

    .sale-editor .sales-head {
        grid-template-columns: 1fr;
        gap: 0.75rem;
        height: auto;
    }

    .sale-editor .quote-number-panel {
        grid-column: 1 / -1;
        min-height: 64px;
        padding: 0.85rem 0.75rem;
    }

    .sale-editor .quote-head-fields {
        width: 100%;
    }

    .sale-editor .quote-client-row {
        display: grid;
        grid-template-columns: 1fr !important;
        gap: 0.75rem;
    }

    .sale-editor .quote-client-row > * {
        grid-column: 1 / -1;
        min-width: 0;
    }

    .sale-editor .sales-terms-area,
    .sale-editor .quote-delivery-fields {
        grid-template-columns: 1fr !important;
    }

    .sale-editor .quote-delivery-fields > label {
        min-width: 0;
        width: 100%;
    }

    .quote-product-calculator-modal .modal-header {
        padding: 0.55rem 0.75rem;
    }

    .quote-product-calculator-modal .modal-title {
        font-size: 1rem;
        line-height: 1.2;
    }

    #saleProductCalculatorModal .modal-dialog {
        width: calc(100% - 1rem);
        max-width: calc(100% - 1rem);
        margin: 0.5rem auto;
    }

    #saleProductCalculatorModal .modal-body {
        padding: 0.75rem;
        max-height: calc(100vh - 86px);
        overflow-y: auto;
    }

    .quote-calculator-grid,
    .quote-calculator-grid-2,
    .quote-calculator-grid-3 {
        grid-template-columns: 1fr !important;
        gap: 0.65rem;
        padding: 0;
    }

    .quote-calculator-grid-2,
    .quote-calculator-grid-3 {
        margin-top: 0.65rem;
    }

    .quote-calculator-product-field {
        grid-column: 1 / -1;
    }

    .quote-calculator-grid label,
    .quote-calculator-grid-2 label,
    .quote-calculator-grid-3 label {
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .quote-calculator-grid .form-control,
    .quote-calculator-grid .form-select,
    .quote-calculator-grid-2 .form-control,
    .quote-calculator-grid-2 .form-select,
    .quote-calculator-grid-3 .form-control,
    .quote-calculator-grid-3 .form-select {
        width: 100%;
        height: 36px;
    }

    .quote-calculator-action {
        align-items: stretch;
    }

    .quote-calculator-action .btn {
        width: 100%;
        top: 0;
    }

    .quote-calculator-setup-options {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 0.55rem !important;
    }

    .quote-calculator-preview {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .quote-calculator-summary-table {
        width: max-content;
        min-width: 720px;
        max-width: none;
        table-layout: auto;
        font-size: 0.86rem;
    }

    .quote-calculator-summary-table th,
    .quote-calculator-summary-table td {
        white-space: nowrap;
    }

    .quote-calculator-summary-table .quote-calculator-product-cell,
    .quote-calculator-summary-table .quote-calculator-graphic-detail {
        min-width: 280px;
        white-space: normal;
    }

    #sale-calculator-print {
        display: none !important;
    }

    .quote-header-action-row {
        flex-wrap: nowrap !important;
        gap: 0.5rem !important;
        width: 100%;
    }

    .quote-header-menu-group {
        flex: 1 1 auto;
        flex-wrap: nowrap !important;
        min-width: 0;
    }

    .quote-header-menu-group > .badge {
        display: none !important;
    }

    .quote-header-save-group {
        flex: 0 0 auto;
    }

    #quote-back-button {
        display: none !important;
    }

    .customer-actions-card #back-button-top {
        display: none !important;
    }

    .customer-actions-card .seller-back-button-top {
        display: none !important;
    }

    .product-actions-card .product-form-secondary-actions,
    .product-actions-card .product-form-back-button {
        display: none !important;
    }

    #save-quote-button,
    .customer-actions-card button[form="customer-form"],
    .customer-actions-card button[form="seller-form"],
    .product-actions-card button[form="product-form"] {
        white-space: nowrap;
    }

    #sale-back-button {
        display: none !important;
    }

    .sale-header-save-group {
        width: 100%;
    }

    .sale-header-save-group button[form="sale-form"] {
        width: 100%;
        justify-content: center;
        white-space: nowrap;
    }

    .quote-items-summary {
        grid-template-columns: 1fr;
    }

    .quote-total-box {
        border-top: 1px solid var(--vz-border-color);
        border-left: 0;
    }

    .quote-terms-area,
    .quote-term-fields {
        grid-template-columns: 1fr;
    }

    .sale-personalization-lines {
        grid-template-columns: 1fr;
    }

    .sale-personalization-top {
        flex-direction: column;
    }

    .sale-personalization-top .quote-personalization-grid {
        flex-basis: auto;
    }

    .customer-history-header {
        grid-template-columns: 1fr auto;
    }

    .customer-history-headline {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .customer-history-summary,
    .customer-history-top-grid,
    .customer-history-financial,
    .customer-history-financial-analysis,
    .customer-history-fields {
        border-right: 0;
        border-bottom: 1px dotted #6f6f6f;
        padding-right: 0;
        padding-bottom: 0.65rem;
    }

    .customer-history-financial-panel h4 {
        min-width: 0;
        width: calc(100% - 1.3rem);
    }

    #customerHistoryModal .customer-history-modal-dialog {
        width: calc(100% - 0.75rem);
        max-width: calc(100% - 0.75rem);
        height: calc(100vh - 0.75rem);
        margin: 0.375rem auto;
    }

    #customerHistoryModal .customer-history-modal {
        max-width: 100%;
        overflow: hidden;
    }

    #customerHistoryModal .customer-history-header {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.55rem;
        padding: 0.55rem 0.65rem;
    }

    #customerHistoryModal .customer-history-brand {
        width: auto;
        min-height: 0;
        border-right: 0;
        font-size: 1rem;
    }

    #customerHistoryModal .customer-history-headline {
        margin-left: 0 !important;
        min-width: 0;
    }

    #customerHistoryModal .customer-history-headline h3 {
        font-size: 0.95rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #customerHistoryModal .customer-history-headline p {
        font-size: 0.78rem;
        line-height: 1.25;
    }

    #customerHistoryModal .customer-history-body {
        max-height: calc(100vh - 78px);
        overflow-x: hidden;
        overflow-y: auto;
        padding: 0.5rem;
        -webkit-overflow-scrolling: touch;
    }

    #customerHistoryModal .customer-history-summary {
        grid-template-columns: 1fr;
        gap: 0.45rem;
        padding: 0 0 0.5rem;
    }

    #customerHistoryModal .customer-history-summary-card {
        min-height: 58px;
        padding: 0.55rem 2.6rem 0.55rem 0.65rem;
    }

    #customerHistoryModal .customer-history-summary-card strong {
        line-height: 1.35;
    }

    #customerHistoryModal .customer-history-financial {
        grid-template-columns: 1fr;
        gap: 0.65rem;
        padding: 0.35rem 0.6rem 0.7rem;
    }

    #customerHistoryModal .customer-history-fields {
        border-right: 0;
        border-bottom: 1px dotted #6f6f6f;
        padding: 0 0 0.65rem;
    }

    #customerHistoryModal .customer-history-finance-row,
    #customerHistoryModal .customer-history-payment-rates div {
        grid-template-columns: minmax(0, 1fr) auto auto;
        gap: 0.35rem;
    }

    #customerHistoryModal .customer-history-finance-row span,
    #customerHistoryModal .customer-history-payment-rates span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #customerHistoryModal .customer-history-financial-analysis {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }

    #customerHistoryModal .customer-history-gauge {
        min-width: 0;
        height: 150px;
    }

    #customerHistoryModal .customer-history-tabs {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 0 0.45rem;
        -webkit-overflow-scrolling: touch;
    }

    #customerHistoryModal .customer-history-tabs .nav-link {
        white-space: nowrap;
        padding: 0.5rem 0.65rem;
    }

    #customerHistoryModal .customer-history-tab-content {
        padding: 0.55rem 0.45rem 0.65rem;
    }

    #customerHistoryModal .customer-history-scroll-table,
    #customerHistoryModal .customer-history-tab-content .customer-history-scroll-table,
    #customerHistoryModal .customer-history-scroll-table.is-occurrences,
    #customerHistoryModal .customer-history-tab-content .customer-history-scroll-table.is-occurrences {
        height: auto;
        max-height: 260px;
        overflow-x: auto;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    #customerHistoryModal .customer-history-table {
        min-width: 720px;
    }

    #customerHistoryModal .customer-history-table th,
    #customerHistoryModal .customer-history-table td {
        white-space: nowrap;
    }
}