:root {
    --card: #ffffff;
    --border: #cfcfcf;
    --border-light: #d9d9d9;
    --header-bg: #F0F5EB;
    --primary: #FFA500;
    --text: #222222;
    --muted: #7b7b7b;
    --disabled-text: #b8b8b8;
    --control-bg: #efefef;
    --control-bg-hover: #e5e5e5;
    --control-bg-active: #dcdcdc;
}

.cards-section,
.wrapper {
    max-width: 1200px;
    margin: 0 auto;
}

.section-title,
.title {
    color: var(--primary);
    font-weight: 800;
    margin-bottom: 24px;
}

.section-title {
    font-size: 2rem;
}

.title {
    font-size: 2.2rem;
}


.protection-card {
    background: var(--card);
    border: 2px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 24px;
}

.protection-card__header,
.protection-card__body {
    display: grid;
    grid-template-columns: 45% 30% 25%;
}

.protection-card__header {
    background: var(--header-bg);
    color: var(--primary);
    font-weight: 800;
    min-height: 36px;
    align-items: center;
}

    .protection-card__header > div,
    .protection-card__body > div {
        padding: 0 22px;
    }

    .protection-card__header .col-title {
        font-size: 16px;
    }

    .protection-card__header .col-qty,
    .protection-card__header .col-value {
        text-align: center;
        font-size: 16px;
    }

.protection-card__body > div {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 24px;
    padding-bottom: 24px;
}

    .protection-card__body > div:not(:last-child) {
        border-right: 2px solid var(--border-light);
    }

.product-info {
    justify-content: flex-start !important;
    gap: 20px;
}

.product-image {
    width: 78px;
    flex-shrink: 0;
}

    .product-image img {
        width: 100%;
        object-fit: contain;
    }

.product-description {
    font-size: 12px;
    line-height: 1.35;
    font-weight: 700;
    max-width: 430px;
}

.value-box {
    flex-direction: column;
    text-align: center;
}

.value-total {
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
}

    .value-total strong {
        font-size: 28px;
        font-weight: 900;
        font-family: "MontSerrat Bold", sans-serif, serif;
        letter-spacing: -1px;
    }

    .value-total span {
        font-size: 1.2rem;
        font-weight: 900;
        font-family: "MontSerrat Bold", sans-serif, serif;
        letter-spacing: -1px;
    }

.value-unit {
    margin-top: 8px;
    font-size: 14px;
    font-weight: 700;
}

.value-total,
.value-total strong,
.value-total span,
.value-unit {
    color: var(--disabled-text);
}

.value-box.is-active .value-total,
.value-box.is-active .value-total strong,
.value-box.is-active .value-total span {
    color: #FFA500;
}

.value-box.is-active .value-unit {
    color: #000;
}


.distribution-table {
    width: 100%;
    background: var(--card);
}

.table-grid {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.table-grid th,
.table-grid td {
    padding: 18px 20px;
    background: #fff;
    vertical-align: middle;
    border: none;
}

    .table-grid thead th,
    .table-grid tbody td,
    .table-grid tfoot td {
        padding: 12px 20px;
        background: #fff;
    }

        .table-grid thead th:last-child,
        .table-grid tbody td:last-child,
        .table-grid tfoot td:last-child {
            border-right: none;
        }

    .table-grid tfoot td {
        border-bottom: none;
    }

    .table-grid thead th {
        width: 40%;
    }

        .table-grid thead th:nth-child(2),
        .table-grid thead th:nth-child(3) {
            width: 30%;
        }

.cell {
    display: table-cell;
    vertical-align: middle;
}


.header-empty {
    background: transparent;
}

.header-col {
    background: var(--header-bg) !important;
    text-align: center;
    color: var(--primary);
    font-size: 14px;
    font-weight: 800;
    min-height: 86px;
}

.summary-label,
.summary-value,
.footer-label,
.footer-value {
    background: #f9f9f9 !important;
    font-size: 14px;
    font-weight: 800;
}


    .header-col.left-radius {
        border-top-left-radius: 24px;
    }

    .header-col.right-radius {
        border-top-right-radius: 24px;
    }

.summary-label,
.summary-value,
.footer-label,
.footer-value {
    background: #f9f9f9 !important;
    font-size: 14px;
    font-weight: 800;
}

.summary-value,
.footer-value {
    text-align: center;
}

.address-title {
    font-size: 14px;
    font-weight: 800;
    color: #000;
    margin-bottom: 10px;
}

.address-lines {
    font-size: 14px;
    color: #6d6d6d;
    line-height: 1.25;
}

    .address-lines strong {
        color: #5c5c5c;
        font-weight: 800;
    }

.control-cell {
    text-align: center;
}

.b-top {
    border-top: 2px solid var(--border) !important;
}

.b-right {
    border-right: 2px solid var(--border) !important;
}

.b-bottom {
    border-bottom: 2px solid var(--border) !important;
}

.b-left {
    border-left: 2px solid var(--border) !important;
}

.r-tl {
    border-top-left-radius: 24px;
}

.r-tr {
    border-top-right-radius: 24px;
}

.r-bl {
    border-bottom-left-radius: 24px;
}

.r-br {
    border-bottom-right-radius: 24px;
}

.summary-label,
.summary-value,
.footer-label,
.footer-value {
    background: #f9f9f9;
    font-size: 14px;
    font-weight: 800;
}

.summary-label {
    border-top-left-radius: 24px;
}

.summary-value,
.footer-value {
    text-align: center;
    font-size: 14px;
}

.address-cell {
    vertical-align: middle;
}

    .address-cell > div {
        display: block;
    }

.control-cell {
    text-align: center;
    vertical-align: middle;
}

.address-title {
    font-size: 14px;
    font-weight: 800;
    color: #000;
    margin-bottom: 10px;
}

.address-lines {
    font-size: 14px;
    color: #6d6d6d;
    line-height: 1.25;
}

    .address-lines strong {
        color: #5c5c5c;
        font-weight: 800;
    }

.quantity-box,
.qty-box {
    border: 2px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    background: #fff;
    width: 186px;
    height: 70px;
}


.quantity-btn,
.qty-btn {
    border: none;
    background: var(--control-bg);
    color: var(--muted);
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

    .quantity-btn:hover:not(:disabled),
    .qty-btn:hover:not(:disabled) {
        background: var(--control-bg-hover);
        color: #555;
    }

    .quantity-btn:active:not(:disabled),
    .qty-btn:active:not(:disabled) {
        background: var(--control-bg-active);
    }

    .quantity-btn:disabled,
    .qty-btn:disabled {
        opacity: 0.4;
        cursor: not-allowed;
        background: #f5f5f5;
    }

.quantity-btn,
.qty-btn {
    width: 30%;
}

.quantity-display,
.qty-display {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-left: 1px solid #d8d8d8;
    border-right: 1px solid #d8d8d8;
}

.quantity-display,
.qty-display {
    width: 40%;
    background: #fff;
}

.quantity-number,
.qty-number {
    font-weight: 800;
    line-height: 1;
    color: var(--disabled-text);
}

.quantity-label,
.qty-label {
    font-weight: 700;
    color: var(--disabled-text);
}

.quantity-number {
    font-size: 22px;
}

.quantity-label {
    font-size: 11px;
    margin-top: 4px;
}

.qty-number {
    font-size: 22px;
}

.qty-label {
    margin-top: 4px;
    font-size: 11px;
}

.quantity-display.is-active .quantity-number,
.quantity-display.is-active .quantity-label,
.qty-display.is-active .qty-number,
.qty-display.is-active .qty-label {
    color: #000;
}

.is-active .quantity-number,
.is-active .quantity-label,
.is-active .qty-number,
.is-active .qty-label {
    color: #000;
}

.page-addresses {
    padding: 64px 68px;
}

.address-page {
    max-width: 1240px;
    margin: 0 auto;
}

.address-title-main {
    color: var(--primary);
    font-size: 2.6rem;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 28px;
}

.delivery-options {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.delivery-option-row {
    display: flex;
    align-items: center;
    gap: 34px;
    flex-wrap: wrap;
}

.cotacao__wrapper label.delivery-option {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

    .delivery-option input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

.radio-ui {
    width: 20px;
    height: 20px;
    border: 3px solid #b5b5b5;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    flex-shrink: 0;
    background: transparent;
    vertical-align: middle;
}

.delivery-option input:checked + .radio-ui {
    border-color: #3a3a3a;
}

    .delivery-option input:checked + .radio-ui::after {
        content: "";
        width: 10px;
        height: 10px;
        background: #3a3a3a;
        border-radius: 50%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

.delivery-option__text {
    font-size: 14px;
    font-weight: 700;
    color: #171717;
}

.btn-address-add {
    min-width: 320px;
    height: 40px;
    border: none;
    border-radius: 999px;
    background: #FFA500;
    color: #000;
    font-size: 1rem;
    font-weight: 800;
    padding: 0 22px;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

    .btn-address-add:hover {
        opacity: 0.92;
    }

.address-list-section {
    margin-top: 36px;
}

.address-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 40px;
}

.address-card {
    background: var(--header-bg);
    border-radius: 18px;
    padding: 20px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
}

.address-card__content {
    min-width: 0;
}

.address-card__title {
    font-size: 14px;
    font-weight: 800;
    color: #000;
    margin-bottom: 10px;
}

.address-card__line {
    font-size: 14px;
    color: #6d6d6d;
    line-height: 1.25;
    word-break: break-word;
}

    .address-card__line strong {
        color: #5c5c5c;
        font-weight: 800;
    }

.address-card__actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex-shrink: 0;
}

.btn-outline-action {
    min-width: auto;
    height: 25px;
    border: 2px solid #9b9b9b;
    border-radius: 999px;
    background: transparent;
    color: #7b7b7b;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: left;
    gap: 10px;
    cursor: pointer;
}

.btn-outline-action__icon {
    font-size: 14px;
    line-height: 1;
}

.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.42);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 1000;
}

.modal-card {
    background: #fff;
    border: 2px solid #8f8f8f;
    border-radius: 24px;
    width: 100%;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}

.modal-card--address {
    max-width: 730px;
    padding: 44px 56px 44px;
}

.modal-card--error {
    max-width: 630px;
    padding: 18px 34px 28px;
    text-align: center;
}

.modal-title {
    color: var(--primary);
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 34px;
}

.address-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-bottom: 14px;
    border-bottom: 2px solid #c7c7c7;
    margin-bottom: 12px;
}

.form-label {
    font-size: 1rem;
    font-weight: 800;
    color: #666;
}

.form-input {
    width: 100%;
    border: none;
    outline: none;
    font-size: 1rem;
    color: #666;
    background: transparent;
    padding: 0;
}

    .form-input::placeholder {
        color: #666;
    }

.modal-actions {
    margin-top: 22px;
}

.modal-actions--center {
    display: flex;
    justify-content: center;
}

.btn-primary-large,
.btn-primary-medium {
    border: none;
    border-radius: 12px;
    background: #FFA500;
    color: #000;
    font-weight: 800;
    cursor: pointer;
}

.btn-primary-large {
    width: 100%;
    height: 72px;
    font-size: 1.1rem;
}

.btn-primary-medium {
    min-width: 190px;
    height: 46px;
    border-radius: 999px;
    font-size: 1rem;
    padding: 0 22px;
}

.error-icon-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 14px;
}

.error-icon {
    width: 58px;
    height: 58px;
    border: 4px solid var(--primary);
    border-radius: 50%;
    color: var(--primary);
    font-size: 2rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.error-message {
    color: #5e5e5e;
    font-size: 1rem;
    line-height: 1.3;
    margin-bottom: 22px;
}

    .error-message strong {
        color: #2e2e2e;
        font-weight: 800;
    }

.modal-close {
    appearance: none;
    border: none;
    background: transparent;
}

.hidden {
    display: none !important;
}

@media (max-width: 900px) {
    .page-addresses {
        padding: 32px 20px;
    }

    .address-title-main {
        font-size: 2rem;
    }

    .delivery-option-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
    }

    .btn-address-add {
        min-width: 0;
        width: 100%;
        max-width: 340px;
    }

    .address-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .address-card__actions {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .modal-card--address {
        padding: 30px 22px;
    }
}

.cotacao__input-text--small {
    display: block;
    margin-top: 4px;
    color: #666;
    font-size: 13px;
}

/* Estilos para upload de arquivo */
.custom-file {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 6px;
}

.file-input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.cotacao__btn-main--button-label {
    color: white;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    width: auto!important;
    font-size: 12px!important;
}

.file-label:hover {
    background-color: #0056b3;
}

.nf-link,
.nf-link:link {
    font-weight: bold;
    color: #000;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1.5px;
}

.icon-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #969B96;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    margin-right: 4px;
    cursor: help;
    vertical-align: middle;
}

.btn-icon-back {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    vertical-align: middle;
}


/* Estilos responsivos para modais */
@media (max-width: 768px) {
    .modal {
        padding: 0 !important;
    }

    .modal-dialog {
        margin: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100vh !important;
    }

    .modal.fade .modal-dialog {
        transform: translate(0, 0) !important;
    }

    .modal.show .modal-dialog {
        transform: translate(0, 0) !important;
    }

    .modal-content {
        height: 100vh !important;
        min-height: 100vh !important;
        width: 100% !important;
        border: 0 !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }

    .modal-body {
        overflow-y: auto;
        max-height: calc(100vh - 120px);
        padding: 20px;
        flex: 1;
    }

    .modal-header {
        padding: 15px 20px;
        flex-shrink: 0;
    }

    .modal-footer {
        padding: 15px 20px;
        flex-shrink: 0;
    }

    .small-modal .modal-dialog {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (min-width: 769px) {
    .modal-dialog {
        max-width: 600px;
        margin: 1.75rem auto;
    }
}





.cotacao__main--identidade .lojista-view,
.cotacao__main--identidade .itens-view,
.cotacao__main--identidade .price-view,
.cotacao__main--identidade .enderecos-view,
.cotacao__main--identidade .enderecos-itens-view,
.cotacao__main--cartoes .price-view,
.cotacao__main--cartoes .itens-view,
.cotacao__main--cartoes .enderecos-view,
.cotacao__main--cartoes .enderecos-itens-view,
.cotacao__main--distribuicao .enderecos-itens-view,
.cotacao__main--enderecos .enderecos-view,
.cotacao__main--enderecos .enderecos-itens-view {
  display: none;
}

.cotacao__main--identidade .lojista-view,
.cotacao__main--identidade .itens-view,
.cotacao__main--identidade .price-view,
.cotacao__main--identidade .enderecos-view,
.cotacao__main--identidade .enderecos-itens-view,
.cotacao__main--cartoes .price-view,
.cotacao__main--cartoes .itens-view,
.cotacao__main--cartoes .enderecos-view,
.cotacao__main--cartoes .enderecos-itens-view,
.cotacao__main--distribuicao .enderecos-itens-view,
.cotacao__main--enderecos .enderecos-view,
.cotacao__main--enderecos .enderecos-itens-view {
  display: none;
}

@media (max-width: 560px) {
    .address-title-main {
        font-size: 1.7rem;
    }

    .delivery-option__text {
        font-size: 14px;
    }

    .radio-ui {
        width: 20px;
        height: 20px;
    }

    .delivery-option input:checked + .radio-ui::after {
        width: 10px;
        height: 10px;
    }

    .btn-outline-action {
        width: 100%;
    }

    .address-card__actions {
        flex-direction: column;
    }

    .btn-primary-large {
        height: 58px;
    }
}

@media (max-width: 1100px) {
    .table-grid,
    .table-grid thead,
    .table-grid tbody,
    .table-grid tfoot,
    .table-grid tr,
    .table-grid th,
    .table-grid td {
        display: block;
    }

        .table-grid thead th,
        .table-grid tbody td,
        .table-grid tfoot td {
            border-right: none !important;
            width: 100% !important;
        }

    .header-empty {
        display: none;
    }

    .header-col.left-radius,
    .header-col.right-radius {
        border-radius: 0;
    }

    .address-cell,
    .control-cell {
        min-height: auto;
    }

    .qty-box {
        width: 100%;
        max-width: 270px;
    }
}

@media (max-width: 1024px) {
    .protection-card__header,
    .protection-card__body {
        grid-template-columns: 1fr;
    }

        .protection-card__body > div:not(:last-child) {
            border-right: none;
            border-bottom: 2px solid var(--border-light);
        }

        .protection-card__header .col-qty,
        .protection-card__header .col-value {
            display: none;
        }

    .protection-card__header {
        grid-template-columns: 1fr;
    }

        .protection-card__header .col-title {
            text-align: left;
            padding: 16px 22px;
            font-size: 16px;
        }

    .product-info {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .product-description {
        max-width: 100%;
    }

    .section-title {
        font-size: 1.75rem;
    }

    .value-total strong {
        font-size: 28px;
    }
}

@media (max-width: 640px) {
    body {
        padding: 16px;
    }

    .title {
        font-size: 1.8rem;
    }

    .cell {
        padding: 16px;
    }

    .qty-box {
        height: 88px;
    }

    .qty-number {
        font-size: 1.8rem;
    }
}

@media (max-width: 600px) {
    .protection-card__header > div,
    .protection-card__body > div {
        padding-left: 16px;
        padding-right: 16px;
    }

    .quantity-box {
        width: 100%;
        max-width: 240px;
    }
}