:root {
    --app-bg: #071120;
    --app-bg-soft: #0c1728;
    --panel: #07101f;
    --panel-soft: #111c30;
    --panel-strong: #172945;
    --line: rgba(145, 163, 194, .2);
    --line-soft: rgba(145, 163, 194, .1);
    --input: #0b1830;
    --text: #eef4ff;
    --text-strong: #ffffff;
    --muted: #98a7bd;
    --muted-strong: #cdd8e8;
    --brand: #416a9d;
    --brand-strong: #34a5ff;
    --button: #416a9d;
    --button-hover: #4c79b0;
    --danger: #ff5b66;
    --success: #17c979;
    --warning: #ffd24d;
    --shadow: rgba(0, 0, 0, .32);
    /* Mesma paleta de status usada no AppVendas (public/appvendas/assets/appvendas.css),
       para as telas de extensões/mensalidades ficarem visualmente iguais nos dois apps. */
    --app-blue: #7da9df;
    --app-orange: #ffc15d;
    --app-red: #ff7268;
    --app-green: #51d584;
    --motion-duration-fast: 180ms;
    --motion-duration: 260ms;
    --motion-duration-slow: 360ms;
    --motion-ease: cubic-bezier(.22, 1, .36, 1);
    --motion-ease-emphasis: cubic-bezier(.16, 1, .3, 1);
    color-scheme: dark;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("/assets/fonts/poppins/Poppins-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* Ajustes finais de hierarquia da tela de Integracoes. */
.integrations-main .integration-provider-head {
    min-height: 62px;
    padding: 0 0 20px;
    border-bottom: 1px solid var(--line-soft);
}

.integrations-main .integration-provider-head > div { gap: 14px; }
.integrations-main .integration-provider-head .integration-provider-mark { width: 46px; height: 46px; border-radius: 8px; }
.integrations-main .integration-provider-head h2 { font-size: 20px; font-weight: 850; }
.integrations-main .integration-provider-head p { color: var(--muted); font-weight: 600; }

.integrations-main .integration-section { gap: 20px; border-top: 0; padding: 0; }
.integrations-main .integration-fields-grid { gap: 16px; }
.integrations-main .integration-fields-grid label { color: var(--muted-strong); font-weight: 800; }

.integrations-main .integration-environment select,
.integrations-main .integration-fields-grid input,
.integrations-main .integration-fields-grid select {
    height: 42px;
    min-height: 42px;
    margin-top: 6px;
    border-color: var(--line-soft);
    border-radius: 6px;
    background: var(--input);
    color: var(--text-strong);
    font-weight: 650;
}

.integrations-main .integration-enable { min-height: 38px; gap: 10px; color: var(--muted-strong); font-size: 12px; font-weight: 800; }
.integrations-main .integration-enable input { width: 17px; height: 17px; flex-basis: 17px; }

.integrations-main .integration-operation-summary,
.integrations-main .integration-token-status {
    gap: 12px;
    border-color: var(--line-soft);
    border-radius: 12px;
    padding: 20px 22px;
    background: var(--panel);
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 600;
    box-shadow: 0 3px 12px var(--shadow);
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.integrations-main .integration-operation-summary:hover,
.integrations-main .integration-token-status:hover {
    border-color: var(--brand);
    box-shadow: 0 8px 20px var(--shadow);
    transform: translateY(-1px);
}

.integrations-main .integration-operation-summary strong {
    color: var(--text-strong);
    font-weight: 850;
    font-size: 15px;
}
.integrations-main .integration-connect-card { border-color: var(--line-soft); border-radius: 8px; padding: 18px; background: var(--panel-soft); }
.integrations-main .integration-connect-card.is-connected { border-color: var(--success); background: color-mix(in srgb, var(--success) 12%, var(--panel-soft)); }

.integrations-main .form-actions,
.integrations-main .integration-save-row,
.integrations-main .integration-connect-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding-top: 4px; }

.integrations-main .form-actions button,
.integrations-main .form-actions .button-like,
.integrations-main .integration-connect-actions button,
.integrations-main .integration-connect-actions .button-like {
    min-height: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0;
    border-radius: 6px;
    padding: 0 15px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.integrations-main .secondary-action,
.integrations-main .button-like.secondary-action { border-color: var(--line-soft); background: var(--panel); color: var(--text-strong); }
.integrations-main .secondary-action:hover,
.integrations-main .button-like.secondary-action:hover { border-color: var(--brand); background: var(--panel-soft); }

:root[data-theme="light"] {
    --app-bg: #f4f4f5;
    --app-bg-soft: #ffffff;
    --panel: #ffffff;
    --panel-soft: #eef1f6;
    --panel-strong: #e9eef6;
    --line: rgba(16, 24, 40, .13);
    --line-soft: rgba(16, 24, 40, .08);
    --input: #f1f4f9;
    --text: #101828;
    --text-strong: #071120;
    --muted: #7a7f8c;
    --muted-strong: #5f6470;
    --brand: #416a9d;
    --brand-strong: #0f8ee8;
    --button: #416a9d;
    --button-hover: #315b8c;
    --shadow: rgba(16, 24, 40, .12);
    --app-blue: #3d6598;
    --app-orange: #f59b00;
    --app-red: #c9352b;
    --app-green: #05bf45;
    color-scheme: light;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }

body {
    margin: 0;
    color: var(--text);
    background:
        radial-gradient(circle at 50% 38%, rgba(67, 106, 157, .66) 0, rgba(41, 70, 113, .48) 18%, rgba(13, 28, 54, .96) 46%, #071120 78%),
        #071120;
    font: 16px/1.45 Arial, Helvetica, sans-serif;
    overflow: hidden;
}

:root[data-theme="light"] body {
    background:
        radial-gradient(circle at 50% 38%, rgba(65, 106, 157, .2) 0, rgba(235, 241, 249, .9) 34%, #f7f8fb 78%),
        #f7f8fb;
}

body.is-dashboard {
    overflow: auto;
    background: var(--app-bg);
}

.page {
    min-height: 100svh;
    display: grid;
    place-items: center;
    padding: 24px;
}

.login-shell {
    width: min(100%, 354px);
    display: grid;
    justify-items: center;
    gap: 26px;
}

.brand {
    display: grid;
    justify-items: center;
    gap: 6px;
    text-align: center;
}

.brand-logo {
    width: 72px;
    height: auto;
    max-height: 72px;
    display: block;
    object-fit: contain;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .34));
}

.login-shell > .brand .brand-logo { width: 92px; max-height: 92px; }
.user-modal .brand-logo { width: 82px; max-height: 82px; }

:root[data-theme="light"] .brand-logo {
    filter: invert(1) drop-shadow(0 2px 3px rgba(0, 0, 0, .12));
}

.brand-text {
    display: grid;
    line-height: 1;
}

.brand-text strong {
    color: rgba(255, 255, 255, .76);
    font-size: 16px;
    font-weight: 500;
}

.brand-text em {
    color: #fff;
    font-size: 16px;
    font-style: italic;
    font-weight: 800;
}

:root[data-theme="light"] .brand-text strong,
:root[data-theme="light"] .brand-text em {
    color: var(--text-strong);
}

.login-card {
    width: 100%;
    min-height: 413px;
    padding: 30px 32px 26px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(37, 63, 101, .62), rgba(14, 26, 50, .76));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 28px 80px var(--shadow);
}

:root[data-theme="light"] .login-card {
    background: rgba(255, 255, 255, .82);
}

.login-card h1 {
    margin: 0 0 26px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 800;
    text-align: center;
}

.field {
    display: grid;
    gap: 5px;
    margin-bottom: 23px;
}

label {
    color: var(--muted-strong);
    font-size: 15px;
    font-weight: 700;
}

input {
    width: 100%;
    height: 46px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 16px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    outline: 0;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .24);
    transition: border-color .16s ease, box-shadow .16s ease;
}

input::placeholder { color: var(--muted); }
input:focus {
    border-color: rgba(91, 154, 219, .72);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .22), 0 0 0 4px rgba(33, 162, 255, .13);
}

.password-control { position: relative; }
.password-control input { padding-right: 48px; }

button,
.button-like {
    font: inherit;
}

.login-card > button,
.modal-actions button {
    width: 100%;
    height: 48px;
    margin: 3px 0 21px;
    border: 0;
    border-radius: 11px;
    color: #fff;
    background: var(--button);
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 9px 18px rgba(0, 0, 0, .22);
    transition: background .16s ease, transform .16s ease;
}

.login-card > button:hover,
.modal-actions button:hover {
    background: var(--button-hover);
    transform: translateY(-1px);
}

.toggle-password {
    position: absolute;
    right: 9px;
    bottom: 7px;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    margin: 0;
    border: 0;
    border-radius: 8px;
    color: var(--muted);
    background: transparent;
    box-shadow: none;
    padding: 0;
    font-size: 0;
    cursor: pointer;
}

.toggle-password:hover {
    color: var(--text-strong);
    background: rgba(127, 139, 160, .12);
}

.toggle-password svg {
    width: 18px;
    height: 18px;
}

.actions {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.actions p { margin: 0; }

.alert {
    margin: -8px 0 16px;
    padding: 10px 12px;
    border: 1px solid rgba(255, 128, 128, .28);
    border-radius: 8px;
    color: #ffd6d6;
    background: rgba(159, 36, 36, .22);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.alert.is-success {
    border-color: rgba(101, 255, 171, .24);
    color: #c9ffdf;
    background: rgba(18, 136, 58, .2);
}

a {
    color: var(--brand-strong);
    font-weight: 800;
    text-decoration: none;
}

a:hover { text-decoration: underline; }

.certificate {
    display: grid;
    grid-template-columns: 31px 1fr;
    align-items: center;
    gap: 12px;
    min-width: 191px;
    padding: 13px 22px;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: var(--text-strong);
    background: rgba(26, 39, 66, .62);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 18px 52px var(--shadow);
}

:root[data-theme="light"] .certificate { background: rgba(255, 255, 255, .8); }

.shield {
    width: 23px;
    height: 27px;
    display: grid;
    place-items: center;
}

.shield svg {
    width: 23px;
    height: 27px;
    display: block;
}

.certificate strong {
    display: block;
    font-size: 14px;
    line-height: 1.08;
}

.certificate span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.1;
}

body:not(.is-dashboard) {
    min-height: 100dvh;
    height: 100dvh;
    color: #fff;
    background:
        radial-gradient(circle 300px at 50% 50%, rgba(37, 99, 235, .15) 0%, rgba(37, 99, 235, .08) 42%, rgba(37, 99, 235, 0) 72%),
        radial-gradient(circle at 50% 50%, #3b608f 0%, #253c5d 30%, #1a2943 50%, #0f172a 70%, #090f1b 100%);
    font-family: "Inter", Arial, sans-serif;
    overflow: hidden;
}

body:not(.is-dashboard) .page {
    min-height: 100dvh;
    height: 100dvh;
    padding: 28px 16px;
    background: transparent;
    overflow: hidden;
}

body:not(.is-dashboard) .login-shell {
    width: min(354px, calc(100% - 32px));
    gap: 24px;
}

body:not(.is-dashboard) .login-shell > .brand {
    width: 92px;
    height: 92px;
    display: grid;
    place-items: center;
}

body:not(.is-dashboard) .login-shell > .brand .brand-logo {
    width: 92px;
    height: 92px;
    max-height: 92px;
    object-fit: contain;
    filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .18));
}

:root[data-theme="light"] body:not(.is-dashboard) .login-shell > .brand .brand-logo {
    filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .18));
}

body:not(.is-dashboard) .login-card {
    position: relative;
    display: grid;
    gap: 20px;
    width: 100%;
    min-height: 0;
    padding: 34px 28px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 24px;
    background: rgba(30, 41, 59, .40);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .50);
    backdrop-filter: blur(8px);
}

body:not(.is-dashboard) .login-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .40), transparent);
    pointer-events: none;
}

:root[data-theme="light"] body:not(.is-dashboard) .login-card {
    background: rgba(30, 41, 59, .40);
}

body:not(.is-dashboard) .login-card h1 {
    margin: 0;
    padding-bottom: 8px;
    color: #fff;
    font-family: "Inter", Arial, sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    text-align: center;
}

body:not(.is-dashboard) .login-card .field {
    gap: 8px;
    margin: 0;
}

body:not(.is-dashboard) .login-card label {
    color: #cbd5e1;
    font-family: "Inter", Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0;
}

body:not(.is-dashboard) .login-card input {
    height: 48px;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 12px;
    padding: 0 17px;
    color: #fff;
    background: rgba(2, 6, 23, .50);
    box-shadow: none;
    font-family: "Inter", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
}

body:not(.is-dashboard) .login-card input::placeholder {
    color: #64748b;
}

body:not(.is-dashboard) .login-card input:focus {
    border-color: rgba(59, 96, 143, .95);
    box-shadow: 0 0 0 4px rgba(59, 96, 143, .25);
}

body:not(.is-dashboard) .login-card .password-control input {
    padding-right: 48px;
}

body:not(.is-dashboard) .login-card .toggle-password {
    top: 8px;
    right: 8px;
    bottom: auto;
    color: #94a3b8;
    border-radius: 10px;
}

body:not(.is-dashboard) .login-card .toggle-password:hover {
    color: #fff;
    background: rgba(255, 255, 255, .08);
}

body:not(.is-dashboard) .login-card > button {
    height: 48px;
    margin: 0;
    border-radius: 12px;
    background: linear-gradient(135deg, #3b608f 0%, #37577e 100%);
    box-shadow: 0 10px 24px rgba(59, 96, 143, .35);
    font-family: "Inter", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .5px;
}

body:not(.is-dashboard) .login-card > button:hover {
    background: linear-gradient(135deg, #416a9d 0%, #3b608f 100%);
    transform: translateY(-1px);
}

body:not(.is-dashboard) .login-card .actions {
    gap: 5px;
    color: #cbd5e1;
    font-family: "Inter", Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0;
}

body:not(.is-dashboard) .login-card .actions a {
    color: #38b6ff;
    font-weight: 500;
}

body:not(.is-dashboard) .login-card .alert {
    margin: 0;
    border-color: rgba(248, 113, 113, .30);
    border-radius: 12px;
    color: #fecaca;
    background: rgba(127, 29, 29, .28);
    font-family: "Inter", Arial, sans-serif;
    font-size: 13px;
    font-weight: 500;
}

body:not(.is-dashboard) .login-card .alert.is-success {
    border-color: rgba(74, 222, 128, .26);
    color: #bbf7d0;
    background: rgba(20, 83, 45, .26);
}

body:not(.is-dashboard) .certificate {
    grid-template-columns: 24px 1fr;
    gap: 12px;
    justify-self: center;
    min-width: 191px;
    margin-top: -8px;
    padding: 13px 21px;
    border: 1px solid rgba(255, 255, 255, .05);
    border-radius: 16px;
    color: #cbd5e1;
    background: rgba(255, 255, 255, .03);
    box-shadow: none;
    backdrop-filter: blur(2px);
    text-decoration: none;
}

:root[data-theme="light"] body:not(.is-dashboard) .certificate {
    background: rgba(255, 255, 255, .03);
}

body:not(.is-dashboard) .certificate:hover {
    border-color: rgba(255, 255, 255, .10);
    background: rgba(255, 255, 255, .055);
    text-decoration: none;
}

body:not(.is-dashboard) .certificate .shield,
body:not(.is-dashboard) .certificate .shield svg {
    width: 24px;
    height: 24px;
}

body:not(.is-dashboard) .certificate .shield svg {
    display: block;
    color: #cbd5e1;
}

body:not(.is-dashboard) .certificate strong {
    color: #fff;
    font-family: "Inter", Arial, sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
}

body:not(.is-dashboard) .certificate span {
    color: #cbd5e1;
    font-family: "Inter", Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0;
}

body:not(.is-dashboard) .certificate > span:last-child {
    display: grid;
    gap: 1px;
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 20;
    display: none;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 36%, rgba(67, 106, 157, .62) 0, rgba(41, 70, 113, .4) 24%, rgba(7, 17, 32, .94) 68%),
        rgba(7, 17, 32, .88);
}

:root[data-theme="light"] .modal-backdrop {
    background: rgba(247, 248, 251, .9);
}

.modal-backdrop.is-open { display: grid; }

.user-modal {
    width: min(100%, 430px);
    display: grid;
    justify-items: center;
    gap: 20px;
}

.modal-card {
    width: 100%;
    padding: 26px 32px 24px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(37, 63, 101, .74), rgba(14, 26, 50, .86));
    box-shadow: 0 34px 90px var(--shadow);
}

:root[data-theme="light"] .modal-card { background: #fff; }

.modal-card h2 {
    margin: 0 0 20px;
    font-size: 23px;
    text-align: center;
}

.modal-card .field { margin-bottom: 14px; }
.modal-card input {
    height: 39px;
    border-radius: 9px;
}

.modal-actions {
    display: grid;
    gap: 14px;
    margin-top: 20px;
}

.modal-actions button {
    margin: 0;
    height: 44px;
    border-radius: 10px;
}

.modal-actions .cancel-button {
    background: #2a303b;
    box-shadow: none;
}

:root[data-theme="light"] .modal-actions .cancel-button { background: #e5e7eb; color: #111827; }
.modal-actions .cancel-button:hover { background: #343b49; }
:root[data-theme="light"] .modal-actions .cancel-button:hover { background: #d4d8df; }

.dashboard {
    width: 100%;
    min-height: 100svh;
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    background: var(--app-bg);
    color: var(--text);
}

.dashboard-home {
    --app-bg: #0e1728;
    --app-bg-soft: #080f1d;
    --panel: #090f1b;
    --panel-soft: #111b2d;
    --panel-strong: #121e32;
    --line: rgba(148, 163, 184, .16);
    --line-soft: rgba(148, 163, 184, .11);
    --input: #0c1627;
    --text: #d7e0ee;
    --text-strong: #f8fafc;
    --muted: #7f8ba1;
    --muted-strong: #b9c4d4;
    --brand: #1d4ed8;
    --brand-strong: #38bdf8;
    --success: #22c55e;
    --warning: #fbbf24;
    --danger: #ef4444;
    background: #0e1728;
}

.sidebar {
    position: sticky;
    top: 0;
    height: 100svh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) max-content;
    gap: 14px;
    padding: 24px 18px max(12px, env(safe-area-inset-bottom));
    border-right: 1px solid rgba(148, 163, 184, .13);
    background: linear-gradient(180deg, #07101f 0%, #070d18 100%);
    overflow: hidden;
}

.sidebar > div:first-child {
    display: contents;
}

.side-logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0 0 6px;
}

.logo-sidebar {
    width: 194px;
    max-height: 46px;
    object-fit: contain;
    filter: none;
}

.logo-sidebar-light { display: none; }
:root[data-theme="light"] .logo-sidebar-dark { display: none; }
:root[data-theme="light"] .logo-sidebar-light { display: block; }
.dashboard-home .logo-sidebar-dark,
:root[data-theme="light"] .dashboard-home .logo-sidebar-dark { display: block; }
.dashboard-home .logo-sidebar-light,
:root[data-theme="light"] .dashboard-home .logo-sidebar-light { display: none; }

.side-nav {
    display: grid;
    align-content: start;
    gap: 7px;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 2px 10px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, .34) transparent;
}

.side-nav::-webkit-scrollbar {
    width: 6px;
}

.side-nav::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(100, 116, 139, .34);
}

.side-nav::-webkit-scrollbar-track {
    background: transparent;
}

.menu-title {
    margin: 13px 10px 5px;
    color: rgba(148, 163, 184, .72);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.nav-button {
    width: 100%;
    min-height: 40px;
    display: grid;
    grid-template-columns: 20px 1fr 16px;
    align-items: center;
    gap: 10px;
    padding: 0 10px;
    border: 0;
    border-radius: 10px;
    color: #8f9db2;
    background: transparent;
    font-size: 14px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, transform .16s ease;
}

a.nav-button:hover {
    text-decoration: none;
}

.nav-button svg {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    display: block;
}

.figma-icon {
    width: 18px;
    height: 18px;
    min-width: 18px;
    display: block;
}

.figma-chevron {
    width: 16px;
    height: 16px;
    display: block;
}

.figma-chevron-expanded,
.menu-group.is-open .figma-chevron-collapsed {
    display: none;
}

.menu-group.is-open .figma-chevron-expanded {
    display: block;
}

.figma-cert-icon {
    width: 20px;
    height: 20px;
    display: block;
}

.figma-logout-icon {
    width: 20px;
    height: 20px;
    display: block;
}

.nav-button:hover,
.nav-button:focus-visible,
.nav-button.is-active,
.menu-group.is-open > .nav-button {
    color: #f8fafc;
    background: rgba(31, 47, 74, .82);
    outline: 0;
    text-decoration: none;
    transform: translateY(-1px);
}

:root[data-theme="light"] .menu-group.is-open > .nav-button {
    color: #fff;
    background: var(--brand);
}

.nav-button .chev {
    justify-self: end;
    font-size: 20px;
    line-height: 1;
    color: currentColor;
    transition: transform .16s ease;
}

.menu-group.is-open .chev { transform: rotate(90deg); }

.submenu {
    display: none;
    position: relative;
    margin: 4px 0 8px 25px;
    padding-left: 16px;
    gap: 3px;
}

.menu-group.is-open .submenu { display: grid; }

.submenu::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--line);
}

.submenu::after {
    content: "";
    position: absolute;
    left: -1px;
    top: 6px;
    width: 3px;
    height: 20px;
    border-radius: 99px;
    background: var(--brand-strong);
}

.submenu button,
.submenu a {
    width: 100%;
    min-height: 31px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 8px;
    padding: 0 10px;
    color: var(--muted);
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    transition: background .16s ease, color .16s ease;
}

.submenu button:hover,
.submenu button:focus-visible,
.submenu button.is-active,
.submenu a:hover,
.submenu a:focus-visible,
.submenu a.is-active {
    color: var(--brand-strong);
    background: rgba(65, 106, 157, .45);
    outline: 0;
    text-decoration: none;
}

.submenu-group {
    display: grid;
    gap: 5px;
    padding: 4px 0 2px;
}

.submenu-group-title {
    padding: 4px 10px 2px;
    color: color-mix(in srgb, var(--muted) 78%, transparent);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

:root[data-theme="light"] .submenu button.is-active,
:root[data-theme="light"] .submenu a.is-active {
    color: #fff;
    background: #111827;
}

.sidebar-bottom {
    display: grid;
    align-self: end;
    gap: 0;
    min-height: 0;
    margin: 8px -16px 0;
    background: #070d18;
}

.cert-mini {
    display: grid;
    grid-template-columns: 27px 1fr;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    margin: 0 18px 10px;
    padding: 9px 10px;
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 12px;
    color: var(--text-strong);
    background: rgba(15, 23, 42, .86);
}

:root[data-theme="light"] .cert-mini {
    background: #fff;
    box-shadow: 0 12px 34px rgba(16, 24, 40, .06);
}

.dashboard-home .cert-mini,
:root[data-theme="light"] .dashboard-home .cert-mini {
    background: rgba(15, 23, 42, .86);
    box-shadow: none;
}

.cert-mini .shield {
    width: 27px;
    height: 27px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

:root[data-theme="light"] .cert-mini .shield {
    color: var(--text-strong);
    background: #edf0f5;
}

.dashboard-home .cert-mini .shield,
:root[data-theme="light"] .dashboard-home .cert-mini .shield {
    color: #fff;
    background: rgba(255, 255, 255, .08);
}

.cert-mini .shield svg {
    width: 15px;
    height: 18px;
}

.cert-mini .shield svg path {
    stroke: currentColor;
}

.cert-mini strong {
    display: block;
    font-size: 11px;
    line-height: 1.12;
}

.cert-mini span {
    color: var(--muted);
    font-size: 10px;
}

.user-strip {
    min-height: 54px;
    display: grid;
    grid-template-columns: 28px 1fr 24px;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-top: 1px solid rgba(148, 163, 184, .13);
    color: var(--text-strong);
}

.user-strip.has-company-switch {
    grid-template-columns: 28px minmax(0, 1fr) 28px 24px;
}

.user-strip-info {
    min-width: 0;
}

.avatar {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #c58bff, #e0b184);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    object-fit: cover;
}

.user-strip strong {
    display: block;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-strip span {
    display: block;
    color: var(--muted);
    font-size: 11px;
}

.logout-icon {
    display: grid;
    place-items: center;
    color: var(--muted-strong);
}

.company-switch-trigger {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(70, 112, 170, .12);
    color: var(--muted-strong);
    cursor: pointer;
    transition: background .18s ease, color .18s ease, border-color .18s ease;
}

.company-switch-trigger:hover {
    border-color: rgba(70, 112, 170, .45);
    background: rgba(70, 112, 170, .2);
    color: var(--text-strong);
}

@media (min-width: 769px) and (max-height: 760px) {
    .sidebar {
        gap: 10px;
        padding-top: 18px;
        padding-bottom: max(10px, env(safe-area-inset-bottom));
    }

    .side-logo {
        margin-bottom: 2px;
    }

    .side-nav {
        gap: 5px;
        padding-bottom: 6px;
    }

    .menu-title {
        margin-top: 9px;
        margin-bottom: 3px;
    }

    .cert-mini {
        min-height: 40px;
        margin-bottom: 6px;
        padding-top: 7px;
        padding-bottom: 7px;
    }

    .user-strip {
        min-height: 50px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
}

.company-switch-card {
    max-width: 560px;
}

.company-switch-form {
    display: grid;
    gap: 14px;
}

.company-switch-form label {
    display: grid;
    gap: 7px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.company-switch-form select {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--input);
    color: var(--text-strong);
    padding: 0 12px;
    font-size: 14px;
    font-weight: 700;
}

.company-switch-current {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid rgba(70, 112, 170, .25);
    border-radius: 10px;
    background: rgba(70, 112, 170, .08);
    color: var(--text-strong);
}

.company-switch-current span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.company-switch-actions {
    margin-top: 2px;
}

.dash-main {
    min-width: 0;
    padding: 29px 30px 28px;
    background: #0e1728;
}

.dash-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 24px;
}

.dash-top h1 {
    margin: 0;
    color: var(--text-strong);
    font-size: 30px;
    line-height: 1.1;
}

.dash-top p {
    margin: 7px 0 0;
    color: #9aa6b8;
    font-size: 14px;
    font-weight: 700;
}

.top-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.search-box {
    width: min(360px, 32vw);
    height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 12px;
    background: #090f1b;
    color: #77849a;
    font-size: 13px;
}

.icon-button {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 12px;
    background: #090f1b;
    color: var(--muted-strong);
    cursor: pointer;
    transition: background .16s ease, color .16s ease;
}

.icon-button:hover {
    color: var(--text-strong);
    background: var(--panel-soft);
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 18px;
    margin-bottom: 22px;
}

.stat-card,
.chart-card,
.recent-card {
    border: 1px solid rgba(148, 163, 184, .11);
    border-radius: 20px;
    background: #090f1b;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), 0 18px 45px rgba(2, 6, 23, .16);
}

:root[data-theme="light"] .stat-card,
:root[data-theme="light"] .chart-card,
:root[data-theme="light"] .recent-card {
    box-shadow: 0 12px 34px rgba(16, 24, 40, .05);
}

.stat-card {
    min-height: 132px;
    padding: 20px;
    position: relative;
}

.stat-card small {
    display: block;
    color: #a6b1c3;
    font-size: 13px;
    margin-bottom: 25px;
}

.stat-card strong {
    display: block;
    color: var(--text-strong);
    font-size: 25px;
    line-height: 1;
}

.stat-card span {
    display: block;
    margin-top: 12px;
    color: var(--success);
    font-size: 12px;
    font-weight: 800;
}

.stat-card span.is-down { color: var(--danger); }
.stat-card span.is-neutral { color: #8b97a9; }

.stat-icon {
    position: absolute;
    top: 17px;
    right: 17px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(56, 189, 248, .16);
    border-radius: 11px;
    color: #38bdf8;
    background: rgba(15, 23, 42, .9);
}

.stat-icon svg {
    width: 19px;
    height: 19px;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 2.15fr) minmax(290px, .9fr);
    gap: 18px;
    align-items: stretch;
}

.chart-card,
.recent-card {
    height: clamp(420px, calc(100svh - 260px), 620px);
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.chart-card,
.recent-card {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 62px;
    margin-bottom: 0;
    padding: 0 22px;
    border-bottom: 1px solid rgba(148, 163, 184, .11);
}

.card-head h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: 16px;
    font-weight: 850;
}

.card-head a {
    color: #38bdf8;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.bars {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    align-items: end;
    gap: clamp(10px, 2vw, 24px);
    padding: 34px 20px 8px;
}

.bar-pair {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.bar-group {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: flex-end;
    gap: 4px;
    width: 100%;
    justify-content: center;
}

.bar {
    width: clamp(28px, 4.3vw, 56px);
    border-radius: 4px 4px 0 0;
    background: #31557f;
}

.bar.is-bright { background: #3190c9; }

.bar-pair small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.revenue-chart {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    padding: 14px 22px 18px;
    gap: 10px;
}

.revenue-chart-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin: 0 0 2px;
}

.revenue-chart-periods {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px;
    border-radius: 12px;
    background: #0f1729;
    border: 1px solid rgba(148, 163, 184, .11);
    overflow-x: auto;
}

.revenue-period-btn {
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 7px;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}

.revenue-period-btn:hover { color: var(--text-strong); }

.revenue-period-btn.is-active {
    color: #fff;
    background: linear-gradient(135deg, #0284c7, #14b8a6);
    box-shadow: 0 4px 12px rgba(14, 165, 233, .35);
}

.revenue-chart-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.revenue-chart-summary div {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid rgba(148, 163, 184, .08);
    border-radius: 12px;
    background: rgba(15, 23, 42, .56);
}

.revenue-chart-summary small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.revenue-chart-summary strong {
    color: var(--text-strong);
    font-size: 14px;
    font-weight: 800;
}

.revenue-chart-summary strong.is-down { color: var(--danger); }
.revenue-chart-summary div:last-child strong:not(.is-down) { color: #10b981; }
.revenue-chart-summary div:nth-child(1) strong { color: #8b5cf6; }
.revenue-chart-summary div:nth-child(2) strong { color: #0ea5e9; }

.revenue-chart-canvas {
    position: relative;
    min-height: 0;
    width: 100%;
    height: 100%;
    min-height: 260px;
    padding: 2px 0 0;
}

.revenue-chart-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.revenue-chart-grid line {
    stroke: rgba(148, 163, 184, .12);
    stroke-width: 1;
    stroke-dasharray: 4 6;
}

.revenue-chart-axis-label {
    fill: #748299;
    font-size: 10px;
    font-weight: 600;
}

.revenue-chart-axis-label.is-x-axis {
    font-size: 10.5px;
    fill: var(--muted-strong);
}

.revenue-chart-axis-line {
    stroke: rgba(148, 163, 184, .26);
    stroke-width: 1.2;
}

.revenue-chart-bar {
    transition: opacity var(--motion-duration-fast) var(--motion-ease);
}

.revenue-chart-bar.is-previsto {
    fill: #64748b;
    opacity: .62;
}

.revenue-chart-bar.is-recebido {
    opacity: .98;
}

.revenue-chart-hover-band {
    fill: var(--panel-soft);
    opacity: .38;
    pointer-events: none;
}

.revenue-chart-overlay rect { cursor: pointer; }

.revenue-chart-overlay rect:hover { fill: transparent; }

.revenue-chart-canvas.is-loading { opacity: .55; pointer-events: none; }

.revenue-chart-tooltip {
    position: absolute;
    z-index: 3;
    transform: translate(-50%, -120%);
    min-width: 168px;
    padding: 10px 12px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel-strong);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
    pointer-events: none;
    display: grid;
    gap: 5px;
}

.revenue-chart-tooltip.is-right-aligned { transform: translate(-90%, -120%); }

.revenue-chart-tooltip strong {
    color: var(--text-strong);
    font-size: 12.5px;
}

.revenue-chart-tooltip span {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
}

.revenue-chart-tooltip span b {
    margin-left: auto;
    color: var(--text-strong);
    font-weight: 700;
}

.revenue-chart-legend {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.revenue-chart-legend span {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.legend-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: inline-block;
}

.legend-dot.is-recebido { background: linear-gradient(90deg, #14b8a6, #0ea5e9); }
.legend-dot.is-previsto { background: #64748b; }

.recent-list {
    display: grid;
    align-content: start;
    gap: 0;
    overflow: auto;
}

.sale-row {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) minmax(82px, auto);
    align-items: center;
    gap: 12px;
    min-height: 75px;
    padding: 0 22px;
    border-bottom: 1px solid rgba(148, 163, 184, .09);
}

.sale-row:last-child { border-bottom: 0; }

.sale-avatar {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(56, 189, 248, .13);
    color: #38bdf8;
}

.sale-client {
    min-width: 0;
    display: grid;
    gap: 3px;
    align-content: center;
}

.sale-row strong {
    display: block;
    color: var(--text-strong);
    font-size: 13px;
    line-height: 1.25;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.sale-row small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.25;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.sale-value {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    color: var(--text-strong);
    text-align: right;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.dashboard:not(.dashboard-home) {
    grid-template-columns: 268px minmax(0, 1fr);
}

.dashboard:not(.dashboard-home) .sidebar {
    gap: 12px;
    padding: 24px 16px 0;
    border-right: 1px solid var(--line);
    background: var(--app-bg-soft);
}

.dashboard:not(.dashboard-home) .logo-sidebar {
    width: 206px;
    max-height: 48px;
}

.dashboard:not(.dashboard-home) .side-nav {
    gap: 8px;
}

.dashboard:not(.dashboard-home) .menu-title {
    margin: 12px 10px 4px;
    color: var(--muted);
}

.dashboard:not(.dashboard-home) .nav-button {
    min-height: 42px;
    border-radius: 8px;
    color: var(--muted-strong);
    font-size: 15px;
}

.dashboard:not(.dashboard-home) .nav-button:hover,
.dashboard:not(.dashboard-home) .nav-button:focus-visible,
.dashboard:not(.dashboard-home) .nav-button.is-active,
.dashboard:not(.dashboard-home) .menu-group.is-open > .nav-button {
    color: var(--text-strong);
    background: var(--panel-soft);
}

.dashboard:not(.dashboard-home) .sidebar-bottom {
    background: var(--app-bg-soft);
}

.dashboard:not(.dashboard-home) .cert-mini {
    margin: 0 16px 8px;
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: rgba(255, 255, 255, .03);
}

:root[data-theme="light"] .dashboard:not(.dashboard-home) .cert-mini {
    background: #fff;
    box-shadow: 0 12px 34px rgba(16, 24, 40, .06);
}

:root[data-theme="light"] .dashboard:not(.dashboard-home) .cert-mini .shield {
    color: var(--text-strong);
    background: #edf0f5;
}

.dashboard:not(.dashboard-home) .user-strip {
    height: 48px;
    padding: 8px 16px;
    border-top: 1px solid var(--line);
}

.dashboard:not(.dashboard-home) .dash-main {
    padding: 34px 32px 28px;
    background: transparent;
}

.dashboard:not(.dashboard-home) .dash-top {
    margin-bottom: 30px;
}

.dashboard:not(.dashboard-home) .dash-top h1 {
    font-size: 28px;
}

.dashboard:not(.dashboard-home) .dash-top p {
    margin: 4px 0 0;
    color: var(--muted);
}

.dashboard:not(.dashboard-home) .search-box,
.dashboard:not(.dashboard-home) .icon-button {
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel);
}

.dashboard:not(.dashboard-home) .search-box {
    color: var(--muted);
}

.dashboard:not(.dashboard-home) .stats-grid {
    gap: 20px;
    margin-bottom: 30px;
}

.dashboard:not(.dashboard-home) .stat-card,
.dashboard:not(.dashboard-home) .chart-card,
.dashboard:not(.dashboard-home) .recent-card {
    border: 1px solid var(--line-soft);
    border-radius: 18px;
    background: var(--panel);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
}

:root[data-theme="light"] .dashboard:not(.dashboard-home) .stat-card,
:root[data-theme="light"] .dashboard:not(.dashboard-home) .chart-card,
:root[data-theme="light"] .dashboard:not(.dashboard-home) .recent-card {
    box-shadow: 0 12px 34px rgba(16, 24, 40, .05);
}

.dashboard:not(.dashboard-home) .stat-card {
    min-height: 126px;
}

.dashboard:not(.dashboard-home) .stat-card small {
    color: var(--muted-strong);
    margin-bottom: 24px;
}

.dashboard:not(.dashboard-home) .stat-card strong {
    font-size: 26px;
}

.dashboard:not(.dashboard-home) .stat-icon {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    color: var(--brand-strong);
    background: rgba(52, 165, 255, .18);
}

.dashboard:not(.dashboard-home) .dashboard-grid {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 20px;
}

.dashboard:not(.dashboard-home) .chart-card,
.dashboard:not(.dashboard-home) .recent-card {
    height: clamp(360px, calc(100svh - 300px), 560px);
}

.dashboard:not(.dashboard-home) .card-head {
    min-height: 58px;
    padding: 0 20px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard:not(.dashboard-home) .card-head h2 {
    font-size: 17px;
    font-weight: 700;
}

.dashboard:not(.dashboard-home) .card-head a {
    color: var(--brand-strong);
    font-size: 13px;
    font-weight: 400;
    text-decoration: none;
}

.dashboard:not(.dashboard-home) .recent-list {
    overflow: hidden;
}

.dashboard:not(.dashboard-home) .sale-row {
    grid-template-columns: 34px 1fr auto;
    min-height: 72px;
    padding: 0 20px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard:not(.dashboard-home) .sale-avatar {
    width: 29px;
    height: 29px;
    background: rgba(52, 165, 255, .18);
    color: var(--brand-strong);
}

.dashboard-home {
    font-family: "Inter";
    background: var(--app-bg);
}

:root[data-theme="dark"] .dashboard-home {
    --app-bg: #0e1728;
    --app-bg-soft: #080f1d;
    --panel: #090f1b;
    --panel-soft: #111b2d;
    --panel-strong: #121e32;
    --line: rgba(148, 163, 184, .16);
    --line-soft: rgba(148, 163, 184, .11);
    --input: #0c1627;
    --text: #d7e0ee;
    --text-strong: #f8fafc;
    --muted: #7f8ba1;
    --muted-strong: #b9c4d4;
    --brand: #1d4ed8;
    --brand-strong: #38bdf8;
    --success: #22c55e;
    --warning: #fbbf24;
    --danger: #ef4444;
    --home-sidebar-bg: linear-gradient(180deg, #07101f 0%, #070d18 100%);
    --home-sidebar-bottom-bg: #070d18;
    --home-card-bg: #090f1b;
    --home-inner-bg: rgba(15, 23, 42, .56);
    --home-control-bg: #090f1b;
    --home-pill-bg: #0f1729;
    --home-icon-bg: rgba(15, 23, 42, .9);
    --home-icon-border: rgba(56, 189, 248, .16);
    --home-nav-text: #8f9db2;
    --home-nav-active-bg: #3B608F;
    --home-heading-subtle: #9aa6b8;
    --home-card-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), 0 18px 45px rgba(2, 6, 23, .16);
    --figma-icon-primary: #f8fafc;
    --figma-icon-secondary: #cbd5e1;
    --figma-icon-muted: #94a3b8;
    --figma-icon-accent: #38b6ff;
    --figma-icon-positive: #02bd37;
    --figma-icon-negative: var(--danger);
}

:root[data-theme="light"] .dashboard-home {
    --app-bg: #f5f7fb;
    --app-bg-soft: #ffffff;
    --panel: #ffffff;
    --panel-soft: #eef3f9;
    --panel-strong: #ffffff;
    --line: rgba(15, 23, 42, .14);
    --line-soft: rgba(15, 23, 42, .09);
    --input: #f1f5f9;
    --text: #334155;
    --text-strong: #0f172a;
    --muted: #64748b;
    --muted-strong: #475569;
    --brand: #2563eb;
    --brand-strong: #0284c7;
    --success: #16a34a;
    --warning: #b45309;
    --danger: #dc2626;
    --home-sidebar-bg: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    --home-sidebar-bottom-bg: #ffffff;
    --home-card-bg: #ffffff;
    --home-inner-bg: #f8fafc;
    --home-control-bg: #ffffff;
    --home-pill-bg: #f1f5f9;
    --home-icon-bg: #f1f8ff;
    --home-icon-border: rgba(2, 132, 199, .14);
    --home-nav-text: #64748b;
    --home-nav-active-bg: #3B608F;
    --home-heading-subtle: #64748b;
    --home-card-shadow: 0 14px 35px rgba(15, 23, 42, .07);
    --figma-icon-primary: #0f172a;
    --figma-icon-secondary: #475569;
    --figma-icon-muted: #64748b;
    --figma-icon-accent: #0284c7;
    --figma-icon-positive: #02bd37;
    --figma-icon-negative: var(--danger);
}

.dashboard-home .sidebar {
    border-right-color: var(--line);
    background: var(--home-sidebar-bg);
}

.dashboard-home .sidebar-bottom {
    background: var(--home-sidebar-bottom-bg);
}

:root[data-theme="dark"] .dashboard-home .logo-sidebar-dark { display: block; }
:root[data-theme="dark"] .dashboard-home .logo-sidebar-light { display: none; }
:root[data-theme="light"] .dashboard-home .logo-sidebar-dark { display: none; }
:root[data-theme="light"] .dashboard-home .logo-sidebar-light { display: block; }

.dashboard-home .menu-title {
    color: color-mix(in srgb, var(--muted) 78%, transparent);
}

.dashboard-home .nav-button {
    color: var(--home-nav-text);
}

.dashboard-home .nav-button:hover,
.dashboard-home .nav-button:focus-visible {
    color: var(--text-strong);
    background: color-mix(in srgb, var(--home-nav-active-bg) 22%, transparent);
}

.dashboard-home .nav-button.is-active,
.dashboard-home .menu-group.is-open > .nav-button {
    color: #FFFFFF;
    background: var(--home-nav-active-bg);
}

.dashboard-home .cert-mini {
    border-color: var(--line-soft);
    background: var(--home-inner-bg);
    box-shadow: none;
}

:root[data-theme="light"] .dashboard-home .cert-mini,
:root[data-theme="dark"] .dashboard-home .cert-mini {
    background: var(--home-inner-bg);
    box-shadow: none;
}

.dashboard-home .cert-mini .shield {
    color: var(--brand-strong);
    background: var(--home-icon-bg);
}

:root[data-theme="light"] .dashboard-home .cert-mini .shield,
:root[data-theme="dark"] .dashboard-home .cert-mini .shield {
    color: var(--brand-strong);
    background: var(--home-icon-bg);
}

.dashboard-home .user-strip {
    border-top-color: var(--line);
}

.dashboard-home .dash-main {
    background: var(--app-bg);
}

.dashboard-home .dash-top p {
    color: var(--home-heading-subtle);
}

.dashboard-home .search-box,
.dashboard-home .icon-button {
    border-color: var(--line-soft);
    background: var(--home-control-bg);
}

.dashboard-home .search-box {
    color: var(--muted);
}

.dashboard-home .theme-icon-light { display: none; }
:root[data-theme="dark"] .dashboard-home .theme-icon-dark { display: none; }
:root[data-theme="dark"] .dashboard-home .theme-icon-light { display: block; }

.dashboard-home .stat-card,
.dashboard-home .chart-card,
.dashboard-home .recent-card {
    border-color: var(--line-soft);
    background: var(--home-card-bg);
    box-shadow: var(--home-card-shadow);
}

.dashboard-home .stat-card small {
    color: var(--muted-strong);
}

.dashboard-home .stat-icon {
    border-color: var(--home-icon-border);
    color: var(--brand-strong);
    background: var(--home-icon-bg);
}

.dashboard-home .stat-card span.is-neutral {
    color: var(--muted);
}

.dashboard-home .card-head {
    border-bottom-color: var(--line-soft);
}

.dashboard-home .card-head a {
    color: var(--brand-strong);
}

.dashboard-home .revenue-chart-periods,
.dashboard-home .revenue-chart-summary div {
    border-color: var(--line-soft);
    background: var(--home-pill-bg);
}

.dashboard-home .revenue-chart-grid line {
    stroke: var(--line-soft);
}

.dashboard-home .revenue-chart-axis-label {
    fill: var(--muted);
}

.dashboard-home .sale-row {
    border-bottom-color: var(--line-soft);
}

.dashboard-home .sale-avatar {
    color: var(--brand-strong);
    background: var(--home-icon-bg);
}

.dashboard-home .recent-card .badge {
    border: 1px solid rgba(34, 197, 94, .28);
    color: #22c55e;
    background: rgba(34, 197, 94, .12);
}

.dashboard-home .recent-card .badge.is-pending {
    border-color: rgba(251, 191, 36, .32);
    color: var(--warning);
    background: rgba(251, 191, 36, .13);
}

:root[data-theme="light"] .dashboard-home .recent-card .badge {
    border-color: rgba(22, 163, 74, .24);
    color: #15803d;
    background: #dcfce7;
}

:root[data-theme="light"] .dashboard-home .recent-card .badge.is-pending {
    border-color: rgba(217, 119, 6, .24);
    color: #b45309;
    background: #fef3c7;
}

.dashboard-home .dash-top h1 {
    font-family: "Inter";
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0;
}

.dashboard-home .dash-top p {
    font-family: "Inter";
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
}

.dashboard-home .menu-title {
    font-family: "Inter";
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
}

.dashboard-home .nav-button,
.dashboard-home .submenu button,
.dashboard-home .submenu a {
    font-family: "Inter";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
}

.dashboard-home .user-strip strong {
    font-family: "Inter";
    font-size: 13px;
    font-weight: 600;
}

.dashboard-home .user-strip span {
    font-family: "Inter";
    font-size: 11px;
    font-weight: 400;
}

.dashboard-home .search-box {
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
}

.dashboard-home .stat-card small {
    font-family: "Inter";
    font-size: 13px;
    font-weight: 500;
}

.dashboard-home .stat-card strong {
    font-family: "Inter";
    font-size: 24px;
    font-weight: 700;
}

.dashboard-home .stat-card span {
    font-family: "Inter";
    font-size: 12px;
    font-weight: 400;
}

.dashboard-home .card-head h2 {
    font-family: "Inter";
    font-size: 16px;
    font-weight: 600;
}

.dashboard-home .card-head a,
.dashboard-home .revenue-period-btn,
.dashboard-home .revenue-chart-summary,
.dashboard-home .revenue-chart-legend,
.dashboard-home .sale-row {
    font-family: "Inter";
}

.dashboard-home .nav-button svg {
    width: 18px !important;
    height: 18px !important;
}

.dashboard-home .figma-icon {
    width: 18px;
    height: 18px;
    display: block;
    flex: 0 0 18px;
}

.dashboard-home .nav-button .chev {
    width: 16px;
    height: 16px;
    display: grid;
    place-items: center;
    font-size: 0;
    transform: none;
}

.dashboard-home .menu-group.is-open .chev {
    transform: none;
}

.dashboard-home .figma-chevron {
    width: 16px;
    height: 16px;
    display: block;
}

.dashboard-home .figma-chevron-expanded,
.dashboard-home .menu-group.is-open .figma-chevron-collapsed {
    display: none;
}

.dashboard-home .menu-group.is-open .figma-chevron-expanded {
    display: block;
}

.dashboard-home .search-box svg,
.dashboard-home .figma-search-icon {
    width: 16px !important;
    height: 16px !important;
    display: block;
}

.dashboard-home .icon-button svg,
.dashboard-home .figma-theme-icon {
    width: 20px !important;
    height: 20px !important;
    display: block;
}

.dashboard-home .figma-icon--theme-sun {
    display: none;
}

:root[data-theme="dark"] .dashboard-home .figma-icon--theme-moon {
    display: none;
}

:root[data-theme="dark"] .dashboard-home .figma-icon--theme-sun {
    display: block;
}

.dashboard-home .stat-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid var(--home-icon-border);
    background: var(--home-icon-bg);
}

.dashboard-home .stat-icon svg,
.dashboard-home .figma-card-icon {
    width: 20px;
    height: 20px;
    display: block;
}

.dashboard-home .stat-card span {
    display: flex;
    align-items: center;
    gap: 4px;
}

.dashboard-home .figma-trend-icon {
    width: 14px;
    height: 14px;
    display: block;
    flex: 0 0 14px;
}

.dashboard-home .sale-avatar svg,
.dashboard-home .figma-recent-user-icon {
    width: 16px !important;
    height: 16px !important;
    display: block;
}

.dashboard-home .logout-icon svg,
.dashboard-home .figma-logout-icon {
    width: 20px !important;
    height: 20px !important;
    display: block;
}

.dashboard-home .figma-cert-icon {
    width: 20px;
    height: 20px;
    display: block;
}

.dashboard-home .figma-icon {
    display: block;
    flex: 0 0 auto;
    color: inherit;
}

.dashboard-home .figma-icon[hidden] {
    display: none !important;
}

.dashboard-home .figma-icon--sidebar {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    color: var(--figma-icon-secondary);
}

.dashboard-home .nav-button:hover .figma-icon--sidebar,
.dashboard-home .nav-button:focus-visible .figma-icon--sidebar {
    color: var(--figma-icon-primary);
}

.dashboard-home .nav-button.is-active .figma-icon--sidebar,
.dashboard-home .menu-group.is-open > .nav-button .figma-icon--sidebar {
    color: #FFFFFF;
}

.dashboard-home .nav-button .figma-icon--chevron {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px;
    color: var(--figma-icon-muted);
    transition: transform .16s ease, color .16s ease;
}

.dashboard-home .menu-group.is-open > .nav-button .figma-icon--chevron {
    color: #FFFFFF;
    transform: rotate(90deg);
}

.dashboard-home .figma-chevron-expanded,
.dashboard-home .menu-group.is-open .figma-chevron-collapsed {
    display: none;
}

.dashboard-home .menu-group.is-open .figma-chevron-expanded {
    display: block;
}

.dashboard-home .figma-icon--logout {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    color: var(--figma-icon-muted);
}

.dashboard-home .logout-icon:hover .figma-icon--logout,
.dashboard-home .logout-icon:focus-visible .figma-icon--logout {
    color: var(--figma-icon-secondary);
}

.dashboard-home .figma-icon--cert {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    color: var(--figma-icon-accent);
}

.dashboard-home .figma-icon--search {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px;
    color: var(--figma-icon-muted);
}

.dashboard-home .figma-icon--theme {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    color: var(--figma-icon-muted);
}

.dashboard-home .icon-button .figma-icon--theme-sun {
    display: none !important;
}

:root[data-theme="dark"] .dashboard-home .icon-button .figma-icon--theme-moon {
    display: none !important;
}

:root[data-theme="dark"] .dashboard-home .icon-button .figma-icon--theme-sun {
    display: block !important;
}

:root[data-theme="light"] .dashboard-home .icon-button .figma-icon--theme-moon {
    display: block !important;
}

:root[data-theme="light"] .dashboard-home .icon-button .figma-icon--theme-sun {
    display: none !important;
}

.dashboard-home .icon-button:hover .figma-icon--theme,
.dashboard-home .icon-button:focus-visible .figma-icon--theme {
    color: var(--figma-icon-secondary);
}

.dashboard-home .figma-icon--card {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    color: var(--figma-icon-accent);
}

.dashboard-home .figma-icon--trend {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px;
    color: var(--figma-icon-positive);
}

.dashboard-home .stat-card span.is-down .figma-icon--trend {
    color: var(--figma-icon-negative);
}

.dashboard-home .figma-icon--recent-user {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px;
    color: var(--figma-icon-accent);
}

.page-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 30px;
}

.page-top > div:first-child {
    flex: 0 0 auto;
    min-width: max-content;
}

.page-top h1 {
    margin: 0;
    color: var(--text-strong);
    font-size: 28px;
    line-height: 1.1;
    white-space: nowrap;
}

.page-top p {
    margin: 6px 0 0;
    color: var(--muted);
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.list-actions,
.form-actions {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
    white-space: nowrap;
}

.bulk-options {
    position: relative;
    flex: 0 0 auto;
}

.bulk-options-toggle {
    min-width: 104px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 16px;
    border: 1px solid #c9d5e8;
    border-radius: 10px;
    background: linear-gradient(180deg, #fff, #f5f8fc);
    color: var(--brand);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
    font-weight: 900;
}

.bulk-options-toggle::after {
    content: "";
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
}

.bulk-options-toggle:hover,
.bulk-options.is-open .bulk-options-toggle {
    border-color: rgba(48, 101, 164, .45);
    background: #eef4ff;
    transform: translateY(-1px);
}

.bulk-options-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 80;
    min-width: 178px;
    display: none;
    padding: 6px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .16);
}

.bulk-options.is-open .bulk-options-menu {
    display: grid;
    gap: 4px;
}

.bulk-options-menu button {
    width: 100%;
    padding: 10px 12px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--text-strong);
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    text-align: left;
}

.bulk-options-menu button:hover,
.bulk-options-menu button:focus-visible {
    background: #eef4ff;
    outline: 0;
}

.search-input {
    width: clamp(280px, 30vw, 430px);
    height: 44px;
    display: grid;
    grid-template-columns: 20px 1fr;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    color: var(--muted);
    background: var(--panel);
}

.search-input svg {
    width: 18px;
    height: 18px;
}

.search-input input {
    height: auto;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--text-strong);
    font-size: 13px;
}

.order-origin-filter {
    width: 128px;
    height: 44px;
    margin: 0;
    padding: 0 36px 0 14px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background-color: var(--panel);
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 850;
}

.receivable-top-actions .search-input {
    width: clamp(300px, 32vw, 470px);
}

.filter-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    place-items: center;
    padding: 24px;
    background: rgba(2, 8, 23, .66);
    backdrop-filter: blur(8px);
}

.filter-modal.is-open {
    display: grid;
}

.receivable-filters {
    width: min(760px, 100%);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 16px;
    padding: 24px;
    border: 1px solid var(--list-border, var(--line-soft));
    border-radius: 20px;
    background: var(--list-surface, var(--panel));
    box-shadow: 0 28px 80px rgba(2, 8, 23, .28);
    font-family: "Poppins";
    letter-spacing: 0;
}

:root[data-theme="light"] .filter-modal {
    background: rgba(15, 23, 42, .34);
}

.filter-modal-head {
    grid-column: 1 / -1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--list-border, var(--line-soft));
}

.filter-modal-head h2 {
    margin: 0;
    color: var(--list-text-primary, var(--text-strong));
    font-family: "Poppins";
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
}

.filter-modal-head p {
    margin: 5px 0 0;
    color: var(--list-text-secondary, var(--muted));
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0;
}

.filter-modal-head button {
    width: 36px;
    height: 36px;
    border: 1px solid var(--list-border, var(--line-soft));
    border-radius: 10px;
    color: var(--list-text-primary, var(--text-strong));
    background: var(--list-surface-soft, var(--panel-soft));
    font-size: 23px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
}

.receivable-filters label {
    display: grid;
    gap: 7px;
    color: var(--list-text-primary, var(--text-strong));
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0;
}

.receivable-filters input,
.receivable-filters select {
    width: 100%;
    height: 44px;
    min-width: 0;
    padding: 0 12px;
    border: 1px solid var(--list-border, var(--line-soft));
    border-radius: 10px;
    color: var(--list-text-primary, var(--text-strong));
    background: var(--list-surface, var(--input));
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
}

.receivable-filter-actions {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.receivable-filter-actions .primary-action,
.receivable-filter-actions .ghost-action {
    min-height: 44px;
    padding-inline: 18px;
}

.ghost-action,
.primary-action,
.cancel-action {
    flex: 0 0 auto;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 18px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    color: var(--text-strong);
    background: var(--panel);
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    text-decoration: none;
    box-shadow: none;
    white-space: nowrap;
}

.ghost-action svg {
    width: 18px;
    height: 18px;
}

.primary-action {
    min-width: 158px;
    border-color: var(--brand);
    color: #fff;
    background: var(--brand);
}

.primary-action:hover,
.cancel-action:hover,
.ghost-action:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.page-alert {
    position: fixed;
    top: 22px;
    right: 24px;
    z-index: 40;
    max-width: min(360px, calc(100vw - 32px));
    margin: 0;
    padding: 11px 42px 11px 14px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 12px;
    color: #fff;
    background: rgba(185, 28, 28, .88);
    box-shadow: 0 18px 48px rgba(127, 29, 29, .28);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.35;
    backdrop-filter: blur(8px);
    animation: toast-in .22s ease-out both;
}

.page-alert-close {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 8px;
    color: currentColor;
    background: transparent;
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    transform: translateY(-50%);
    cursor: pointer;
}

.page-alert-close:hover {
    background: color-mix(in srgb, currentColor 12%, transparent);
}

.page-alert.is-hiding {
    opacity: 0;
    transform: translateX(calc(100% + 32px));
    transition: opacity .22s ease, transform .22s ease;
}

.page-alert.is-success {
    border-color: #15803d;
    color: #14532d;
    background: #dcfce7;
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.ciot-minimum-freight-alert {
    display: grid;
    gap: 6px;
    margin: 0 0 18px;
    padding: 18px 20px;
    border: 1px solid #f59e0b;
    border-left: 8px solid #d97706;
    border-radius: 12px;
    color: #7c2d12;
    background: #fffbeb;
    box-shadow: 0 18px 42px rgba(146, 64, 14, .14);
}

.ciot-minimum-freight-alert strong {
    color: #7c2d12;
    font-size: 18px;
    font-weight: 950;
}

.ciot-minimum-freight-alert span {
    color: #92400e;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.45;
}

.lookup-status {
    display: none;
    position: fixed;
    top: 22px;
    right: 24px;
    z-index: 42;
    max-width: min(360px, calc(100vw - 32px));
    margin: 0;
    padding: 11px 14px;
    border: 1px solid rgba(65, 106, 157, .18);
    border-radius: 12px;
    color: var(--brand-strong);
    background: color-mix(in srgb, var(--panel) 88%, rgba(65, 106, 157, .28));
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
    backdrop-filter: blur(12px);
    font-size: 13px;
    font-weight: 800;
    transform: translateX(calc(100% + 32px));
    opacity: 0;
    transition: opacity .22s ease, transform .22s ease;
}

.lookup-status.is-visible {
    display: block;
    opacity: 1;
    transform: translateX(0);
}

.lookup-status.is-hiding {
    opacity: 0;
    transform: translateX(calc(100% + 32px));
}

.lookup-status.is-error {
    border-color: rgba(255, 91, 102, .26);
    color: var(--danger);
    background: color-mix(in srgb, var(--panel) 88%, rgba(255, 91, 102, .2));
}

@keyframes toast-in {
    from {
        opacity: 0;
        transform: translateX(calc(100% + 32px));
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.contacts-card,
.form-card {
    border: 1px solid var(--line-soft);
    border-radius: 18px;
    background: var(--panel);
    overflow: visible;
}

:root[data-theme="light"] .contacts-card,
:root[data-theme="light"] .form-card {
    box-shadow: 0 12px 34px rgba(16, 24, 40, .05);
}

.contacts-card {
    height: min(calc(100svh - 170px), 638px);
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
}

.contacts-card > [data-bulk-payables-form] {
    display: none;
}

.contacts-card > [data-bulk-receivables-delete-form] {
    display: none;
}

.payables-table {
    align-content: start;
}

.contacts-card:has(.payables-table) {
    height: min(calc(100svh - 170px), 638px);
    max-height: none;
}

.payables-table .contacts-scroll {
    max-height: calc(64px * 8);
}

.payables-table .contacts-head {
    min-height: 42px;
}

.payables-table .contacts-row > div:nth-child(2),
.payables-table .contacts-row > span:nth-child(3) {
    min-width: 0;
    overflow: hidden;
}

.payables-table .contacts-row > div:nth-child(2) strong,
.payables-table .contacts-row > div:nth-child(2) small,
.payables-table .contacts-row > span:nth-child(3) {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.payables-table .contacts-row > div:nth-child(2) small {
    font-size: 11px;
}

.finance-accounts-card {
    height: min(calc(100svh - 170px), 620px);
}

.contacts-table {
    min-width: 900px;
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.contacts-scroll {
    min-height: 0;
    height: 100%;
    max-height: calc(64px * 8);
    overflow-y: auto;
    overflow-x: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, .34) transparent;
}

.contacts-scroll::-webkit-scrollbar {
    width: 7px;
}

.contacts-scroll::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(100, 116, 139, .34);
}

.contacts-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.contacts-head,
.contacts-row {
    display: grid;
    grid-template-columns: 2.1fr 1.4fr 1fr 1.1fr .55fr .45fr;
    align-items: center;
    gap: 16px;
    padding: 0 22px;
}

.users-table .contacts-head,
.users-table .contacts-row {
    grid-template-columns: 2fr 1.8fr .8fr 1fr .45fr;
}

.products-table .contacts-head,
.products-table .contacts-row {
    grid-template-columns: 2.1fr 1fr .9fr .55fr .9fr .75fr .45fr;
}

.sellers-table .contacts-head,
.sellers-table .contacts-row {
    grid-template-columns: 2fr 1.8fr .8fr 1.15fr .45fr;
}

.commissions-table .contacts-head,
.commissions-table .contacts-row {
    grid-template-columns: 2.1fr 1.25fr .8fr 1.25fr .9fr .8fr .45fr;
}

.receivables-table .contacts-head,
.receivables-table .contacts-row {
    grid-template-columns: 34px 1.4fr 1.8fr .85fr .85fr .85fr .85fr .45fr;
}

.payables-table .contacts-head,
.payables-table .contacts-row {
    grid-template-columns: 34px 1.4fr 1.8fr .85fr .85fr .85fr .85fr .45fr;
}

.finance-accounts-table .contacts-head,
.finance-accounts-table .contacts-row {
    grid-template-columns: 1.8fr .85fr 1fr 1.15fr .9fr .45fr;
}

.fiscal-report-table .contacts-head,
.fiscal-report-table .contacts-row {
    grid-template-columns: 1fr 1.7fr 1.5fr 1fr .85fr .85fr .85fr;
}

.rcr-report-table .contacts-head,
.rcr-report-table .contacts-row {
    grid-template-columns: 1.6fr 1fr 1fr 1fr .85fr .85fr .85fr;
}

.rcr-report-table.contacts-table {
    height: auto;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-card.fiscal-report-group {
    height: auto;
    min-height: 0;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .rcr-report-table.contacts-table {
    height: auto;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-filters-row.rcr-report-filters-row {
    grid-template-columns: minmax(160px, 200px) minmax(140px, 170px) minmax(140px, 170px) minmax(140px, 190px);
}

.rcr-client-head.page-top {
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 0 !important;
    min-height: 56px !important;
    padding: 14px 22px !important;
}

.rcr-client-head .fiscal-report-group-title,
.rcr-client-head .fiscal-report-group-title h3 {
    margin: 0;
    line-height: 1.2;
}

.fiscal-report-group.contacts-card {
    height: auto;
    max-height: none;
    display: block;
    margin-top: 20px;
    padding-bottom: 18px;
}

.fiscal-report-group .contacts-table {
    display: block;
    min-width: 0;
}

.fiscal-report-group .contacts-scroll {
    max-height: min(60vh, 620px) !important;
    height: auto !important;
    overflow-x: auto;
    padding-bottom: 24px;
}

.fiscal-report-group .contacts-row {
    min-height: 54px !important;
    border-bottom: 1px solid var(--line-soft);
}

.fiscal-report-group .contacts-row:last-child {
    border-bottom: 0;
}

.fiscal-report-group-head {
    padding: 16px 22px;
    margin-bottom: 0;
}

.fiscal-report-group-title {
    display: flex;
    align-items: center;
    gap: 10px;
}

.fiscal-report-group-title h3 {
    margin: 0;
    color: var(--text-strong);
    font-size: 15px;
}

.fiscal-report-group-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: var(--panel-soft);
    color: var(--brand-strong);
}

.fiscal-report-group-icon svg {
    width: 16px;
    height: 16px;
}

.fiscal-report-group-head > span {
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 700;
}

.fiscal-report-key {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--muted);
    font-size: 11.5px;
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}

.fiscal-report-form {
    display: grid;
    gap: 22px;
}

.fiscal-report-filters-row {
    display: flex;
    align-items: flex-end;
    flex-wrap: nowrap;
    gap: 16px;
    overflow-x: auto;
}

.fiscal-report-filters-row label {
    display: grid;
    flex: 0 0 auto;
    gap: 9px;
    margin: 0;
    color: var(--text-strong);
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.fiscal-report-filters-row input,
.fiscal-report-filters-row select {
    width: 170px;
    min-height: 44px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-weight: 700;
    outline: 0;
}

.fiscal-report-form-actions {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    flex: 0 0 auto;
    gap: 10px;
    margin-left: auto;
    padding-left: 12px;
}

.fiscal-report-types-label {
    display: block;
    margin-bottom: 10px;
    color: var(--muted-strong);
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.fiscal-report-types-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.fiscal-type-chip {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel-soft);
    color: var(--muted-strong);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.fiscal-type-chip svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.fiscal-type-chip input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: var(--brand-strong);
}

.fiscal-type-chip:has(input:checked) {
    border-color: var(--brand-strong);
    background: color-mix(in srgb, var(--brand-strong) 12%, var(--panel-soft));
    color: var(--text-strong);
}

.fiscal-report-stats {
    margin-top: 20px;
}

.fiscal-report-summary-head {
    padding: 20px 22px 0;
    margin-bottom: 0;
}

.fiscal-report-summary-head h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: 17px;
}

.fiscal-report-summary-head p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.dashboard:has(.fiscal-report-form) .dash-main {
    padding: 32px;
    background: var(--list-page-bg);
}

.dashboard:has(.fiscal-report-form) .page-top {
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 20px;
}

.dashboard:has(.fiscal-report-form) .page-top h1 {
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
}

.dashboard:has(.fiscal-report-form) .page-top p {
    margin-top: 4px;
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0;
}

.dashboard:has(.fiscal-report-form) .form-card {
    border-color: var(--list-border);
    border-radius: 20px;
    background: var(--list-surface);
    box-shadow: none;
    overflow: hidden;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-form {
    gap: 20px;
    padding: 24px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-filters-row {
    display: grid;
    grid-template-columns: minmax(160px, 180px) minmax(150px, 180px) minmax(0, 1fr);
    align-items: end;
    gap: 16px;
    overflow: visible;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-filters-row label {
    gap: 7px;
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0;
    white-space: normal;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-filters-row input,
.dashboard:has(.fiscal-report-form) .fiscal-report-filters-row select {
    width: 100%;
    min-height: 44px;
    border-color: var(--list-border);
    border-radius: 10px;
    color: var(--list-text-primary);
    background: var(--list-surface);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    box-shadow: none;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-form-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin-left: 0;
    padding-left: 0;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-form-actions .primary-action,
.dashboard:has(.fiscal-report-form) .fiscal-report-form-actions .ghost-action {
    min-height: 44px;
    border-radius: 10px;
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-types {
    padding-top: 18px;
    border-top: 1px solid var(--list-border);
}

.dashboard:has(.fiscal-report-form) .fiscal-report-types-label {
    margin-bottom: 12px;
    color: var(--list-text-secondary);
    font-family: "Inter";
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .6px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-types-list {
    gap: 8px;
}

.dashboard:has(.fiscal-report-form) .fiscal-type-chip {
    min-height: 40px;
    padding: 0 12px;
    border-color: var(--list-border);
    border-radius: 10px;
    color: var(--list-text-secondary);
    background: var(--list-surface-soft);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
}

.dashboard:has(.fiscal-report-form) .fiscal-type-chip:has(input:checked) {
    border-color: #3b608f;
    color: #ffffff;
    background: #3b608f;
}

.dashboard:has(.fiscal-report-form) .fiscal-type-chip input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #3b608f;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-stats {
    gap: 18px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-stats .stat-card {
    min-height: 116px;
    border-color: var(--list-border);
    border-radius: 12px;
    background: var(--list-surface);
    box-shadow: none;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-stats .stat-card small {
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-stats .stat-card strong {
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 18px;
    font-weight: 600;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-summary-head {
    padding: 0;
    margin: 0 0 16px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-summary-head h2 {
    margin: 0;
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-summary-head p {
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group.contacts-card {
    margin-top: 16px;
    padding-bottom: 0;
    border-color: var(--list-border);
    border-radius: 20px;
    background: var(--list-surface);
    overflow: hidden;
    box-shadow: none;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group-head {
    min-height: 64px;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid var(--list-border);
    background: var(--list-surface);
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group-title {
    gap: 10px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group-title h3 {
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group-icon {
    width: 32px;
    height: 32px;
    border: 1px solid var(--list-border);
    border-radius: 10px;
    color: #3b608f;
    background: var(--list-surface-soft);
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group-head > span {
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group .contacts-table {
    min-width: 960px;
    background: var(--list-surface);
}

.dashboard:has(.fiscal-report-form) .fiscal-report-table .contacts-head,
.dashboard:has(.fiscal-report-form) .fiscal-report-table .contacts-row {
    grid-template-columns: minmax(110px, .9fr) minmax(180px, 1.6fr) minmax(160px, 1.3fr) minmax(120px, .9fr) minmax(112px, .85fr) minmax(112px, .85fr) minmax(100px, .8fr);
    gap: 14px;
    padding-right: 20px;
    padding-left: 20px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-table .contacts-head {
    min-height: 50px;
    border-bottom: 1px solid var(--list-border);
    color: var(--list-text-primary);
    font-family: "Inter";
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .6px;
    text-transform: uppercase;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group .contacts-scroll {
    max-height: min(58vh, 600px) !important;
    padding-bottom: 0;
    overflow: auto;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group .contacts-row {
    min-height: 64px !important;
    border-bottom-color: var(--list-row-border);
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group .contacts-row:hover {
    background: var(--list-hover-bg);
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group .contacts-row > span,
.dashboard:has(.fiscal-report-form) .fiscal-report-group .contacts-row > strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-key {
    color: var(--list-text-secondary);
    font-size: 11px;
}

.dashboard:has(.fiscal-report-form) .fiscal-report-group .type-pill {
    min-height: 24px;
    padding: 3px 9px;
    border-radius: 20px;
    font-family: "Poppins";
    font-size: 11px;
    font-weight: 600;
}

@media (max-width: 1120px) {
    .dashboard:has(.fiscal-report-form) .fiscal-report-filters-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard:has(.fiscal-report-form) .fiscal-report-form-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .dashboard:has(.fiscal-report-form) .dash-main {
        padding: 24px 16px;
    }

    .dashboard:has(.fiscal-report-form) .fiscal-report-form {
        padding: 20px;
    }

    .dashboard:has(.fiscal-report-form) .fiscal-report-filters-row {
        grid-template-columns: 1fr;
    }

    .dashboard:has(.fiscal-report-form) .fiscal-report-form-actions .primary-action,
    .dashboard:has(.fiscal-report-form) .fiscal-report-form-actions .ghost-action {
        width: 100%;
    }
}

.stock-table .contacts-head,
.stock-table .contacts-row {
    grid-template-columns: minmax(210px, 2fr) minmax(108px, .85fr) 54px minmax(82px, .75fr) minmax(96px, .8fr) minmax(108px, .8fr) 42px;
    gap: 12px;
}

.stock-history-table .contacts-head,
.stock-history-table .contacts-row {
    grid-template-columns: minmax(118px, .9fr) minmax(210px, 1.8fr) minmax(86px, .75fr) minmax(80px, .75fr) minmax(128px, 1fr) minmax(96px, .8fr);
    gap: 12px;
}

.tiny-stock-reconciliation-table .contacts-head,
.tiny-stock-reconciliation-table .contacts-row {
    grid-template-columns: minmax(190px, 1.7fr) 82px 82px 92px minmax(160px, 1.35fr) 100px 132px;
    gap: 10px;
}

.tiny-stock-reconciliation-table .contacts-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.purchase-table .contacts-head,
.purchase-table .contacts-row {
    grid-template-columns: minmax(180px, 1.25fr) minmax(220px, 1.4fr) 110px 110px 170px 90px;
    gap: 12px;
}

.purchase-items-table .contacts-head,
.purchase-items-table .contacts-row {
    grid-template-columns: 56px minmax(260px, 1fr) 120px 110px 110px;
    gap: 12px;
}

.mp-finance-table .contacts-head,
.mp-finance-table .contacts-row {
    grid-template-columns: .9fr 1.35fr 1.3fr 1fr .75fr .8fr .45fr;
}

.cashflow-table .contacts-head,
.cashflow-table .contacts-row {
    grid-template-columns: minmax(74px, .75fr) minmax(150px, 1.8fr) minmax(72px, .75fr) minmax(86px, 1fr) minmax(80px, .85fr) minmax(100px, 1.1fr) minmax(88px, .9fr) 48px;
    gap: 12px;
}

.cashflow-table .contacts-head > *,
.cashflow-table .contacts-row > * {
    min-width: 0;
}

.cashflow-table .contacts-row > span,
.cashflow-table .contacts-row > strong,
.cashflow-table .contacts-row > div:not(.action-cell) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-table .contacts-row > span.cashflow-cliente {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    line-height: 1.25;
    align-self: center;
}

.cashflow-table .contacts-row > div:not(.action-cell) strong,
.cashflow-table .contacts-row > div:not(.action-cell) small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-table .contacts-row > div.cashflow-historico,
.cashflow-table .contacts-row > div.cashflow-historico strong {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    line-height: 1.25;
}

.cashflow-table .contacts-row > div.cashflow-historico {
    align-self: center;
}

.cashflow-account-tabs {
    display: flex;
    min-height: 50px;
    margin: 12px 12px 0;
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel-soft);
}

.cashflow-account-tab {
    display: flex;
    flex: 1 0 180px;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 20px;
    border-right: 1px solid var(--line);
    color: var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--panel));
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}

.cashflow-account-tab:last-child {
    border-right: 0;
}

.cashflow-account-tab:first-child {
    border-radius: 9px 0 0 9px;
}

.cashflow-account-tab:last-child {
    border-radius: 0 9px 9px 0;
}

.cashflow-account-tab:hover {
    color: var(--text-strong);
    background: color-mix(in srgb, var(--brand) 18%, var(--panel));
}

.cashflow-account-tab.is-active {
    color: #fff;
    background: var(--brand);
    box-shadow: inset 0 -3px 0 var(--brand-strong);
}

.cashflow-card {
    height: min(calc(100svh - 180px), 690px);
    min-width: 0;
    max-width: 100%;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
}

.cashflow-card .contacts-scroll {
    max-height: none;
}

.cashflow-card .cashflow-table {
    width: 100%;
    min-width: 0;
}

.cashflow-filters {
    width: min(820px, 100%);
    grid-template-columns: minmax(170px, .8fr) repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 24px;
}

.cashflow-filters .receivable-filter-actions {
    margin-top: 2px;
    padding-top: 16px;
    border-top: 1px solid var(--list-border, var(--line-soft));
}

.accounts-filters {
    width: min(900px, 100%);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    padding: 24px;
}

.accounts-filters .filter-modal-head {
    padding-bottom: 16px;
    border-bottom: 1px solid var(--list-border, var(--line-soft));
}

.accounts-filters .accounts-filter-party {
    grid-column: span 2;
}

.accounts-filters .accounts-filter-period {
    grid-column: span 2;
}

.accounts-filters .receivable-filter-actions {
    margin-top: 2px;
    padding-top: 16px;
    border-top: 1px solid var(--list-border, var(--line-soft));
}

@media (min-width: 769px) {
    .cashflow-dashboard {
        height: 100svh;
        min-height: 0;
        overflow: hidden;
    }

    .cashflow-dashboard .dash-main {
        height: 100svh;
        min-height: 0;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        gap: 18px;
        overflow: hidden;
        padding-right: 48px;
        padding-left: 48px;
    }

    .dashboard-home {
        height: 100svh;
        min-height: 0;
        overflow: hidden;
    }

    .dashboard-home .dash-main {
        height: 100svh;
        min-height: 0;
        display: grid;
        grid-template-rows: auto auto minmax(0, 1fr);
        overflow: hidden;
    }

    .dashboard-home .stats-grid,
    .dashboard-home .dash-top {
        min-height: 0;
    }

    .dashboard-home .dashboard-grid {
        min-height: 0;
        height: 100%;
    }

    .dashboard-home .chart-card,
    .dashboard-home .recent-card {
        height: 100%;
        min-height: 0;
    }

    .dashboard-home .recent-list {
        overflow-y: auto;
    }

    .cashflow-dashboard .page-top {
        margin-bottom: 0;
    }

    .cashflow-dashboard .page-top > div:first-child {
        min-width: 0;
    }

    .cashflow-dashboard .page-top p {
        white-space: normal;
    }

    .cashflow-dashboard .receivable-top-actions .search-input {
        width: clamp(260px, 25vw, 360px);
    }

    .cashflow-dashboard .cashflow-card {
        height: auto;
        min-height: 0;
    }
}

@media (max-width: 700px) {
    .cashflow-filters {
        grid-template-columns: 1fr;
    }

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

    .accounts-filters .accounts-filter-party,
    .accounts-filters .accounts-filter-period {
        grid-column: 1 / -1;
    }
}

@media (max-width: 480px) {
    .accounts-filters {
        grid-template-columns: 1fr;
        padding: 20px;
    }
}

.orders-table .contacts-head,
.orders-table .contacts-row {
    grid-template-columns: minmax(145px, .95fr) minmax(150px, 1.45fr) .82fr minmax(145px, 1.15fr) minmax(120px, .92fr) .82fr .42fr;
}

.fiscal-list-document {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
    min-height: 36px;
    padding: 5px 8px;
    border: 1px solid var(--list-border, var(--line-soft));
    border-radius: 10px;
    color: var(--list-text-primary, var(--text-strong));
    background: var(--list-surface-soft, var(--panel-soft));
}

.fiscal-list-document img {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    object-fit: contain;
}

.fiscal-list-document > span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.fiscal-list-document strong {
    color: currentColor;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.1;
}

.fiscal-list-document small {
    width: fit-content;
    max-width: 100%;
    border: 0;
    border-radius: 999px;
    padding: 0;
    color: currentColor;
    background: transparent;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
}

.fiscal-list-document.is-authorized {
    border-color: rgba(34, 197, 94, .35);
    color: #86efac;
    background: rgba(34, 197, 94, .14);
}

.fiscal-list-document.is-cancelled,
.fiscal-list-document.is-error {
    border-color: rgba(239, 68, 68, .35);
    color: #fca5a5;
    background: rgba(239, 68, 68, .14);
}

.fiscal-list-document.is-rejected {
    border-color: rgba(245, 158, 11, .35);
    color: #fcd34d;
    background: rgba(245, 158, 11, .14);
}

:root[data-theme="light"] .fiscal-list-document.is-authorized {
    color: #047857;
    background: #dcfce7;
}

:root[data-theme="light"] .fiscal-list-document.is-cancelled,
:root[data-theme="light"] .fiscal-list-document.is-error {
    color: #b91c1c;
    background: #fee2e2;
}

:root[data-theme="light"] .fiscal-list-document.is-rejected {
    color: #b45309;
    background: #fef3c7;
}

.fiscal-list-empty {
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
}

.order-receivable-indicator {
    display: block;
    margin-top: 4px;
    color: var(--success);
    font-size: 11px;
    font-weight: 800;
}

.order-payment-cell {
    display: grid;
    align-content: center;
    gap: 3px;
    min-width: 0;
}

.order-payment-method {
    display: block;
    max-width: 100%;
    color: var(--list-text-primary, var(--text-strong));
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.order-payment-status {
    width: fit-content;
    max-width: 100%;
    margin-top: 0;
    color: var(--list-text-secondary, var(--muted));
    font-family: "Poppins";
    font-size: 11px;
    font-weight: 500;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.order-origin-pill {
    min-width: 18px;
    min-height: 18px;
    margin-left: 0;
    padding: 0 5px;
    font-size: 9px;
    line-height: 1;
    vertical-align: middle;
}

.order-origin-pill.is-pdv {
    border-color: #17c979;
    color: #047857;
    background: rgba(23, 201, 121, .14);
}

.order-origin-pill.is-order {
    border-color: #5a96ff;
    color: #2563eb;
    background: rgba(90, 150, 255, .12);
}

.order-origin-pill.is-consignment {
    border-color: #f0b84f;
    color: #b7791f;
    background: rgba(240, 184, 79, .16);
}

.order-origin-pill.is-tele-venda {
    border-color: #8b5cf6;
    color: #6d28d9;
    background: rgba(139, 92, 246, .16);
}

.orders-footer-totals {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 30px;
    color: var(--text-strong);
}

.orders-footer-totals strong {
    display: grid;
    gap: 3px;
    min-width: 88px;
    text-align: right;
    font-size: 13px;
    font-weight: 950;
}

.orders-footer-totals small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.consignments-table .contacts-head,
.consignments-table .contacts-row {
    grid-template-columns: .9fr 1.8fr .8fr .8fr .95fr .95fr .45fr;
}

.consign-items-list,
.consign-settle-list {
    display: grid;
    gap: 8px;
}

.consign-items-head,
.consign-item-row {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 150px 160px;
    gap: 10px;
    align-items: end;
}

.consign-items-head,
.consign-settle-head {
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
}

.consign-item-row select,
.consign-item-row input,
.consign-settle-row input {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font-weight: 800;
}

.consign-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr));
    gap: 12px;
}

.consign-summary article {
    display: grid;
    gap: 5px;
    min-height: 72px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 12px;
    background: color-mix(in srgb, var(--input) 78%, var(--panel) 22%);
}

.consign-summary span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.consign-summary strong {
    color: var(--text-strong);
    font-size: 15px;
    font-weight: 950;
}

.consign-settle-head,
.consign-settle-row {
    display: grid;
    grid-template-columns: minmax(240px, 1.6fr) repeat(4, minmax(82px, .55fr)) minmax(118px, .7fr) minmax(118px, .7fr);
    gap: 8px;
    align-items: center;
}

.consign-settle-row {
    min-height: 58px;
    border-bottom: 1px solid var(--line-soft);
    padding: 7px 0;
}

.consign-settle-row strong,
.consign-settle-row span {
    color: var(--text-strong);
    font-weight: 850;
}

.consign-settle-row small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.nfce-list-status {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 4px;
    border: 1px solid currentColor;
    border-radius: 999px;
    padding: 2px 10px;
    font-size: 11px;
    font-weight: 950;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

.nfce-list-status.is-authorized {
    color: #047857;
    background: #d1fae5;
}

.nfce-list-status.is-error {
    color: #b91c1c;
    background: #fff7ed;
}

.receivable-totals {
    min-width: min(620px, 100%);
    display: grid;
    gap: 5px;
    color: var(--text-strong);
    font-size: 12px;
}

.receivable-total-head,
.receivable-total-values {
    display: grid;
    grid-template-columns: .7fr 1.15fr 1.15fr 1.15fr 1.15fr;
    align-items: center;
    gap: 14px;
    text-align: right;
}

.receivable-total-head {
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.receivable-total-head span:first-child,
.receivable-total-values strong:first-child {
    text-align: left;
}

.receivable-totals span,
.receivable-totals strong {
    white-space: nowrap;
}

.receivable-totals .is-danger {
    color: var(--danger);
}

.cashflow-totals {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
    flex-wrap: wrap;
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
}

.cashflow-totals strong {
    margin-left: 6px;
    color: var(--text-strong);
}

.cash-in {
    color: var(--success);
}

.cash-out {
    color: var(--danger);
}

.stock-main {
    height: 100svh;
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-height: 0;
    overflow: hidden;
}

.stock-main .page-top {
    align-items: flex-start;
}

.stock-main .page-top > div:first-child {
    min-width: 0;
}

.stock-main .page-top p {
    white-space: normal;
}

.stock-main .list-actions {
    flex-wrap: wrap;
    min-width: min(100%, 600px);
}

.stock-main .search-input {
    flex: 1 1 280px;
    width: auto;
}

.filter-select {
    min-width: 160px;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--panel);
    font-weight: 800;
}

.date-filter {
    min-width: 138px;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--panel);
    font-weight: 800;
}

.mp-finance-top {
    display: grid;
    grid-template-columns: minmax(250px, 390px) minmax(0, 1fr) auto;
    align-items: start;
    gap: 14px;
    margin-bottom: 16px;
}

.mp-finance-top > div:first-child {
    min-width: 0;
}

.mp-finance-top h1,
.mp-finance-top p {
    white-space: normal;
}

.mp-finance-actions {
    display: grid;
    grid-template-columns: minmax(260px, 1.5fr) minmax(132px, .58fr) minmax(132px, .58fr) 138px 138px auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    overflow: visible;
    padding-bottom: 0;
}

.mp-finance-actions .search-input {
    width: auto;
    min-width: 0;
}

.mp-finance-actions .filter-select,
.mp-finance-actions .date-filter,
.mp-finance-actions .secondary-action {
    width: 100%;
    min-width: 0;
}

.mp-sync-form {
    display: flex;
    justify-content: flex-end;
    min-width: 0;
}

.mp-sync-form .primary-action {
    height: 44px;
    padding-inline: 18px;
    white-space: nowrap;
}

.mp-finance-summary {
    margin-bottom: 2px;
}

.mp-finance-card {
    height: min(calc(100svh - 230px), 700px);
}

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

.stock-summary article {
    min-height: 86px;
    display: grid;
    align-content: center;
    gap: 8px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 16px 18px;
    background: var(--panel);
    box-shadow: var(--shadow);
}

.stock-summary span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.stock-summary strong {
    color: var(--text-strong);
    font-size: 24px;
    line-height: 1;
}

.stock-movement-card {
    height: auto;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 18px 20px;
}

.stock-movement-head {
    display: flex;
    align-items: baseline;
    gap: 12px;
    min-width: 0;
}

.stock-movement-head p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.35;
    white-space: nowrap;
}

.stock-movement-card h2,
.section-inline-head h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: 18px;
}

.stock-movement-fields {
    display: grid;
    grid-template-columns: minmax(240px, 1.7fr) minmax(130px, .65fr) minmax(150px, .7fr) minmax(200px, 1fr) auto;
    align-items: end;
    gap: 12px;
    min-width: 0;
}

.stock-movement-card label {
    display: grid;
    gap: 7px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 900;
}

.stock-movement-card input,
.stock-movement-card select,
.stock-movement-card textarea {
    width: 100%;
    min-height: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 11px 12px;
    color: var(--text-strong);
    background: var(--panel);
    font: inherit;
    font-weight: 700;
    resize: vertical;
}

.stock-movement-card .primary-action {
    min-height: 44px;
    align-self: end;
    white-space: nowrap;
}

.stock-card,
.stock-history-card {
    min-width: 0;
    overflow: hidden;
}

.stock-card {
    width: 100%;
    height: auto;
    min-height: 0;
    flex: 1 1 auto;
}

.stock-card .contacts-table {
    height: 100%;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.stock-card .contacts-scroll {
    min-height: 0;
}

.stock-row-options {
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    color: var(--muted);
    background: transparent;
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
}

.stock-row-options:hover,
.stock-row-options:focus-visible {
    color: var(--brand);
    border-color: color-mix(in srgb, var(--brand) 45%, var(--line-soft));
    background: color-mix(in srgb, var(--brand) 8%, transparent);
}

.stock-history-card {
    height: auto;
    min-height: 0;
}

.stock-history-card .contacts-table {
    grid-template-rows: auto auto;
}

.stock-history-card .contacts-scroll {
    max-height: 260px;
}

.stock-history-card .empty-row {
    min-height: 72px;
    display: flex;
    align-items: center;
}

.purchase-sync-status {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 14px;
    border: 1px solid rgba(66, 111, 164, .24);
    border-radius: 10px;
    background: rgba(66, 111, 164, .08);
    color: var(--text);
    padding: 10px 12px;
    line-height: 1.35;
}

.purchase-sync-status strong {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.purchase-sync-status span {
    min-width: 0;
    overflow-wrap: anywhere;
    font-weight: 800;
}

.purchase-table .contacts-row small,
.purchase-items-table .contacts-row small {
    overflow-wrap: anywhere;
}

.purchase-open-row {
    cursor: pointer;
}

.purchase-open-row:hover {
    background: rgba(66, 111, 164, .12);
}

.purchase-open-row:focus-visible {
    outline: 2px solid var(--brand);
    outline-offset: -2px;
}

.purchase-import-card {
    max-width: 720px;
}

.purchase-import-card form {
    display: grid;
    gap: 12px;
    padding-top: 12px;
}

.purchase-search-actions {
    min-width: 120px;
}

.purchase-page-top {
    align-items: flex-start;
    gap: 16px;
}

.purchase-page-top > div:first-child {
    flex: 1 1 320px;
    min-width: 280px;
    max-width: 520px;
}

.purchase-page-top p {
    white-space: normal;
    line-height: 1.35;
}

.purchase-top-actions {
    flex: 1 1 620px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(150px, 170px) minmax(96px, 112px) minmax(126px, 146px);
    column-gap: 16px;
    row-gap: 10px;
    align-items: center;
    justify-content: stretch;
}

.purchase-top-actions .search-input {
    width: 100%;
    min-width: 0;
}

.purchase-top-actions .secondary-action,
.purchase-top-actions .primary-action {
    width: 100%;
    min-width: 0;
}

.purchase-top-actions .action-cell {
    min-width: 0;
}

.purchase-search-actions > .primary-action {
    width: 100%;
}

.purchase-list-totals {
    display: grid;
    grid-template-columns: repeat(4, minmax(92px, auto));
    gap: 18px;
    align-items: center;
}

.purchase-list-totals span {
    display: grid;
    gap: 2px;
    color: var(--text);
    font-weight: 900;
    text-align: center;
}

.purchase-list-totals strong {
    color: var(--muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.purchase-search-modal-card {
    width: min(980px, calc(100vw - 28px));
    max-height: min(90vh, 820px);
    overflow: auto;
}

.purchase-modal-summary {
    margin: 12px 0;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

.purchase-modal-summary article {
    min-width: 0;
    padding: 14px 12px;
}

.purchase-modal-summary strong {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
    font-size: clamp(17px, 1.5vw, 22px);
    line-height: 1.08;
}

.purchase-modal-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
    padding-top: 12px;
}

.purchase-modal-form.compact {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 240px);
}

.purchase-modal-form label {
    display: grid;
    gap: 8px;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 800;
}

.purchase-modal-form input,
.purchase-modal-form select,
.purchase-modal-form textarea {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-weight: 750;
    outline: 0;
}

.purchase-modal-form textarea {
    min-height: 92px;
    padding-top: 10px;
    resize: vertical;
}

.purchase-modal-form input:focus,
.purchase-modal-form select:focus,
.purchase-modal-form textarea:focus {
    border-color: rgba(66, 111, 164, .58);
    box-shadow: 0 0 0 3px rgba(66, 111, 164, .14);
}

.purchase-modal-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.purchase-timer-status {
    display: grid;
    gap: 4px;
    margin: 12px 0 4px;
    border: 1px solid rgba(66, 111, 164, .28);
    border-radius: 10px;
    background: rgba(66, 111, 164, .08);
    padding: 11px 12px;
}

.purchase-timer-status strong {
    color: var(--text-strong);
    font-size: 14px;
}

.purchase-timer-status span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.checkbox-line {
    height: 44px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text);
    font-size: 13px;
    font-weight: 850;
}

.checkbox-line input {
    width: 16px;
    height: 16px;
    margin: 0;
}

.ghost-action.is-danger {
    border-color: rgba(244, 84, 108, .38);
    color: var(--danger);
}

.purchase-search-log {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.purchase-search-log h3 {
    margin: 0;
    color: var(--text);
    font-size: 15px;
}

.purchase-search-log div {
    display: grid;
    grid-template-columns: minmax(120px, .7fr) minmax(120px, .55fr) minmax(0, 1.75fr);
    gap: 10px;
    align-items: center;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 9px 10px;
    background: var(--panel-soft);
}

.purchase-search-log strong,
.purchase-search-log span,
.purchase-search-log small {
    min-width: 0;
}

.purchase-search-log small {
    color: var(--muted);
    font-weight: 750;
    overflow-wrap: anywhere;
}

.purchase-danfe-modal-card {
    width: 80vw;
    max-width: 1680px;
    min-width: min(980px, calc(100vw - 18px));
    max-height: min(92vh, 860px);
    overflow: auto;
}

.purchase-danfe-modal-card [data-purchase-danfe-content] {
    min-width: 0;
}

.purchase-stock-modal-card {
    width: min(1280px, calc(100vw - 24px));
    max-width: min(1280px, calc(100vw - 24px));
    max-height: min(92vh, 860px);
    overflow: auto;
}

.purchase-stock-map {
    display: grid;
    gap: 14px;
}

.purchase-stock-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 12px;
    background: rgba(66, 111, 164, .08);
}

.purchase-stock-head h3 {
    margin: 0 0 4px;
    font-size: 18px;
}

.purchase-stock-head p {
    margin: 0;
    color: var(--muted);
    font-weight: 700;
}

.purchase-cost-mode {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) repeat(3, minmax(170px, 1fr));
    gap: 10px;
    align-items: stretch;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 12px;
    background: var(--panel);
}

.purchase-cost-mode > div,
.purchase-cost-mode label {
    min-width: 0;
}

.purchase-cost-mode > div strong,
.purchase-cost-mode label span {
    display: block;
    color: var(--text-strong);
    font-weight: 950;
}

.purchase-cost-mode > div span,
.purchase-cost-mode label small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
}

.purchase-cost-mode label {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 3px 8px;
    align-content: start;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    background: color-mix(in srgb, var(--input) 82%, transparent);
}

.purchase-cost-mode label input {
    grid-row: 1 / span 2;
    margin-top: 2px;
}

.purchase-stock-list {
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    overflow: hidden;
}

.purchase-stock-list-head,
.purchase-stock-row {
    display: grid;
    grid-template-columns: minmax(240px, 1.35fr) minmax(220px, 1.1fr) minmax(150px, .65fr) minmax(240px, 1fr);
    gap: 12px;
    align-items: center;
    padding: 10px 12px;
}

.purchase-stock-list-head {
    background: rgba(66, 111, 164, .12);
    color: var(--text);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.purchase-stock-row {
    border-top: 1px solid var(--line-soft);
}

.purchase-stock-row > *,
.purchase-stock-list-head > * {
    min-width: 0;
}

.purchase-stock-row strong {
    display: block;
    overflow-wrap: anywhere;
}

.purchase-stock-row small {
    display: block;
    color: var(--muted);
    font-weight: 700;
    margin-top: 4px;
    overflow-wrap: anywhere;
}

.purchase-stock-row label {
    margin: 0;
}

.purchase-stock-row select {
    width: 100%;
}

.purchase-stock-actions {
    display: grid;
    grid-template-columns: minmax(160px, 220px) minmax(220px, 1fr);
    gap: 12px;
    justify-content: end;
}

.purchase-danfe {
    background: #fff;
    color: #07122a;
    border: 1px solid #1f4f8c;
    border-radius: 10px;
    padding: 16px;
    font-family: Arial, Helvetica, sans-serif;
}

.purchase-danfe-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    gap: 12px;
    align-items: stretch;
    border-bottom: 2px solid #07122a;
    padding-bottom: 10px;
}

.purchase-danfe-header h3 {
    margin: 0 0 5px;
    font-size: 17px;
    line-height: 1.2;
    text-transform: uppercase;
}

.purchase-danfe-header p,
.purchase-danfe-access span,
.purchase-danfe-grid span,
.purchase-danfe-footer span {
    margin: 0;
    color: #26334d;
    font-size: 12px;
    font-weight: 700;
}

.purchase-danfe-box {
    border: 1px solid #07122a;
    border-radius: 8px;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 10px;
}

.purchase-danfe-box strong {
    font-size: 22px;
}

.purchase-danfe-box span {
    font-size: 12px;
    font-weight: 700;
}

.purchase-danfe-access {
    text-align: center;
    padding: 10px 0;
    border-bottom: 1px dashed #07122a;
}

.purchase-danfe-access strong {
    display: block;
    font-size: 14px;
    letter-spacing: .4px;
    overflow-wrap: anywhere;
}

.purchase-danfe-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px dashed #07122a;
}

.purchase-danfe-grid div,
.purchase-danfe-footer div {
    border: 1px solid #c7d2e2;
    border-radius: 8px;
    padding: 8px;
}

.purchase-danfe-grid strong,
.purchase-danfe-footer strong {
    display: block;
    margin-top: 3px;
    font-size: 14px;
}

.purchase-danfe-warning {
    margin: 10px 0;
    border-radius: 8px;
    background: rgba(245, 158, 11, .16);
    color: #8a4b00;
    padding: 10px;
    font-weight: 800;
}

.purchase-danfe-section {
    padding-top: 10px;
}

.purchase-danfe-section h4 {
    margin: 0 0 8px;
    font-size: 15px;
    text-transform: uppercase;
}

.purchase-danfe-items {
    border: 1px solid #07122a;
    border-radius: 8px;
    overflow: hidden;
}

.purchase-danfe-items-head,
.purchase-danfe-item {
    display: grid;
    grid-template-columns: 76px minmax(220px, 1fr) 80px 54px 92px 92px;
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
}

.purchase-danfe-items-head {
    background: #eef3f9;
    font-weight: 900;
    font-size: 12px;
    text-transform: uppercase;
}

.purchase-danfe-item {
    border-top: 1px solid #d8e0ec;
    font-size: 13px;
}

.purchase-danfe-item span:nth-child(2) {
    font-weight: 800;
}

.purchase-danfe-empty {
    padding: 18px;
    text-align: center;
    color: #667085;
    font-weight: 800;
}

.purchase-danfe-footer {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.purchase-nfe-view {
    border-color: #d7dde8;
    border-radius: 8px;
    box-shadow: none;
    font-size: 13px;
    max-width: 100%;
    overflow-x: hidden;
}

.purchase-nfe-title {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    border-bottom: 1px solid #d7dde8;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.purchase-nfe-title h3 {
    margin: 0;
    font-size: 20px;
    color: #07122a;
}

.purchase-nfe-title p {
    margin: 4px 0 0;
    color: #667085;
    font-weight: 700;
}

.purchase-nfe-status span {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 900;
}

.purchase-nfe-status .is-ok {
    color: #067647;
    background: #d1fadf;
}

.purchase-nfe-status .is-warn {
    color: #92400e;
    background: #fef3c7;
}

.purchase-nfe-status .is-error {
    color: #b42318;
    background: #fee4e2;
}

.purchase-nfe-message {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    border: 1px solid #e4e9f2;
    background: #f8fafc;
    border-radius: 8px;
    padding: 10px;
    color: #475467;
    overflow-wrap: anywhere;
}

.purchase-nfe-panel {
    border-top: 1px solid #d7dde8;
    padding-top: 12px;
    margin-top: 12px;
}

.purchase-nfe-panel h4 {
    margin: 0 0 10px;
    color: #07122a;
    font-size: 15px;
}

.purchase-nfe-grid {
    display: grid;
    gap: 10px;
    margin-bottom: 8px;
}

.purchase-nfe-grid.two { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.purchase-nfe-grid.three { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.purchase-nfe-grid.four { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.purchase-nfe-grid.six { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

.purchase-nfe-grid div {
    min-width: 0;
}

.purchase-manifest-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.purchase-manifest-form {
    min-width: 0;
}

.purchase-manifest-option {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    padding: 12px 14px;
    border: 1.5px solid #d0d5dd;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

.purchase-manifest-option:hover:not(.is-disabled):not(:disabled) {
    border-color: #1d4ed8;
    box-shadow: 0 0 0 1px rgba(29, 78, 216, .15);
}

.purchase-manifest-option-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.purchase-manifest-option-head strong {
    color: #07122a;
    font-size: 13px;
}

.purchase-manifest-option-head small {
    margin-left: auto;
    color: #667085;
    font-size: 11px;
    font-weight: 700;
}

.purchase-manifest-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #17a34a;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    flex: none;
}

.purchase-manifest-option.is-active {
    border-color: #17a34a;
    background: #f0fdf4;
    box-shadow: 0 0 0 1px rgba(23, 163, 74, .2);
}

.purchase-manifest-option.is-active .purchase-manifest-option-head strong {
    color: #15803d;
}

.purchase-manifest-option.is-disabled,
.purchase-manifest-option:disabled {
    border-color: #e4e7ec;
    background: #f9fafb;
    color: #98a2b3;
    cursor: not-allowed;
}

.purchase-manifest-option.is-disabled .purchase-manifest-option-head strong,
.purchase-manifest-option:disabled .purchase-manifest-option-head strong {
    color: #98a2b3;
}

.purchase-manifest-just .purchase-manifest-option {
    cursor: default;
}

.purchase-manifest-just textarea {
    min-height: 60px;
    padding: 8px 10px;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    font: inherit;
    resize: vertical;
}

.purchase-manifest-just textarea:disabled {
    background: #f9fafb;
    color: #98a2b3;
}

.purchase-manifest-just button {
    align-self: flex-start;
}

.purchase-nfe-grid span,
.purchase-nfe-address,
.purchase-nfe-info {
    color: #667085;
    font-size: 12px;
    font-weight: 700;
}

.purchase-nfe-grid strong {
    display: block;
    margin-top: 3px;
    color: #07122a;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.purchase-nfe-address,
.purchase-nfe-info {
    margin: 6px 0 0;
    color: #344054;
    line-height: 1.45;
}

.purchase-nfe-items {
    border: 1px solid #d7dde8;
    border-radius: 8px;
    overflow: hidden;
    min-width: 0;
}

.purchase-nfe-items-head,
.purchase-nfe-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1.8fr) minmax(74px, .7fr) 44px minmax(62px, .55fr) minmax(76px, .65fr) minmax(76px, .65fr);
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    min-width: 0;
}

.purchase-nfe-items-head {
    background: #f2f5f9;
    color: #07122a;
    font-size: 12px;
    font-weight: 900;
}

.purchase-nfe-item {
    border-top: 1px solid #edf1f7;
    color: #344054;
}

.purchase-nfe-item > *,
.purchase-nfe-items-head > *,
.purchase-nfe-payments > div > * {
    min-width: 0;
    overflow-wrap: anywhere;
}

.purchase-nfe-item strong {
    color: #07122a;
}

.purchase-nfe-payments {
    border: 1px solid #d7dde8;
    border-radius: 8px;
    overflow: hidden;
}

.purchase-nfe-payments > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(110px, 140px);
    gap: 10px;
    padding: 8px 10px;
    border-top: 1px solid #edf1f7;
}

.purchase-nfe-payments > div:first-child {
    border-top: 0;
}

.purchase-nfe-payments-head {
    background: #f2f5f9;
    color: #07122a;
    font-weight: 900;
}

.purchase-contra-nfe {
    display: grid;
    gap: 12px;
    background: #fff;
    color: #07122a;
    border: 1px solid #d7dde8;
    border-radius: 10px;
    padding: 14px;
}

.purchase-contra-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.purchase-contra-form-grid label,
.purchase-contra-full {
    display: grid;
    gap: 6px;
    margin: 0;
}

.purchase-contra-form-grid span,
.purchase-contra-full span {
    color: #07122a;
    font-size: 12px;
    font-weight: 900;
}

.purchase-contra-form-grid input,
.purchase-contra-form-grid select,
.purchase-contra-full textarea {
    width: 100%;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--input);
    color: var(--text-strong);
    font-weight: 800;
}

.purchase-contra-full {
    margin-top: 12px;
}

.purchase-contra-print {
    display: grid;
    gap: 4px;
    margin-top: 10px;
    border: 1px dashed #98a2b3;
    border-radius: 8px;
    padding: 12px;
    text-align: center;
}

.purchase-contra-print strong {
    color: #07122a;
    font-size: 16px;
}

.purchase-contra-print span {
    color: #344054;
    font-weight: 800;
}

.purchase-contra-pdf-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
    gap: 14px;
    margin-top: 12px;
    align-items: stretch;
}

.purchase-contra-pdf-frame {
    width: 100%;
    height: min(68vh, 720px);
    min-height: 520px;
    border: 1px solid #d7dde8;
    border-radius: 8px;
    background: #fff;
}

.purchase-contra-pdf-side {
    display: grid;
    align-content: start;
    gap: 10px;
    border: 1px solid #d7dde8;
    border-radius: 8px;
    padding: 12px;
    background: #f8fafc;
}

.purchase-contra-pdf-side strong {
    color: #07122a;
    font-size: 16px;
}

.purchase-contra-pdf-side span,
.purchase-contra-pdf-side small {
    color: #667085;
    font-weight: 800;
}

.purchase-contra-pdf-side div {
    border-top: 1px solid #d7dde8;
    padding-top: 8px;
}

.purchase-contra-pdf-side b {
    display: block;
    margin-top: 3px;
    color: #07122a;
    overflow-wrap: anywhere;
}

.purchase-entry-danfe-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.purchase-entry-danfe-frame {
    width: 100%;
    height: min(68vh, 720px);
    min-height: 520px;
    border: 1px solid #d7dde8;
    border-radius: 8px;
    background: #fff;
}

.purchase-entry-danfe-side {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    border: 1px solid #d7dde8;
    border-radius: 8px;
    padding: 12px;
    background: #f8fafc;
}

.purchase-entry-danfe-side strong {
    color: #07122a;
    font-size: 16px;
}

.purchase-entry-danfe-side span,
.purchase-entry-danfe-side small {
    color: #667085;
    font-weight: 800;
}

.purchase-entry-danfe-side div {
    border-left: 1px solid #d7dde8;
    padding-left: 10px;
}

.purchase-entry-danfe-side b {
    display: block;
    margin-top: 3px;
    color: #07122a;
    overflow-wrap: anywhere;
}

@media (max-width: 980px) {
    .purchase-contra-pdf-layout,
    .purchase-entry-danfe-layout {
        grid-template-columns: 1fr;
    }
}

.purchase-contra-cancel {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(180px, 240px);
    gap: 12px;
    align-items: end;
    margin-top: 12px;
    border-top: 1px solid #d7dde8;
    padding-top: 12px;
}

.purchase-contra-cancel label {
    display: grid;
    gap: 6px;
    margin: 0;
}

.purchase-contra-cancel span {
    color: #07122a;
    font-size: 12px;
    font-weight: 900;
}

.purchase-contra-cancel input {
    width: 100%;
}

.stock-main .contacts-table {
    width: 100%;
    min-width: 0;
}

.stock-main .contacts-scroll {
    overflow-x: auto;
    overflow-y: auto;
}

.stock-main .contacts-head,
.stock-main .contacts-row {
    min-width: 720px;
    padding-right: 18px;
    padding-left: 18px;
}

.stock-main .contacts-head > span,
.stock-main .contacts-row > span,
.stock-main .contacts-row > div,
.stock-main .contacts-row strong {
    min-width: 0;
}

.stock-main .contacts-row > span,
.stock-main .contacts-row small,
.stock-main .contacts-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-row {
    color: inherit;
    text-decoration: none;
}

.stock-row .is-positive {
    color: var(--success);
}

.stock-row .is-zero {
    color: var(--muted);
}

.stock-row .is-negative {
    color: var(--danger);
}

.section-inline-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 22px 0;
}

.section-inline-head p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
}

@media (max-width: 1100px) {
    .stock-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .purchase-page-top {
        display: grid;
        grid-template-columns: 1fr;
    }

    .purchase-page-top > div:first-child {
        max-width: none;
    }

    .purchase-top-actions {
        grid-template-columns: minmax(0, 1fr) minmax(150px, 180px) minmax(96px, 112px) minmax(126px, 146px);
        width: 100%;
    }

    .purchase-modal-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .purchase-modal-form,
    .purchase-modal-form.compact,
    .purchase-search-log div {
        grid-template-columns: 1fr;
    }

    .purchase-cost-mode {
        grid-template-columns: 1fr;
    }

    .purchase-stock-list-head {
        display: none;
    }

    .purchase-stock-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .purchase-stock-actions {
        grid-template-columns: 1fr;
    }

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

    .stock-movement-card .primary-action {
        grid-column: 1 / -1;
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 760px) {
    .purchase-top-actions {
        grid-template-columns: 1fr 1fr;
    }

    .purchase-top-actions .search-input {
        grid-column: 1 / -1;
    }

    .purchase-modal-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .stock-movement-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .stock-movement-head p {
        white-space: normal;
    }

    .stock-movement-fields {
        grid-template-columns: 1fr;
    }

    .stock-movement-card .primary-action {
        grid-column: auto;
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 720px) {
    .stock-summary {
        grid-template-columns: 1fr;
    }

    .section-inline-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .stock-card {
        height: 440px;
    }
}

.user-list-name {
    min-width: 0;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.user-list-name .avatar {
    width: 34px;
    height: 34px;
}

.contacts-head {
    min-height: 52px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.contacts-row {
    min-height: 64px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
}

.contacts-row:hover {
    background: rgba(65, 106, 157, .08);
}

.contacts-row strong {
    display: block;
    color: var(--text-strong);
    font-size: 15px;
    line-height: 1.18;
}

.contacts-row small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.type-pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 11px;
    border: 1px solid #5a96ff;
    border-radius: 999px;
    color: #5a96ff;
    background: rgba(90, 150, 255, .1);
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
}

.type-pill.is-supplier {
    border-color: #b66cff;
    color: #b66cff;
    background: rgba(182, 108, 255, .12);
}

.type-pill.is-admin {
    border-color: #17c979;
    color: #17c979;
    background: rgba(23, 201, 121, .12);
}

.type-pill.is-service {
    border-color: #f0b84f;
    color: #f0b84f;
    background: rgba(240, 184, 79, .12);
}

.type-pill[class*="is-status-"] {
    min-width: 78px;
    justify-content: center;
}

.type-pill.is-status-faturado {
    border-color: #2563eb;
    color: #2563eb;
    background: rgba(37, 99, 235, .12);
}

.type-pill.is-status-entregue {
    border-color: #159947;
    color: #127a3a;
    background: rgba(21, 153, 71, .12);
}

.type-pill.is-status-aberto {
    border-color: #b7791f;
    color: #965d11;
    background: rgba(183, 121, 31, .14);
}

.type-pill.is-status-parcial {
    border-color: #9a6b16;
    color: #8a5d08;
    background: rgba(234, 179, 8, .14);
}

.type-pill.is-status-pago {
    border-color: #159947;
    color: #127a3a;
    background: rgba(21, 153, 71, .12);
}

.type-pill.is-status-atrasado,
.type-pill.is-status-vencido {
    border-color: #dc2626;
    color: #b91c1c;
    background: rgba(220, 38, 38, .12);
}

.type-pill.is-status-cancelado {
    border-color: var(--danger);
    color: var(--danger);
    background: rgba(255, 91, 102, .12);
}

.type-pill.is-status-aguardando_pagamento {
    border-color: #f0b84f;
    color: #b7791f;
    background: rgba(240, 184, 79, .14);
}

.type-pill.is-status-expirado {
    border-color: #8a94a6;
    color: #64748b;
    background: rgba(100, 116, 139, .14);
}

.type-pill.is-status-estornado {
    border-color: #f0b84f;
    color: #b7791f;
    background: rgba(240, 184, 79, .14);
}

.type-pill.is-status-entrada {
    border-color: #159947;
    color: #127a3a;
    background: rgba(21, 153, 71, .12);
}

.type-pill.is-status-saida {
    border-color: var(--danger);
    color: var(--danger);
    background: rgba(255, 91, 102, .12);
}

.type-pill.is-stock-entrada {
    border-color: #17c979;
    color: #17c979;
    background: rgba(23, 201, 121, .12);
}

.type-pill.is-stock-saida {
    border-color: var(--danger);
    color: var(--danger);
    background: rgba(255, 91, 102, .12);
}

.type-pill.is-stock-ajuste {
    border-color: #5a96ff;
    color: #5a96ff;
    background: rgba(90, 150, 255, .1);
}

.dots-button {
    width: 36px;
    height: 32px;
    margin: 0;
    border: 0;
    border-radius: 7px;
    color: var(--muted);
    background: transparent;
    box-shadow: none;
    font-size: 18px;
    line-height: 1;
    letter-spacing: .08em;
    cursor: pointer;
}

.dots-button:hover,
.action-cell.is-open .dots-button {
    color: var(--brand);
    background: var(--panel-soft);
}

.action-cell {
    position: relative;
    justify-self: end;
    z-index: 4;
}

.row-actions-menu {
    position: fixed;
    top: var(--row-menu-top, 0);
    left: var(--row-menu-left, 0);
    right: auto;
    z-index: 10050;
    min-width: 210px;
    max-width: min(290px, calc(100vw - 16px));
    max-height: min(62vh, 430px);
    overflow-y: auto;
    display: none;
    gap: 4px;
    padding: 8px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel);
    box-shadow: 0 16px 38px var(--shadow);
}

.action-cell.is-open .row-actions-menu {
    display: grid;
}

.action-cell.is-open {
    z-index: 90;
}

.row-actions-menu form {
    display: contents;
}

.row-actions-menu a,
.row-actions-menu button {
    width: 100%;
    min-height: 36px;
    display: flex;
    align-items: center;
    margin: 0;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--panel-soft);
    box-shadow: none;
    font: inherit;
    font-size: 12.5px;
    font-weight: 800;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background .12s ease, border-color .12s ease, color .12s ease;
}

.row-actions-menu a:hover,
.row-actions-menu button:hover {
    border-color: var(--brand);
    background: var(--brand);
    color: #fff;
    text-decoration: none;
}

.row-actions-menu button[data-confirm-delete] {
    border-color: rgba(255, 91, 102, .32);
    color: var(--danger);
    background: rgba(255, 91, 102, .08);
}

.row-actions-menu button[data-confirm-delete]:hover {
    border-color: var(--danger);
    background: var(--danger);
    color: #fff;
}

/* O menu de pedidos usa details nativo para continuar funcional mesmo sem JavaScript. */
.orders-table .order-action-menu > summary {
    display: grid;
    place-items: center;
    list-style: none;
}

.orders-table .order-action-menu > summary::-webkit-details-marker {
    display: none;
}

.orders-table .order-action-menu .row-actions-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    left: auto;
    z-index: 1000;
}

.orders-table .order-action-menu[open] .row-actions-menu {
    display: grid;
}

.orders-table .order-action-menu[open] {
    z-index: 100;
}

.list-actions .ghost-action.is-danger {
    color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 42%, var(--line-soft));
}

.list-actions .ghost-action:disabled {
    opacity: .48;
    cursor: not-allowed;
}

.contacts-head input[type="checkbox"],
.contacts-row input[type="checkbox"] {
    appearance: none;
    width: 17px;
    height: 17px;
    min-height: 17px;
    display: grid;
    place-content: center;
    margin: 0;
    border: 1.5px solid color-mix(in srgb, var(--muted) 48%, transparent);
    border-radius: 4px;
    background: var(--panel);
    accent-color: var(--brand);
    cursor: pointer;
}

.contacts-head input[type="checkbox"]::before,
.contacts-row input[type="checkbox"]::before {
    content: "";
    width: 8px;
    height: 8px;
    transform: scale(0);
    border-radius: 2px;
    background: var(--brand);
    transition: transform .12s ease;
}

.contacts-head input[type="checkbox"]:checked,
.contacts-row input[type="checkbox"]:checked {
    border-color: var(--brand);
    background: color-mix(in srgb, var(--brand) 12%, var(--panel));
}

.contacts-head input[type="checkbox"]:checked::before,
.contacts-row input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.settle-modal {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, .58);
}

.settle-modal.is-open {
    display: flex;
}

.settle-modal-card {
    width: min(680px, 96vw);
    max-height: calc(100vh - 48px);
    display: grid;
    align-content: start;
    gap: 22px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 20px;
    background: var(--panel);
    box-shadow: 0 26px 80px rgba(0, 0, 0, .28);
    overflow-y: auto;
}

.settle-modal-card.purchase-stock-modal-card {
    width: min(1280px, calc(100vw - 24px));
    max-width: min(1280px, calc(100vw - 24px));
}

.purchase-stock-modal-card .purchase-stock-list-head,
.purchase-stock-modal-card .purchase-stock-row {
    grid-template-columns: minmax(260px, 1.15fr) minmax(240px, 1fr);
}

.purchase-stock-modal-card .purchase-stock-list-head span:nth-child(3),
.purchase-stock-modal-card .purchase-stock-list-head span:nth-child(4) {
    display: none;
}

.purchase-stock-modal-card .purchase-stock-row label {
    display: grid;
    gap: 6px;
}

.purchase-stock-modal-card .purchase-stock-row label:nth-of-type(1)::before {
    content: "Ação";
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.purchase-stock-modal-card .purchase-stock-row label:nth-of-type(2)::before {
    content: "Produto cadastrado para lançar";
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.settle-modal-card h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: 24px;
    font-weight: 950;
}

.settle-batch-hint {
    margin: -12px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
}

.settle-batch-list {
    display: grid;
    gap: 1px;
    max-height: 220px;
    overflow-y: auto;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--line-soft);
}

.settle-batch-item {
    display: grid;
    grid-template-columns: 1.4fr 1.4fr auto;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--panel);
    font-size: 13px;
}

.settle-batch-item span:first-child {
    color: var(--text-strong);
    font-weight: 700;
}

.settle-batch-item span:nth-child(2) {
    color: var(--muted);
}

.settle-batch-item strong {
    color: var(--text-strong);
    text-align: right;
}

.settle-batch-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--panel-soft);
    border: 1px solid var(--line-soft);
}

.settle-batch-total span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.settle-batch-total strong {
    color: #0ea5e9;
    font-size: 20px;
    font-weight: 900;
}

.system-confirm-card {
    width: min(392px, calc(100vw - 32px));
    gap: 18px;
    padding: 22px;
    border-color: var(--line-soft);
    border-radius: 8px;
    background: var(--panel);
    box-shadow: 0 24px 70px rgba(2, 8, 23, .28);
    overflow: hidden;
}

.system-confirm-card .payments-modal-head {
    align-items: center;
}

.system-confirm-card .payments-modal-head h2 {
    color: var(--text-strong);
    font-family: "Inter", Arial, sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
}

.system-confirm-card .payments-modal-head p {
    max-width: 360px;
    margin-top: 6px;
    color: var(--muted);
    font-family: "Inter", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.45;
    letter-spacing: 0;
}

.system-confirm-card .settle-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    justify-content: flex-end;
}

.system-confirm-modal.is-logout .system-confirm-card {
    border-radius: 8px;
}

.system-confirm-modal.is-logout {
    background: rgba(15, 23, 42, .56);
    backdrop-filter: blur(4px);
}

.system-confirm-modal.is-logout .secondary-action,
.system-confirm-modal.is-logout .primary-action {
    min-width: 0;
    min-height: 44px;
    border-radius: 8px;
    font-family: "Inter", Arial, sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
}

.system-confirm-modal.is-logout .primary-action {
    border-color: #3B608F;
    background: #3B608F;
    box-shadow: 0 10px 22px rgba(59, 96, 143, .24);
}

.system-confirm-modal.is-logout .primary-action:hover {
    border-color: #34567f;
    background: #34567f;
}

.system-confirm-modal.is-logout .secondary-action {
    border-color: var(--line-soft);
    color: var(--text-strong);
    background: var(--panel-soft);
}

.system-confirm-modal.is-logout .secondary-action:hover {
    background: color-mix(in srgb, var(--panel-soft) 86%, #3B608F 14%);
}

.payments-modal-card {
    width: min(860px, 96vw);
}

.payments-modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.payments-modal-head p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.payments-modal-head button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    color: var(--text-strong);
    background: var(--panel-soft);
    cursor: pointer;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
}

.payments-list {
    overflow: hidden;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
}

.payments-list-head,
.payments-list-row {
    display: grid;
    grid-template-columns: 90px 130px 150px minmax(180px, 1fr) 110px;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
}

.payments-list-head {
    color: var(--text-strong);
    background: var(--panel-soft);
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
}

.payments-list-row {
    min-height: 54px;
    border-top: 1px solid var(--line-soft);
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.payments-list-row strong {
    color: var(--text-strong);
    text-align: right;
}

.payments-empty {
    padding: 18px 14px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.payments-actions {
    grid-template-columns: minmax(180px, 260px);
    justify-content: end;
}

.pdv-page {
    gap: 18px;
}

.pdv-top {
    align-items: center;
}

.pdv-clock {
    display: grid;
    gap: 3px;
    min-width: 150px;
    padding: 12px 16px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--panel);
    text-align: right;
}

.pdv-clock strong {
    color: var(--text-strong);
    font-size: 15px;
    font-weight: 950;
}

.pdv-clock span {
    color: var(--success);
    font-size: 12px;
    font-weight: 900;
}

.pdv-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    gap: 18px;
    min-height: calc(100vh - 150px);
}

.pdv-sale,
.pdv-summary {
    min-width: 0;
}

.pdv-sale {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 14px;
}

.pdv-product-entry,
.pdv-panel,
.pdv-totals,
.pdv-cart {
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel);
    box-shadow: 0 18px 44px rgba(15, 23, 42, .06);
}

.pdv-product-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px 150px;
    gap: 12px;
    align-items: end;
    padding: 16px;
}

.pdv-product-entry label,
.pdv-panel label,
.pdv-totals label {
    display: grid;
    gap: 7px;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 900;
}

.pdv-product-entry input,
.pdv-panel input,
.pdv-panel select,
.pdv-totals input {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-weight: 850;
    outline: 0;
}

.pdv-cart {
    overflow: hidden;
}

.pdv-cart-head,
.pdv-cart-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 100px 120px 120px 42px;
    gap: 12px;
    align-items: center;
}

.pdv-cart-head {
    padding: 13px 16px;
    color: var(--pdv-text, #001747);
    background: var(--panel-soft);
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
}

.pdv-cart-body {
    max-height: calc(100vh - 285px);
    overflow-y: auto;
}

.pdv-cart-row {
    min-height: 68px;
    padding: 12px 16px;
    border-top: 1px solid var(--line-soft);
}

.pdv-cart-row strong {
    color: var(--text-strong);
    font-size: 14px;
    font-weight: 950;
}

.pdv-cart-row span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.pdv-cart-row input {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 10px;
    color: var(--text-strong);
    background: var(--input);
    font-weight: 900;
    text-align: center;
}

.pdv-cart-row button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    color: var(--danger);
    background: color-mix(in srgb, var(--danger) 9%, var(--panel-soft));
    cursor: pointer;
    font-size: 20px;
    font-weight: 950;
}

.pdv-empty {
    padding: 26px 16px;
    color: var(--pdv-muted, #64748b);
    font-size: 14px;
    font-weight: 850;
    text-align: center;
}

.pdv-summary {
    display: grid;
    align-content: start;
    gap: 14px;
}

.pdv-panel,
.pdv-totals {
    display: grid;
    gap: 12px;
    padding: 16px;
}

.pdv-panel h2 {
    margin: 0 0 2px;
    color: var(--text-strong);
    font-size: 17px;
    font-weight: 950;
}

.pdv-totals > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 850;
}

.pdv-totals strong {
    color: var(--text-strong);
    font-size: 18px;
    font-weight: 950;
}

.pdv-grand-total {
    margin-top: 4px;
    padding-top: 13px;
    border-top: 1px solid var(--line-soft);
}

.pdv-grand-total strong {
    color: var(--brand);
    font-size: 30px;
}

.pdv-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.pdv-actions .primary-action,
.pdv-actions .cancel-action {
    min-height: 50px;
}

.pdv-receipt-card {
    width: min(460px, calc(100vw - 20px));
    max-height: calc(100svh - 16px);
    align-content: start;
    overflow: hidden;
    padding: 10px;
    gap: 8px;
}

.pdv-receipt-card .payments-modal-head,
.pdv-receipt-card .settle-actions {
    flex: 0 0 auto;
}

.pdv-receipt-card [data-pdv-receipt-print-area] {
    max-height: calc(100svh - 132px);
    overflow-y: auto;
    overflow-x: hidden;
}

.pdv-receipt {
    width: 80mm;
    max-width: 100%;
    box-sizing: border-box;
    display: grid;
    gap: 3px;
    margin: 0 auto;
    color: #000;
    background: #fff;
    padding: 2mm;
    border-radius: 4px;
    font-family: Arial, sans-serif;
    font-size: 12px;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.pdv-receipt-card .payments-modal-head {
    align-items: center;
}

.pdv-receipt-card .payments-modal-head h2 {
    font-size: 18px;
}

.pdv-receipt-card .payments-modal-head p {
    margin-top: 2px;
    font-size: 12px;
}

.pdv-receipt-card .settle-actions {
    gap: 8px;
}

.pdv-receipt-card .primary-action,
.pdv-receipt-card .cancel-action {
    min-height: 38px;
    padding-inline: 12px;
    font-size: 12px;
}

.nfce-modal-card {
    width: min(420px, calc(100vw - 28px));
    max-height: calc(100dvh - 28px);
    gap: 14px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.nfce-document-choice {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.nfce-document-choice[hidden] {
    display: none;
}

.nfce-document-choice .inline-check {
    position: relative;
    min-height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
    background: var(--panel-soft);
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
}

.nfce-document-choice .inline-check input {
    position: absolute;
    width: 1px;
    min-height: 1px;
    opacity: 0;
    pointer-events: none;
}

.nfce-document-choice .inline-check:has(input:checked) {
    border-color: var(--brand);
    color: var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--panel));
}

.nfce-cpf-field {
    display: grid;
    gap: 6px;
    color: var(--text-strong);
    font-weight: 900;
    font-size: 13px;
}

.nfce-cpf-field input {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0 14px;
    color: var(--text-strong);
    background: var(--panel);
    font-weight: 850;
}

.nfce-modal-note {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}

.nfce-tomador-status {
    min-height: 16px;
    margin: -6px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}

.nfce-tomador-status.is-error {
    color: var(--danger);
}

.nfce-cpf-registration {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--panel-soft);
}

.nfce-cpf-registration[hidden] {
    display: none;
}

.nfce-cpf-registration > strong {
    color: var(--text-strong);
    font-size: 13px;
}

.nfce-cpf-registration > p {
    margin: -5px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.nfce-cpf-registration .form-grid {
    gap: 10px;
}

.nfce-cpf-registration label {
    display: grid;
    gap: 5px;
    color: var(--text-strong);
    font-size: 11px;
    font-weight: 800;
}

.nfce-cpf-registration input {
    min-height: 38px;
    padding-inline: 10px;
    font-size: 12px;
}

.nfce-return-card {
    width: min(680px, calc(100vw - 28px));
    max-height: calc(100svh - 24px);
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow: hidden;
}

.nfce-return-card .payments-modal-head a {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--text-strong);
    background: var(--panel-soft);
    text-decoration: none;
    font-size: 22px;
    font-weight: 950;
}

.cte-cancel-modal-card {
    width: min(560px, calc(100vw - 28px));
    gap: 18px;
}

.cte-cancel-modal-card .payments-modal-head a {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--text-strong);
    background: var(--panel-soft);
    text-decoration: none;
    font-size: 22px;
    font-weight: 950;
}

.cte-cancel-reason {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.cte-cancel-reason textarea {
    width: 100%;
    min-height: 132px;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    padding: 12px 14px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-size: 14px;
    font-weight: 750;
    line-height: 1.45;
    outline: 0;
    resize: vertical;
    text-transform: none;
}

.cte-cancel-reason textarea:focus {
    border-color: rgba(37, 99, 235, .48);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .12);
}

.cte-cancel-actions {
    gap: 12px;
}

.cte-cancel-actions .primary-action,
.cte-cancel-actions .cancel-action {
    width: 100%;
}

.nfce-return-summary {
    min-height: 0;
    flex: 0 0 auto;
    display: grid;
    gap: 8px;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 800;
    overflow: visible;
    overflow-wrap: anywhere;
}

.nfce-return-summary p {
    margin: 0;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 10px;
    color: #7f1d1d;
    background: #fee2e2;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.nfce-return-json {
    min-height: 138px;
    max-height: none;
    flex: 1 1 auto;
    overflow: auto;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px;
    color: var(--text-strong);
    background: var(--panel);
    font-size: 12px;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
}

.nfce-return-card > .cte-cancel-reason {
    flex: 0 0 auto;
    gap: 8px;
    max-height: 190px;
    overflow: auto;
    padding: 10px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel-soft);
}

.nfce-return-card > .cte-cancel-reason input[type="date"],
.nfce-return-card > .cte-cancel-reason input[type="text"] {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-size: 13px;
    font-weight: 750;
    outline: 0;
}

.nfce-return-card > .cte-cancel-reason small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
    line-height: 1.35;
    text-transform: none;
    overflow-wrap: anywhere;
}

.receipt-center {
    display: grid;
    gap: 2px;
    text-align: center;
}

.receipt-company {
    display: grid;
    grid-template-columns: 17mm 1fr;
    align-items: center;
    gap: 4px;
}

.receipt-company img {
    width: 16mm;
    height: 16mm;
    object-fit: contain;
}

.receipt-company div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.receipt-company strong,
.receipt-title,
.receipt-payment-title {
    font-weight: 900;
}

.receipt-company strong {
    font-size: 11.2px;
    line-height: 1.05;
}

.receipt-company span {
    font-size: 10.8px;
    line-height: 1.06;
    overflow-wrap: anywhere;
}

.pdv-receipt hr {
    width: 100%;
    border: 0;
    border-top: 2px solid #000;
    margin: 2px 0;
}

.receipt-title {
    text-align: center;
    font-size: 10.8px;
    line-height: 1.12;
}

.receipt-title strong {
    font-size: 11px;
}

.receipt-consumer {
    border-top: 1px dashed #000;
    border-bottom: 1px dashed #000;
    padding: 3px 0;
    text-align: center;
    font-weight: 950;
}

.receipt-items-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 8mm 7mm 13mm 13mm;
    gap: 2px;
    border-bottom: 2px solid #000;
    font-weight: 900;
    font-size: 10px;
}

.receipt-items-head span:not(:first-child) {
    text-align: right;
}

.receipt-line {
    display: flex;
    justify-content: space-between;
    gap: 6px;
    font-size: 11px;
}

.receipt-line span:last-child,
.receipt-line strong {
    text-align: right;
}

.receipt-items {
    display: grid;
    gap: 1px;
}

.receipt-item {
    display: grid;
    gap: 1px;
    border-bottom: 1px solid #000;
}

.receipt-item strong {
    font-size: 10.2px;
    line-height: 1.08;
    white-space: normal;
}

.receipt-item div {
    display: grid;
    grid-template-columns: 1fr 7mm 13mm 13mm;
    gap: 2px;
    font-size: 10.4px;
    font-weight: 700;
}

.receipt-item span {
    text-align: right;
}

.receipt-total {
    font-size: 11.4px;
    font-weight: 950;
}

.receipt-payment-title {
    margin-bottom: 2px;
}

.receipt-note {
    display: grid;
    gap: 1px;
    min-width: 0;
    overflow-wrap: anywhere;
}

.receipt-access-key {
    display: grid;
    gap: 1px;
    text-align: center;
    font-size: 8.7px;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.receipt-access-key strong {
    font-size: 9px;
}

.receipt-qr-block {
    display: grid;
    grid-template-columns: 30mm 1fr;
    align-items: center;
    gap: 4px;
    margin-top: 3px;
}

.receipt-qr {
    width: 29mm;
    height: 29mm;
}

.receipt-qr img,
.receipt-qr canvas {
    width: 29mm !important;
    height: 29mm !important;
}

.receipt-barcode {
    width: 29mm;
    height: 29mm;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 1px;
    padding: 1mm 0;
    background: #fff;
    overflow: hidden;
}

.receipt-barcode i {
    display: block;
    min-width: 1px;
    height: 100%;
    background: #000;
}

.receipt-qr-block > div:last-child {
    min-width: 0;
    display: grid;
    gap: 1px;
    text-align: center;
    overflow-wrap: anywhere;
}

.receipt-consumer-block {
    font-size: 8.9px;
    line-height: 1.08;
}

.receipt-consumer-block strong {
    font-size: 9.1px;
}

.receipt-tax {
    text-align: center;
    font-size: 8.5px;
    line-height: 1.12;
    margin-top: 2px;
}

.receipt-nfe-simplified .receipt-title {
    font-size: 10px;
    text-transform: uppercase;
}

.receipt-nfe-simplified .receipt-access-key {
    font-size: 8.2px;
}

.receipt-nfe-simplified .receipt-items-head,
.receipt-nfe-simplified .receipt-item strong,
.receipt-nfe-simplified .receipt-item div {
    font-size: 9px;
}

.receipt-nfe-simplified {
    gap: 0;
    padding: 0;
    font-size: 12px;
    line-height: 1.14;
}

.nfe-simple-company {
    display: grid;
    grid-template-columns: 19mm 1fr;
    gap: 3px;
    align-items: start;
    text-align: center;
    margin-bottom: 3px;
}

.nfe-simple-company img {
    width: 18mm;
    height: 18mm;
    object-fit: contain;
}

.nfe-simple-company div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.nfe-simple-company strong {
    font-size: 12px;
    line-height: 1.08;
}

.nfe-simple-company span {
    font-size: 12px;
    line-height: 1.08;
}

.nfe-simple-title {
    display: grid;
    gap: 1px;
    border-top: 1px dashed #000;
    border-bottom: 1px dashed #000;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
    line-height: 1.12;
}

.nfe-simple-title strong {
    font-size: 12px;
}

.nfe-wide-barcode {
    width: 100%;
    height: 22mm;
    display: grid;
    place-items: center;
    padding: 1mm 0;
    background: #fff;
    overflow: hidden;
}

.nfe-wide-barcode svg {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: 20mm !important;
}

.receipt-nfe-simplified .nfe-simple-company img {
    width: 18mm !important;
    height: 18mm !important;
    max-width: 18mm !important;
    max-height: 18mm !important;
}

.nfe-access-key {
    display: grid;
    gap: 1px;
    border-bottom: 1px dashed #000;
    padding-bottom: 3px;
    text-align: center;
    font-size: 11px;
    line-height: 1.14;
    overflow-wrap: anywhere;
}

.nfe-access-key strong {
    font-size: 12px;
}

.nfe-data-lines {
    display: grid;
    gap: 1px;
    border-bottom: 1px dashed #000;
    padding: 3px 0;
}

.nfe-data-lines div {
    display: grid;
    grid-template-columns: 30mm 1fr;
    gap: 3px;
    font-size: 12px;
}

.nfe-data-lines strong,
.nfe-simple-section h3,
.nfe-total-line {
    font-weight: 950;
}

.nfe-simple-section {
    display: grid;
    gap: 1px;
    border-bottom: 1px dashed #000;
    padding: 3px 0;
}

.nfe-simple-section h3 {
    margin: 0;
    font-size: 12px;
    line-height: 1.1;
}

.nfe-simple-section p {
    margin: 0;
    font-size: 12px;
    line-height: 1.12;
}

.nfe-products-head,
.nfe-product-row {
    display: grid;
    grid-template-columns: 9mm minmax(0, 1fr) 7mm 6mm 10mm 11mm;
    gap: 1px;
    align-items: start;
}

.nfe-products-head {
    font-size: 11px;
    font-weight: 950;
    border-bottom: 1px solid #000;
}

.nfe-product-row {
    padding: 2px 0;
    font-size: 11px;
    line-height: 1.1;
}

.nfe-product-row strong {
    font-size: 11px;
    line-height: 1.1;
    font-weight: 700;
    word-break: break-word;
}

.nfe-products-head span:nth-child(n+3),
.nfe-product-row span:nth-child(n+3) {
    text-align: right;
}

.nfe-total-line {
    padding: 3px 0;
    border-bottom: 1px dashed #000;
    text-align: right;
    font-size: 12px;
}

.nfe-pay-head,
.nfe-pay-row {
    display: grid;
    grid-template-columns: 1fr 30mm;
    gap: 4px;
    font-size: 11px;
}

.nfe-pay-head {
    font-weight: 950;
    border-bottom: 1px dashed #000;
}

.nfe-pay-head span:last-child,
.nfe-pay-row span:last-child {
    text-align: right;
}

.nfe-additional p {
    font-size: 11px;
}

.nfe-printed-at {
    padding-top: 2px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}

.receipt-mp-card {
    min-height: 18mm;
    display: grid;
    grid-template-columns: 18mm minmax(0, 1fr);
    align-items: start;
    gap: 4px;
    margin-top: 4px;
    padding: 3px 5px;
    border: 1px solid #000;
    border-radius: 4px;
    font-size: 9px;
    line-height: 1.08;
}

.receipt-mp-card > div:last-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.receipt-mp-card span,
.receipt-brand-card span {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.receipt-mp-card strong,
.receipt-brand-card strong {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.receipt-mp-logo {
    width: 15mm;
    height: 10mm;
    display: block;
    object-fit: contain;
}

.receipt-thanks {
    margin-top: 2px;
    font-weight: 950;
    font-size: 10px;
}

.receipt-items + hr + .receipt-thanks {
    display: none !important;
}

@media (max-width: 980px) {
    .pdv-shell {
        grid-template-columns: 1fr;
    }

    .pdv-product-entry {
        grid-template-columns: 1fr;
    }

    .pdv-cart-head,
    .pdv-cart-row {
        grid-template-columns: minmax(160px, 1fr) 80px 96px 96px 36px;
    }
}

@media print {
    @page {
        size: 80mm auto;
        margin: 0;
    }

    html,
    body {
        width: 80mm !important;
        min-width: 80mm !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        overflow: visible !important;
    }

    body * {
        visibility: hidden !important;
    }

    [data-pdv-receipt-print-area],
    [data-pdv-receipt-print-area] * {
        visibility: visible !important;
    }

    [data-pdv-receipt-print-area] {
        position: absolute;
        top: 0;
        left: 50%;
        width: 80mm;
        max-width: 80mm;
        min-height: auto;
        max-height: none !important;
        margin: 0;
        padding: 0 !important;
        overflow: visible !important;
        box-shadow: none;
        border-radius: 0;
        transform: translateX(-50%);
    }

    .pdv-receipt {
        width: 80mm;
        max-width: 80mm;
        gap: 3px;
        padding: 2mm;
        font-size: 12px;
        line-height: 1.12;
        border-radius: 0;
    }

    .receipt-company {
        grid-template-columns: 17mm 1fr;
        gap: 4px;
    }

    .receipt-company img {
        width: 16mm;
        height: 16mm;
    }

    .receipt-nfe-simplified .nfe-simple-company img {
        width: 18mm !important;
        height: 18mm !important;
        max-width: 18mm !important;
        max-height: 18mm !important;
        object-fit: contain !important;
    }

    .receipt-nfe-simplified .nfe-wide-barcode {
        width: 100% !important;
        height: 22mm !important;
        display: grid !important;
        place-items: center !important;
        background: #fff !important;
    }

    .receipt-nfe-simplified .nfe-wide-barcode svg {
        width: 100% !important;
        max-width: 100% !important;
        height: 20mm !important;
    }

    .receipt-qr {
        width: 29mm;
        height: 29mm;
    }

    .receipt-qr img,
    .receipt-qr canvas {
        width: 29mm !important;
        height: 29mm !important;
    }

    .receipt-qr-block {
        grid-template-columns: 30mm 1fr;
        gap: 4px;
    }

    .receipt-mp-card,
    .receipt-brand-card {
        min-height: 18mm;
        font-size: 9px;
    }

    .no-print {
        display: none !important;
    }
}

.receipt-brand-card {
    min-height: 18mm;
    display: grid;
    grid-template-columns: 18mm 1fr;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    padding: 3px 5px;
    border: 1px solid #000;
    border-radius: 4px;
    font-size: 9px;
    line-height: 1.08;
}

.receipt-brand-card > img {
    width: 15mm;
    height: 10mm;
    object-fit: contain;
}

.receipt-brand-card > div:last-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

/* PDV full-screen counter */
.pdv-screen {
    /* O PDV tem paleta própria, separada do resto do sistema (Perfil de
       Cores > PDV). Qualquer elemento dentro do PDV que use as variáveis
       gerais do tema (--panel, --brand, --text-strong etc.) passa a herdar
       automaticamente os valores do PDV a partir daqui, sem precisar trocar
       var() por var() em cada regra — inclusive em partes futuras. */
    --app-bg: var(--pdv-bg, #f7f7f8);
    --panel: var(--pdv-panel, #fff);
    --panel-soft: var(--pdv-panel-soft, #eef1f6);
    --panel-strong: var(--pdv-neutral, #4b5563);
    --input: var(--pdv-panel, #fff);
    --line: var(--pdv-line, #d1d5db);
    --line-soft: var(--pdv-line, #d1d5db);
    --text: var(--pdv-text, #001747);
    --text-strong: var(--pdv-text, #001747);
    --muted: var(--pdv-muted, #64748b);
    --muted-strong: var(--pdv-muted, #334c76);
    --brand: var(--pdv-accent, #416a9d);
    --brand-strong: var(--pdv-accent, #416a9d);
    --danger: var(--pdv-danger, #ef4444);
    --success: var(--pdv-success, #16a34a);
    --warning: var(--pdv-warning, #d97706);

    min-height: 100vh;
    overflow: hidden;
    background: var(--pdv-bg, #f7f7f8);
    color: var(--pdv-text, #001747);
}

.pdv-header {
    height: 76px;
    display: grid;
    grid-template-columns: 48px 120px minmax(180px, 1fr) auto auto minmax(220px, auto);
    align-items: center;
    gap: 22px;
    padding: 0 22px;
    color: #fff;
    background: var(--pdv-header, #223b5a);
    box-shadow: 0 3px 10px rgba(0, 0, 0, .32);
}

.pdv-menu-button {
    width: 32px;
    display: grid;
    gap: 5px;
    color: #fff;
    text-decoration: none;
}

.pdv-menu-button span {
    display: block;
    height: 4px;
    border-radius: 999px;
    background: currentColor;
}

.pdv-brand {
    display: grid;
    line-height: .92;
}

.pdv-brand span {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .02em;
}

.pdv-brand strong {
    font-size: 24px;
    font-weight: 950;
}

.pdv-mode {
    font-size: 25px;
    font-weight: 950;
    letter-spacing: .02em;
}

.pdv-date,
.pdv-time {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 25px;
    font-weight: 950;
    white-space: nowrap;
}

.pdv-date span,
.pdv-time span {
    font-size: 22px;
}

.pdv-sale-number {
    display: grid;
    justify-items: center;
    line-height: 1.15;
}

.pdv-sale-number span {
    font-size: 18px;
    font-weight: 950;
}

.pdv-sale-number strong {
    font-size: 17px;
    font-weight: 950;
}

.pdv-alert {
    position: fixed;
    z-index: 30;
    right: 18px;
    top: 88px;
    width: min(420px, calc(100vw - 36px));
}

.pdv-counter {
    height: calc(100vh - 76px);
    display: grid;
    grid-template-columns: minmax(420px, 43%) minmax(520px, 1fr);
    grid-template-rows: minmax(0, 1fr) 166px;
    grid-template-areas:
        "entry items"
        "entry close";
    gap: 12px 26px;
    padding: 14px 34px 18px;
}

.pdv-entry-card {
    grid-area: entry;
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    gap: 32px;
    padding: 20px 22px 46px;
    border-radius: 18px;
    color: #fff;
    background: var(--pdv-header, #223b5a);
    box-shadow: 0 0 5px rgba(0, 0, 0, .78);
}

.pdv-field {
    display: grid;
    gap: 8px;
    color: #fff;
    font-size: 18px;
    font-weight: 950;
}

.pdv-field input,
.pdv-field select {
    width: 100%;
    min-height: 57px;
    border: 0;
    border-radius: 6px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 24px;
    font-weight: 500;
    outline: 0;
}

.pdv-product-field .product-search {
    position: relative;
}

.pdv-product-field input {
    padding-right: 58px;
}

.stock-balance-chip.is-positive { color: #30c878; }
.stock-balance-chip.is-negative { color: #ef5b5b; }

.pdv-search-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    width: 38px;
    height: 38px;
    transform: translateY(-50%);
    border: 0;
    color: var(--pdv-accent, #416a9d);
    background: transparent;
    cursor: pointer;
    font-size: 40px;
    font-weight: 950;
    line-height: 1;
}

.pdv-entry-grid {
    display: grid;
    grid-template-columns: minmax(130px, 150px) minmax(160px, 180px);
    justify-content: space-between;
    gap: 28px;
}

.pdv-entry-grid input {
    text-align: center;
    font-size: 18px;
    font-weight: 950;
}

.pdv-line-total {
    display: grid;
    grid-template-columns: auto 64px minmax(190px, 238px);
    align-items: center;
    align-self: center;
    gap: 26px;
}

.pdv-line-total strong,
.pdv-line-total span {
    color: #fff;
    font-size: 25px;
    font-weight: 950;
}

.pdv-line-total input {
    min-height: 57px;
    border: 0;
    border-radius: 6px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 22px;
    font-weight: 950;
}

.pdv-add-button,
.pdv-cancel-button,
.pdv-finish-button {
    border: 0;
    border-radius: 6px;
    color: #fff;
    background: var(--pdv-accent, #416a9d);
    cursor: pointer;
    font-size: 18px;
    font-weight: 950;
}

.pdv-add-button {
    min-height: 65px;
    margin-top: auto;
    font-size: 25px;
}

.pdv-items-card {
    grid-area: items;
    min-width: 0;
    padding: 16px 22px 36px;
    border: 1px solid var(--pdv-line, rgba(0, 23, 71, .4));
    border-radius: 10px;
    background: var(--pdv-panel, #fff);
    box-shadow: 0 0 6px rgba(0, 0, 0, .45);
}

.pdv-items-table {
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--pdv-accent, #416a9d);
    border-radius: 5px;
}

.pdv-items-head,
.pdv-cart-row {
    display: grid;
    grid-template-columns: 44px minmax(160px, 1fr) 66px 84px 84px 68px;
    align-items: center;
    gap: 6px;
}

.pdv-items-head {
    min-height: 56px;
    padding: 0 16px;
    border-bottom: 1px solid var(--pdv-accent, #416a9d);
    color: var(--pdv-text, #001747);
    font-size: 24px;
    font-weight: 950;
}

.pdv-items-head > span:first-child,
.pdv-items-head > span:nth-child(3) {
    text-align: center;
}

.pdv-items-body {
    min-height: 0;
    overflow-y: auto;
}

.pdv-cart-row {
    min-height: 54px;
    padding: 9px 16px;
    border-bottom: 1px solid var(--pdv-line, rgba(65, 106, 157, .25));
    color: var(--pdv-text, #001747);
    font-size: 14px;
    font-weight: 950;
}

.pdv-cart-row > strong:first-child,
.pdv-cart-row > strong:nth-child(3) {
    text-align: center;
}

.pdv-cart-row div strong {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: var(--pdv-text, #001747);
    text-overflow: ellipsis;
}

.pdv-cart-row div span {
    display: block;
    margin-top: 3px;
    color: var(--pdv-muted, #334c76);
    font-size: 12px;
}

.pdv-row-actions {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}

.pdv-row-actions button {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    color: #fff;
    background: var(--pdv-accent, #416a9d);
}

.pdv-row-actions button svg {
    width: 15px;
    height: 15px;
}

.pdv-row-actions button:last-child {
    background: var(--pdv-danger, #ef4444);
}

.pdv-empty {
    padding: 26px 16px;
    color: var(--muted);
    font-size: 15px;
    font-weight: 850;
    text-align: center;
}

.pdv-close-card {
    grid-area: close;
    display: grid;
    grid-template-rows: 1fr auto;
    gap: 28px;
    padding: 14px 18px 20px;
    border-radius: 18px;
    color: #fff;
    background: var(--pdv-header, #223b5a);
    box-shadow: 0 0 6px rgba(0, 0, 0, .55);
}

.pdv-close-total {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 32px;
    padding-right: 18px;
}

.pdv-close-total span {
    font-size: 25px;
    font-weight: 950;
}

.pdv-close-total strong {
    min-width: 150px;
    min-height: 56px;
    display: grid;
    place-items: center;
    border-radius: 5px;
    color: var(--pdv-text, #001747);
    background: var(--pdv-panel, #fff);
    font-size: 24px;
    font-weight: 950;
}

.pdv-close-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    padding: 0 22px;
}

.pdv-cancel-button,
.pdv-finish-button {
    min-height: 44px;
}

.pdv-finish-button:disabled {
    opacity: .58;
    cursor: not-allowed;
}

.pdv-payment-card {
    width: min(1180px, 96vw);
}

.pdv-payment-closeout {
    gap: 22px;
    padding: 20px 20px 22px;
    background: var(--pdv-panel, #fff);
    max-height: calc(100svh - 24px);
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.pdv-payment-closeout .payments-modal-head {
    align-items: center;
    display: grid;
    grid-template-columns: 44px 1fr 44px;
}

.pdv-payment-closeout .payments-modal-head h2 {
    text-align: center;
    color: var(--pdv-text, #07184a);
    font-size: 31px;
}

.pdv-back-button {
    width: 44px;
    min-height: 44px;
    border: 0;
    color: var(--pdv-accent, #41699b);
    background: transparent;
    font-size: 34px;
    font-weight: 950;
    cursor: pointer;
}

.pdv-closeout-box {
    display: grid;
    grid-template-columns: minmax(360px, .92fr) minmax(420px, 1.08fr);
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 22px;
    border: 1.5px solid var(--pdv-accent, #41699b);
    border-radius: 8px;
    padding: 20px;
    min-height: 0;
    max-height: calc(100svh - 108px);
    overflow-y: auto;
}

.pdv-paid-panel {
    display: grid;
    grid-template-rows: auto minmax(132px, 1fr) auto;
    gap: 0;
    min-height: 0;
}

.pdv-paid-head,
.pdv-paid-row {
    display: grid;
    grid-template-columns: 1fr 1fr .8fr;
    align-items: center;
    text-align: center;
}

.pdv-paid-head {
    min-height: 42px;
    border-radius: 6px 6px 0 0;
    color: #fff;
    background: var(--pdv-header, #243b59);
    font-size: 14px;
    font-weight: 950;
}

.pdv-paid-list {
    min-height: 132px;
    max-height: 238px;
    overflow: auto;
    border: 1px solid var(--pdv-line, #d1d5db);
    border-top: 0;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .14);
}

.pdv-paid-row {
    min-height: 36px;
    border-bottom: 1px solid var(--pdv-line, #d1d5db);
    color: var(--pdv-text, #050f35);
    font-size: 14px;
    font-weight: 900;
}

.pdv-paid-empty {
    padding: 36px 18px;
    color: var(--pdv-muted, #6b7280);
    text-align: center;
    font-weight: 850;
}

.pdv-closeout-totals {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 32px;
    align-items: end;
    margin-top: 24px;
}

.pdv-closeout-totals label {
    display: grid;
    gap: 4px;
    color: var(--pdv-text, #07184a);
    font-size: 18px;
    font-weight: 950;
}

.pdv-closeout-totals input,
.pdv-closeout-totals strong {
    min-height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-soft);
    border-radius: 6px;
    padding: 0 14px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 25px;
    font-weight: 950;
}

.pdv-pay-panel {
    display: grid;
    gap: 20px;
    align-content: start;
    min-height: 286px;
    border-radius: 6px;
    padding: 24px 32px 30px;
    color: #fff;
    background: var(--pdv-header, #243b59);
    box-shadow: 0 4px 12px rgba(15, 23, 42, .3);
}

.pdv-pay-panel h3 {
    margin: 0;
    text-align: center;
    font-size: 25px;
    font-weight: 950;
}

.pdv-pay-grid {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) 90px minmax(150px, 1fr);
    gap: 14px;
    align-items: end;
}

.pdv-pay-grid label {
    display: grid;
    gap: 8px;
    color: #fff;
    font-size: 17px;
    font-weight: 950;
}

.pdv-pay-grid input,
.pdv-pay-grid select {
    width: 100%;
    min-height: 52px;
    border: 2px solid transparent;
    border-radius: 8px;
    padding: 0 14px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 18px;
    font-weight: 950;
}

.pdv-pay-grid button {
    grid-column: 1 / -1;
    min-height: 64px;
    margin: 18px auto 0;
    width: min(405px, 100%);
    border: 0;
    border-radius: 6px;
    color: #fff;
    background: var(--pdv-accent, #41699b);
    font-size: 25px;
    font-weight: 950;
    cursor: pointer;
}

.pdv-pay-grid button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.pdv-final-actions {
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-height: 760px) {
    .settle-modal:has(.pdv-payment-closeout) {
        padding: 8px;
    }

    .pdv-payment-closeout {
        gap: 10px;
        max-height: calc(100svh - 16px);
        padding: 12px;
    }

    .pdv-payment-closeout .payments-modal-head h2 {
        font-size: 25px;
    }

    .pdv-closeout-box {
        max-height: calc(100svh - 78px);
        gap: 14px 18px;
        padding: 14px;
    }

    .pdv-paid-panel {
        grid-template-rows: auto minmax(105px, 1fr) auto;
    }

    .pdv-paid-list {
        min-height: 105px;
        max-height: 170px;
    }

    .pdv-closeout-totals {
        gap: 16px;
        margin-top: 14px;
    }

    .pdv-closeout-totals label {
        font-size: 15px;
    }

    .pdv-closeout-totals input,
    .pdv-closeout-totals strong {
        min-height: 46px;
        font-size: 20px;
    }

    .pdv-pay-panel {
        min-height: 245px;
        gap: 14px;
        padding: 20px 28px 24px;
    }

    .pdv-pay-grid input,
    .pdv-pay-grid select {
        min-height: 46px;
    }

    .pdv-pay-grid button {
        min-height: 52px;
        margin-top: 10px;
        font-size: 21px;
    }

    .pdv-payment-closeout .pdv-final-actions button {
        min-height: 64px;
        font-size: 19px;
    }
}

.pdv-final-actions button {
    min-height: 88px;
    border: 0;
    border-radius: 14px;
    color: #fff;
    background: var(--pdv-accent, #41699b);
    font-size: 24px;
    font-weight: 950;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pdv-final-actions button:disabled {
    opacity: .42;
    background: var(--pdv-muted, #8090a5);
    cursor: not-allowed;
    transform: none;
}

.pdv-notice-modal.is-open {
    z-index: 10100;
}

.pdv-notice-card {
    width: min(430px, calc(100vw - 32px));
    gap: 18px;
}

.pdv-notice-card .payments-modal-head {
    align-items: center;
}

.pdv-notice-card .payments-modal-head p {
    max-width: 340px;
    font-size: 14px;
    line-height: 1.45;
}

.pdv-notice-card .settle-actions {
    justify-content: flex-end;
}

.is-hidden {
    display: none !important;
}

.pdv-tele-venda-card {
    width: min(460px, calc(100vw - 32px));
    gap: 18px;
}

.pdv-tele-venda-card .payments-modal-head p {
    max-width: 360px;
    font-size: 13px;
    line-height: 1.4;
}

.pdv-tele-venda-link-box {
    display: flex;
}

.pdv-tele-venda-link-box input {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line-soft);
    border-radius: 6px;
    padding: 0 14px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 14px;
    font-weight: 650;
}

.pdv-tele-venda-link-modal .settle-actions {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.pdv-action-icon {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    margin-right: 9px;
}

.pdv-payment-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-radius: 8px;
    color: #fff;
    background: var(--pdv-header, #223b5a);
}

.pdv-payment-total span,
.pdv-payment-total strong {
    font-size: 22px;
    font-weight: 950;
}

.pdv-payment-methods {
    display: grid;
    gap: 10px;
}

.pdv-payment-methods-head,
.pdv-payment-balance {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pdv-payment-methods-head strong,
.pdv-payment-balance strong {
    color: var(--text-strong);
    font-weight: 950;
}

.pdv-payment-methods-head button {
    min-height: 34px;
    border: 0;
    border-radius: 8px;
    padding: 0 14px;
    color: #fff;
    background: var(--brand);
    font-weight: 900;
    cursor: pointer;
}

.pdv-payment-rows {
    display: grid;
    gap: 8px;
    max-height: min(28vh, 250px);
    overflow: auto;
    padding-right: 2px;
}

.pdv-payment-row {
    display: grid;
    grid-template-columns: minmax(130px, 1fr) minmax(130px, 1fr) 118px 92px 34px;
    align-items: end;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: color-mix(in srgb, var(--input) 72%, transparent);
}

.pdv-payment-row label {
    gap: 5px;
    font-size: 12px;
}

.pdv-payment-row input,
.pdv-payment-row select {
    min-height: 40px;
}

.pdv-payment-row > button {
    width: 34px;
    min-height: 40px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: var(--pdv-neutral, #4b5563);
    font-size: 20px;
    font-weight: 950;
    cursor: pointer;
}

.pdv-payment-row > button:disabled {
    opacity: .35;
    cursor: not-allowed;
}

.pdv-card-installments {
    opacity: .42;
}

.pdv-card-installments.is-visible {
    opacity: 1;
}

.pdv-payment-balance {
    padding-top: 2px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 900;
}

.pdv-payment-balance .is-balanced,
.pdv-payment-balance strong.is-balanced {
    color: var(--pdv-success, #16a34a);
}

.pdv-mercado-pago-card {
    width: min(860px, 96vw);
    max-height: calc(100dvh - 24px);
    gap: clamp(10px, 1.6vh, 18px);
    padding: clamp(14px, 2vh, 20px);
    overflow: hidden;
}

.pdv-mp-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.pdv-mp-summary div {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--input);
}

.pdv-mp-summary span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
}

.pdv-mp-summary strong {
    color: var(--text-strong);
    font-size: 20px;
    font-weight: 950;
}

.pdv-mp-note {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 750;
    line-height: 1.45;
}

.pdv-mp-qrcode {
    display: grid;
    grid-template-columns: minmax(210px, 280px) minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: clamp(10px, 1.5vh, 16px);
    background: var(--panel-soft);
}

.pdv-mp-qrcode[hidden],
.pdv-mp-point[hidden] {
    display: none !important;
}

.pdv-mp-qr-render {
    width: min(280px, 34vh);
    min-width: 210px;
    min-height: 0;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    border: 8px solid #fff;
    border-radius: 8px;
    background: #fff;
}

.pdv-mp-qr-render img,
.pdv-mp-qr-render canvas {
    width: 100% !important;
    max-width: 280px;
    height: auto !important;
}

.pdv-mp-qr-copy {
    min-width: 0;
    display: grid;
    gap: 9px;
}

.pdv-mp-qr-copy strong {
    color: var(--text-strong);
    font-size: 13px;
}

.pdv-mp-qr-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pdv-mp-qr-head span {
    border-radius: 999px;
    padding: 6px 10px;
    color: var(--pdv-warning, #9a6700);
    background: color-mix(in srgb, var(--pdv-warning, #d97706) 18%, var(--pdv-panel, #fff4ce));
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.pdv-mp-qr-head span.is-expiring {
    color: var(--pdv-danger, #b42318);
    background: color-mix(in srgb, var(--pdv-danger, #ef4444) 14%, var(--pdv-panel, #fff1f2));
}

.pdv-mp-qr-copy textarea {
    width: 100%;
    min-height: 92px;
    resize: none;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 10px;
    color: var(--muted-strong);
    background: var(--input);
    font: 11px/1.35 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.pdv-mp-qr-copy button {
    min-height: 40px;
    border: 1px solid var(--brand);
    border-radius: 8px;
    color: var(--brand-strong);
    background: var(--panel);
    font-weight: 900;
    cursor: pointer;
}

.pdv-mp-point {
    display: flex;
    align-items: center;
    gap: 16px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 18px;
    background: var(--panel-soft);
}

.pdv-mp-point-icon {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: var(--brand);
    font-size: 27px;
}

.pdv-mp-point div { display: grid; gap: 4px; }
.pdv-mp-point strong { color: var(--text-strong); font-size: 15px; }
.pdv-mp-point p { margin: 0; color: var(--muted); font-size: 12px; font-weight: 700; }

.pdv-mp-feedback {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 11px 13px;
    color: var(--muted-strong);
    background: var(--panel-soft);
}

.pdv-mp-feedback-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--pdv-warning, #d97706);
    font-size: 13px;
    font-weight: 950;
}

.pdv-mp-feedback > div { min-width: 0; display: grid; gap: 2px; }
.pdv-mp-feedback strong { color: var(--text-strong); font-size: 14px; font-weight: 950; }
.pdv-mp-feedback p { margin: 0; color: var(--muted-strong); font-size: 12px; font-weight: 750; line-height: 1.35; }

.pdv-mp-feedback.is-approved {
    border-color: var(--pdv-success, #16a34a);
    background: color-mix(in srgb, var(--pdv-success, #16a34a) 14%, var(--pdv-panel, #ecfdf3));
}

.pdv-mp-feedback.is-approved .pdv-mp-feedback-icon { background: var(--pdv-success, #16a34a); }

.pdv-mp-feedback.is-error {
    border-color: var(--pdv-danger, #ef4444);
    background: color-mix(in srgb, var(--pdv-danger, #ef4444) 14%, var(--pdv-panel, #fff1f2));
}

.pdv-mp-feedback.is-error .pdv-mp-feedback-icon { background: var(--pdv-danger, #dc2626); }

@media (max-height: 720px) and (min-width: 621px) {
    .settle-modal:has(.pdv-mercado-pago-card) { padding: 8px; }
    .pdv-mercado-pago-card { max-height: calc(100dvh - 16px); gap: 8px; padding: 12px; }
    .pdv-mercado-pago-card .payments-modal-head h2 { font-size: 20px; }
    .pdv-mp-summary div { gap: 2px; padding: 8px 12px; }
    .pdv-mp-summary strong { font-size: 17px; }
    .pdv-mp-qr-render { width: min(230px, 31vh); min-width: 180px; }
    .pdv-mp-qr-copy textarea { min-height: 58px; }
    .pdv-mp-qrcode { grid-template-columns: minmax(180px, 230px) minmax(0, 1fr); }
    .pdv-mp-point { padding: 12px; }
}

@media (max-width: 620px) {
    .pdv-mp-qrcode {
        grid-template-columns: 1fr;
    }

    .pdv-mp-qr-render {
        width: min(190px, 28vh);
        min-width: 160px;
        justify-self: center;
    }

    .pdv-mp-qr-copy textarea { min-height: 48px; }
}

@media (max-width: 1060px) {
    .pdv-header {
        grid-template-columns: 38px 92px 1fr;
        height: auto;
        min-height: 76px;
        gap: 12px;
    }

    .pdv-date,
    .pdv-time,
    .pdv-sale-number {
        display: none;
    }

    .pdv-counter {
        height: auto;
        min-height: calc(100vh - 76px);
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        grid-template-areas:
            "entry"
            "items"
            "close";
        padding: 14px;
    }

    .pdv-close-card {
        grid-area: close;
    }
}

.pdv-screen .pdv-counter {
    height: calc(100vh - 76px);
    grid-template-columns: minmax(430px, 42%) minmax(560px, 1fr);
    grid-template-rows: minmax(0, 1fr) 166px;
    grid-template-areas:
        "entry items"
        "entry close";
    padding: 14px 34px 18px;
}

.pdv-screen .pdv-entry-card {
    grid-area: entry;
    min-height: 0;
    grid-template-rows: auto auto minmax(110px, 1fr) auto;
    gap: clamp(22px, 4.5vh, 54px);
}

.pdv-screen .pdv-items-card {
    grid-area: items;
    min-height: 0;
}

.pdv-screen .pdv-close-card {
    grid-area: close;
}

.pdv-screen .pdv-items-head,
.pdv-screen .pdv-cart-row {
    grid-template-columns: 44px minmax(160px, 1fr) 66px 84px 84px 68px;
    gap: 6px;
}

.pdv-screen .pdv-items-head {
    padding: 0 14px;
    font-size: 18px;
}

.pdv-screen .pdv-cart-row {
    min-height: 52px;
    padding: 8px 14px;
}

.pdv-screen .pdv-row-actions {
    min-width: 66px;
}

.pdv-screen .pdv-row-actions button {
    width: 30px;
}

.pdv-screen .pdv-add-button {
    width: 100%;
    align-self: end;
    min-height: 64px;
    margin-top: 0;
}

@media (max-width: 1060px) {
    .pdv-screen .pdv-counter {
        height: auto;
        min-height: calc(100vh - 76px);
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        grid-template-areas:
            "entry"
            "items"
            "close";
        padding: 14px;
    }
}

.settle-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 12px 32px;
}

.settle-grid label {
    display: grid;
    gap: 7px;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 900;
}

.settle-grid input,
.settle-grid select,
.settle-grid textarea {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-weight: 800;
    outline: 0;
}

.settle-grid textarea {
    min-height: 98px;
    padding-block: 12px;
    resize: vertical;
}

.settle-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 34px;
}

.settle-actions .primary-action,
.settle-actions .cancel-action {
    min-height: 45px;
    justify-content: center;
}

.empty-row {
    padding: 36px 24px;
    color: var(--muted);
    font-weight: 800;
}

.contacts-footer {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 24px;
    border-top: 1px solid var(--line-soft);
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.pager {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pager button,
.pager a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 0;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    color: var(--muted-strong);
    background: var(--panel);
    box-shadow: none;
    text-decoration: none;
}

.pager button.is-active,
.pager a.is-active {
    color: #fff;
    background: var(--brand);
}

.pager a.is-disabled {
    opacity: .45;
    pointer-events: none;
}

.customer-form {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.form-page-main {
    height: 100svh;
    overflow: hidden;
}

.customer-form .page-top {
    flex: 0 0 auto;
    margin-bottom: 18px;
}

.form-card {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 30px 28px 32px;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, .34) transparent;
}

.form-card::-webkit-scrollbar {
    width: 7px;
}

.form-card::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(100, 116, 139, .34);
}

.form-card::-webkit-scrollbar-track {
    background: transparent;
}

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

.form-grid label,
.form-grid .form-field {
    display: grid;
    gap: 9px;
    margin: 0;
    color: var(--text-strong);
    font-size: 14px;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 0 14px;
    color: var(--text-strong);
    background: var(--input);
    font: inherit;
    font-weight: 700;
    outline: 0;
}

.input-with-action {
    position: relative;
    display: block;
}

.input-with-action input {
    padding-right: 46px;
}

.lookup-button {
    position: absolute;
    right: 7px;
    top: 50%;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    margin: 0;
    border: 0;
    border-radius: 8px;
    color: var(--muted);
    background: transparent;
    box-shadow: none;
    cursor: pointer;
}

.lookup-button:hover {
    color: var(--text-strong);
    background: rgba(65, 106, 157, .12);
    transform: translateY(-50%);
}

.lookup-button {
    transform: translateY(-50%);
}

.lookup-button svg {
    width: 18px;
    height: 18px;
}

.logo-upload {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    min-height: 132px;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    padding: 14px;
    background: var(--input);
}

.logo-preview {
    width: 100px;
    height: 100px;
    display: grid;
    place-items: center;
    border: 1px dashed color-mix(in srgb, var(--muted) 46%, transparent);
    border-radius: 14px;
    color: var(--muted);
    background: color-mix(in srgb, var(--panel) 78%, transparent);
    overflow: hidden;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

.logo-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
}

.profile-preview {
    border-radius: 50%;
}

.profile-preview img {
    object-fit: cover;
    padding: 0;
}

.logo-upload-copy {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.logo-upload-copy strong,
.logo-upload-copy span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.logo-upload-copy span {
    color: var(--muted);
    font-size: 12px;
}

.file-input {
    min-height: 42px !important;
    padding: 9px 12px !important;
    cursor: pointer;
}

.permissions-card {
    display: grid;
    gap: 10px;
    margin-top: 4px;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    padding: 16px;
    background: var(--input);
}

.permissions-card > strong {
    color: var(--text-strong);
    font-size: 14px;
}

.permissions-card > span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}

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

.permissions-group-title {
    margin: 6px 0 -2px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.seller-create-user-toggle {
    min-height: 42px;
    display: flex !important;
    align-items: center;
    gap: 9px !important;
    align-self: end;
    padding-bottom: 4px;
}

.seller-create-user-toggle input {
    width: 16px;
    min-height: 16px;
    accent-color: var(--brand);
}

.form-hint {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.seller-user-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    padding: 14px;
    background: color-mix(in srgb, var(--input) 86%, var(--brand) 4%);
}

.permission-option {
    min-height: 42px;
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 10px !important;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 0 12px;
    background: var(--panel);
    cursor: pointer;
}

.permission-option input {
    width: 16px;
    min-height: 16px;
    accent-color: var(--brand);
}

.permission-option span {
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 800;
}

.form-grid textarea {
    min-height: 94px;
    padding-top: 14px;
    resize: vertical;
}

.product-card {
    padding-top: 24px;
}

.order-card {
    padding-top: 24px;
}

.order-items {
    display: grid;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    background: var(--input);
    overflow: hidden;
}

.order-items-head,
.order-item-row {
    display: grid;
    grid-template-columns: 1.45fr 1.6fr .55fr .45fr .75fr .65fr .75fr;
    gap: 8px;
    align-items: center;
    padding: 9px 12px;
}

.sales-order-form .page-top {
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 1100px;
    margin-inline: auto;
    margin-bottom: 36px;
}

.sales-order-form .page-top > div:first-child {
    flex: 1 1 auto;
    min-width: 0;
}

.sales-grid {
    gap: 16px 16px;
}

.sales-grid label {
    gap: 5px;
    font-size: 12px;
    font-weight: 950;
}

.sales-grid input,
.sales-grid select,
.sales-grid textarea {
    min-height: 40px;
    border-radius: 9px;
    font-size: 14px;
    text-align: left;
}

.sales-grid input[readonly] {
    color: var(--text-strong);
    background: var(--input);
}

.sales-divider {
    height: 1px;
    border-top: 2px solid color-mix(in srgb, var(--brand) 62%, transparent);
}

.icon-only-action {
    min-width: 56px;
}

.sales-order-form .form-actions {
    flex: 0 0 auto;
    justify-content: flex-end;
}

.sales-order-form .order-card {
    max-width: 1100px;
    margin-inline: auto;
    padding: 26px 30px 34px;
}

.sales-order-form .ghost-action,
.sales-order-form .primary-action,
.sales-order-form .cancel-action {
    min-height: 34px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 950;
}

.sales-order-form .primary-action {
    min-width: 150px;
}

.sales-order-form .cancel-action {
    min-width: 150px;
    color: #fff;
    background: #3f4248;
}

.sales-order-form .icon-only-action {
    min-width: 56px;
    width: 56px;
    padding-inline: 0;
    color: #fff;
    background: var(--brand);
    border-color: var(--brand);
}

.consignment-form-main {
    height: 100svh;
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 28px;
}

.consignment-form-main .page-top {
    position: sticky;
    top: 0;
    z-index: 12;
    align-items: center;
    width: min(1100px, 100%);
    margin: 0 auto 18px;
    padding: 14px 18px;
    border: 1px solid var(--line-soft);
    border-radius: 16px;
    background: var(--panel);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .10);
}

.consignment-form-main .page-top > div:first-child {
    min-width: 0;
}

.consignment-form-main .page-top h1,
.consignment-form-main .page-top p {
    white-space: normal;
}

.consignment-form-main .page-top .form-actions {
    flex-wrap: wrap;
}

.consignment-form-main .customer-form {
    height: auto;
    min-height: 0;
    display: block;
}

.consignment-form-main .form-card {
    overflow: visible;
}

.consignment-form-main .order-card,
.consignment-form-main .form-bottom-actions {
    max-width: 1100px;
    margin-inline: auto;
}

.consignment-compact-card {
    margin-bottom: 16px;
}

.consignment-items-table {
    min-width: 0;
    width: 100%;
    table-layout: fixed;
}

.consignment-items-table th,
.consignment-items-table td {
    padding: 9px 8px;
    font-size: 12px;
    white-space: normal;
}

.consignment-items-table th:nth-child(2),
.consignment-items-table td:nth-child(2) {
    width: 26%;
}

.consignment-items-table th:not(:nth-child(2)),
.consignment-items-table td:not(:nth-child(2)) {
    text-align: center;
}

.print-page {
    min-height: 100svh;
    padding: 28px;
    background: #eef2f7;
    color: #071a3b;
    font-family: Arial, Helvetica, sans-serif;
}

.print-actions {
    width: min(980px, 100%);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin: 0 auto 16px;
}

.print-sheet {
    width: min(980px, 100%);
    margin: 0 auto;
    padding: 34px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(15, 23, 42, .14);
}

.print-header {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    align-items: start;
    padding-bottom: 20px;
    border-bottom: 2px solid #315f9d;
}

.print-brand {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.print-brand img {
    max-width: 110px;
    max-height: 64px;
    object-fit: contain;
}

.print-brand strong,
.print-title h1 {
    display: block;
    margin: 0 0 6px;
    color: #001845;
    font-size: 22px;
}

.print-brand span,
.print-title span,
.print-box span,
.print-footer span {
    display: block;
    color: #475569;
    font-size: 12px;
    line-height: 1.45;
}

.print-title {
    text-align: right;
}

.print-title strong {
    display: block;
    color: #315f9d;
    font-size: 26px;
}

.print-box-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 16px;
    margin-top: 18px;
}

.print-box {
    min-height: 112px;
    padding: 14px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
}

.print-box h2,
.print-section h2 {
    margin: 0 0 10px;
    color: #001845;
    font-size: 15px;
}

.print-box strong {
    display: block;
    margin-bottom: 6px;
    color: #001845;
    font-size: 14px;
}

.print-section {
    margin-top: 20px;
    break-inside: auto;
    page-break-inside: auto;
}

.print-section h2 {
    break-after: avoid-page;
    page-break-after: avoid;
}

.print-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #cbd5e1;
}

.print-table thead {
    display: table-header-group;
}

.print-table tfoot {
    display: table-row-group;
}

.print-table tr {
    break-inside: avoid;
    page-break-inside: avoid;
}

.print-table th,
.print-table td {
    padding: 8px 9px;
    border-bottom: 1px solid #dbe3ef;
    border-right: 1px solid #dbe3ef;
    color: #0f172a;
    font-size: 12px;
    text-align: left;
    vertical-align: top;
}

.print-table th {
    color: #001845;
    background: #eaf1fb;
    font-weight: 800;
}

.print-table th:nth-child(4),
.print-table th:nth-child(5),
.print-table th:nth-child(6),
.print-table th:nth-child(7),
.print-table td:nth-child(4),
.print-table td:nth-child(5),
.print-table td:nth-child(6),
.print-table td:nth-child(7) {
    text-align: right;
}

.rcr-print-table th:nth-child(4),
.rcr-print-table th:nth-child(5),
.rcr-print-table th:nth-child(6),
.rcr-print-table th:nth-child(7),
.rcr-print-table td:nth-child(4),
.rcr-print-table td:nth-child(5),
.rcr-print-table td:nth-child(6),
.rcr-print-table td:nth-child(7) {
    text-align: left;
}

.rcr-print-table th:nth-child(8),
.rcr-print-table th:nth-child(9),
.rcr-print-table th:nth-child(10),
.rcr-print-table td:nth-child(8),
.rcr-print-table td:nth-child(9),
.rcr-print-table td:nth-child(10) {
    text-align: right;
}

.fiscal-print-table th:nth-child(4),
.fiscal-print-table th:nth-child(5),
.fiscal-print-table th:nth-child(6),
.fiscal-print-table td:nth-child(4),
.fiscal-print-table td:nth-child(5),
.fiscal-print-table td:nth-child(6) {
    text-align: left;
}

.fiscal-print-table th:last-child,
.fiscal-print-table td:last-child {
    text-align: right;
}

.print-table-total td {
    border-top: 2px solid #94a3b8;
    background: #eaf1fb;
    color: #001845;
    font-weight: 800;
}

.print-totals {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.print-totals div {
    padding: 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #f8fafc;
    text-align: right;
}

.print-totals span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.print-totals strong {
    display: block;
    margin-top: 4px;
    color: #001845;
    font-size: 17px;
}

.print-notes {
    min-height: 70px;
    margin: 0;
    padding: 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    color: #0f172a;
    font-size: 12px;
    line-height: 1.5;
}

.print-footer {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 24px;
    padding-top: 12px;
    border-top: 1px solid #cbd5e1;
}

@media print {
    @page {
        size: A4;
        margin: 12mm;
    }

    html:has(.print-page),
    body:has(.print-page) {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    body {
        background: #fff !important;
    }

    body:has(.print-page) * {
        visibility: visible !important;
    }

    .print-page {
        min-height: auto;
        padding: 0;
        background: #fff;
        overflow: visible;
    }

    .print-actions {
        display: none !important;
        visibility: hidden !important;
    }

    .print-sheet {
        width: 100%;
        margin: 0;
        padding: 0;
        border-radius: 0;
        box-shadow: none;
    }
}

.sales-order-items .order-items-head,
.sales-order-items .order-item-row {
    grid-template-columns: 2.8fr .6fr .42fr .56fr .72fr .72fr 42px;
}

.sales-order-items .order-item-row {
    padding-inline: 0;
    border-bottom: 0;
}

.sales-order-items {
    border: 0;
    border-radius: 0;
    background: transparent;
}

.sales-order-items .order-items-head {
    border-bottom: 0;
    padding-inline: 0;
}

.sales-order-items .order-items-body {
    gap: 10px;
}

.sales-item-entry {
    display: grid;
    grid-template-columns: minmax(280px, 2.7fr) minmax(96px, .68fr) minmax(62px, .42fr) minmax(98px, .6fr) minmax(104px, .72fr) minmax(98px, .68fr) 58px;
    gap: 14px;
    align-items: end;
}

.product-search {
    position: relative;
}

.catalog-field-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 18px;
    min-height: 18px;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
}

.catalog-field-head .field-link-button {
    min-height: auto;
    border: 0;
    padding: 0;
    color: var(--brand-strong);
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.catalog-field-head .field-link-button:hover,
.catalog-field-head .field-link-button:focus-visible {
    color: var(--brand);
    text-decoration: underline;
}

.product-suggestions {
    position: absolute;
    z-index: 50;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    display: none;
    max-height: 220px;
    overflow: auto;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel);
    box-shadow: 0 18px 42px color-mix(in srgb, #000 22%, transparent);
}

.product-suggestions.is-open {
    display: grid;
}

.product-suggestions button {
    display: grid;
    gap: 3px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    border-bottom: 1px solid var(--line-soft);
    color: var(--text-strong);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.product-suggestions button:hover,
.product-suggestions button:focus-visible,
.product-suggestions button.is-active {
    background: color-mix(in srgb, var(--brand) 14%, transparent);
}

.product-suggestions button:last-child {
    border-bottom: 0;
}

.product-suggestions strong {
    font-size: 12px;
    font-weight: 900;
}

.product-suggestions span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
}

.stock-balance-chip {
    display: inline-block;
    margin-left: 6px;
    font-style: normal;
    font-weight: 900;
}

.order-lines-wrap {
    overflow-x: hidden;
    border: 1px solid color-mix(in srgb, var(--brand) 50%, var(--line-soft));
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 90%, var(--brand) 3%);
}

.order-lines-table {
    width: 100%;
    min-width: 0;
    border-collapse: collapse;
    table-layout: fixed;
}

.order-lines-table th,
.order-lines-table td {
    padding: 8px 7px;
    border-bottom: 1px solid var(--line-soft);
    border-right: 1px solid color-mix(in srgb, var(--line-soft) 80%, transparent);
    color: var(--text-strong);
    font-size: 11px;
    font-weight: 850;
    vertical-align: middle;
}

.order-lines-table th {
    color: var(--text-strong);
    background: color-mix(in srgb, var(--panel) 82%, var(--brand) 8%);
    font-size: 10px;
    font-weight: 950;
    text-align: left;
}

.order-lines-table td:first-child,
.order-lines-table td:nth-child(4),
.order-lines-table td:nth-child(5),
.order-lines-table td:nth-child(6),
.order-lines-table td:nth-child(7),
.order-lines-table td:nth-child(8),
.order-lines-table th:first-child,
.order-lines-table th:nth-child(4),
.order-lines-table th:nth-child(5),
.order-lines-table th:nth-child(6),
.order-lines-table th:nth-child(7),
.order-lines-table th:nth-child(8) {
    text-align: center;
}

.order-lines-table td:nth-child(2),
.order-lines-table td:nth-child(3) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.order-lines-table th:nth-child(1),
.order-lines-table td:nth-child(1) {
    width: 4%;
}

.order-lines-table th:nth-child(2),
.order-lines-table td:nth-child(2) {
    width: 15%;
}

.order-lines-table th:nth-child(3),
.order-lines-table td:nth-child(3) {
    width: 28%;
}

.order-lines-table th:nth-child(4),
.order-lines-table td:nth-child(4) {
    width: 5%;
}

.order-lines-table th:nth-child(5),
.order-lines-table td:nth-child(5) {
    width: 10%;
}

.order-lines-table th:nth-child(6),
.order-lines-table td:nth-child(6),
.order-lines-table th:nth-child(7),
.order-lines-table td:nth-child(7),
.order-lines-table th:nth-child(8),
.order-lines-table td:nth-child(8) {
    width: 11%;
}

.order-lines-table th:nth-child(9),
.order-lines-table td:nth-child(9) {
    width: 8%;
}

.order-lines-table tr:last-child td {
    border-bottom: 0;
}

.line-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.line-actions button {
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    margin: 0;
    border: 0;
    border-radius: 7px;
    color: var(--brand);
    background: transparent;
    font-size: 16px;
    font-weight: 950;
    cursor: pointer;
}

.line-actions svg {
    width: 16px;
    height: 16px;
}

.line-actions button:hover,
.line-actions button:focus-visible {
    color: #fff;
    background: var(--brand);
}

.line-confirm {
    width: 58px;
    height: 40px;
    margin: 0;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: var(--brand);
    font-size: 22px;
    font-weight: 950;
}

.item-edit-modal {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: none;
    place-items: center;
    padding: 20px;
    background: rgba(5, 13, 28, .64);
    backdrop-filter: blur(8px);
}

.item-edit-modal.is-open {
    display: grid;
}

.item-edit-dialog {
    width: min(620px, 100%);
    border: 1px solid var(--line-soft);
    border-radius: 18px;
    background: var(--panel);
    box-shadow: 0 28px 80px rgba(0, 0, 0, .32);
    overflow: hidden;
}

.item-edit-dialog header,
.item-edit-dialog footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--line-soft);
}

.item-edit-dialog footer {
    justify-content: flex-end;
    border-top: 1px solid var(--line-soft);
    border-bottom: 0;
}

.item-edit-dialog h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: 22px;
}

.item-edit-dialog header button {
    width: 34px;
    height: 34px;
    margin: 0;
    border: 0;
    border-radius: 8px;
    color: var(--text-strong);
    background: color-mix(in srgb, var(--panel) 82%, var(--brand) 8%);
    font-size: 24px;
    cursor: pointer;
}

.stock-history-modal .item-edit-dialog {
    width: min(920px, 96vw);
    max-height: min(720px, 88vh);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.stock-history-modal-body {
    min-height: 180px;
    overflow: auto;
    padding: 0 22px;
}

.stock-history-modal-row {
    display: grid;
    grid-template-columns: 130px 92px 94px 148px minmax(170px, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 58px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--text);
    font-size: 13px;
}

.stock-history-modal-row small {
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-options-modal .item-edit-dialog,
.stock-movement-modal .item-edit-dialog {
    width: min(560px, 96vw);
}

.stock-options-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 24px 22px;
}

.stock-options-body button {
    min-height: 76px;
    justify-content: center;
}

.stock-movement-modal-form {
    display: grid;
    gap: 14px;
    padding: 22px;
}

.stock-movement-modal-form label {
    display: grid;
    gap: 7px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 900;
}

.stock-movement-modal-form input,
.stock-movement-modal-form select,
.stock-movement-modal-form textarea {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--input);
    color: var(--text-strong);
    font: inherit;
    font-weight: 700;
}

.stock-movement-modal-form textarea { height: auto; resize: vertical; }
.stock-movement-modal-form footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 4px; }

.stock-list-footer .list-totals {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.stock-list-footer {
    gap: 18px;
}

.stock-list-footer > span {
    flex: 0 0 auto;
    white-space: nowrap;
}

.stock-list-footer .list-totals > span {
    min-width: 112px;
    display: grid;
    gap: 2px;
    padding: 6px 10px;
    border: 1px solid var(--list-border, var(--line-soft));
    border-radius: 10px;
    background: var(--list-surface-soft, var(--panel-soft));
    text-align: right;
}

.stock-list-footer .list-totals small {
    color: var(--list-text-secondary, var(--muted));
    font-family: "Inter";
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0;
    white-space: nowrap;
}

.stock-list-footer .list-totals strong {
    color: var(--list-text-primary, var(--text-strong));
    font-family: "Poppins";
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .stock-history-modal-body { padding: 0 14px; }
    .stock-history-modal-row { grid-template-columns: 1fr 1fr; padding-block: 10px; }
    .stock-history-modal-row small { grid-column: 1 / -1; }
    .stock-options-body { grid-template-columns: 1fr; padding: 16px; }
    .stock-movement-modal-form { padding: 16px; }
}

.item-edit-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 14px;
    padding: 22px;
}

.item-edit-grid label {
    display: grid;
    gap: 6px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 950;
}

.installments-table {
    display: grid;
    gap: 14px;
    margin-top: 4px;
}

.installments-head,
.installment-row {
    display: grid;
    grid-template-columns: .45fr 1.15fr 1.35fr 1.15fr 2.2fr;
    gap: 12px;
    align-items: center;
}

.installments-body {
    display: grid;
    gap: 10px;
}

.installments-head {
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 950;
}

.installment-row input,
.installment-row select {
    min-height: 38px;
}

.installment-auto-option {
    min-height: 40px;
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 8px !important;
    align-self: end;
    padding-bottom: 3px;
}

.installment-auto-option input {
    width: 16px;
    min-height: 16px;
    accent-color: var(--brand);
}

.installment-auto-option span {
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 850;
}

.generate-installments {
    min-height: 40px;
    align-self: end;
    margin: 0;
    border: 0;
    border-radius: 9px;
    color: #fff;
    background: var(--brand);
    font-weight: 900;
}

.sales-grid textarea {
    min-height: 100px;
}

.order-items-head {
    border-bottom: 1px solid var(--line-soft);
    color: var(--text-strong);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.order-items-body {
    display: grid;
    gap: 0;
}

.order-item-row {
    border-bottom: 1px solid var(--line-soft);
}

.order-item-row:last-child {
    border-bottom: 0;
}

.order-item-row input,
.order-item-row select {
    min-height: 38px;
    border-radius: 8px;
    font-size: 12px;
}

.order-item-row [readonly] {
    color: var(--text-strong);
    background: var(--input);
}

.order-summary {
    display: flex;
    justify-content: flex-end;
    gap: 18px;
    border-top: 2px solid var(--brand);
    padding-top: 14px;
}

.order-summary span {
    min-width: 170px;
    display: grid;
    gap: 3px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.order-summary strong {
    color: var(--text-strong);
    font-size: 22px;
}

.product-grid {
    gap: 16px 18px;
}

.product-grid label {
    display: grid;
    gap: 7px;
    align-content: start;
    font-size: 12px;
    font-weight: 920;
}

.product-grid input,
.product-grid select,
.product-grid textarea {
    width: 100%;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    color: var(--text-strong);
    background: var(--input);
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 5%, transparent);
    font-size: 13px;
    font-weight: 750;
    box-sizing: border-box;
}

.product-grid select {
    appearance: none;
    padding-right: 34px;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--muted) 50%),
        linear-gradient(135deg, var(--muted) 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 18px,
        calc(100% - 12px) 18px;
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
}

.product-grid input:focus,
.product-grid select:focus,
.product-grid textarea:focus {
    border-color: color-mix(in srgb, var(--brand) 72%, var(--line-soft));
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 15%, transparent);
}

.product-grid textarea {
    min-height: 108px;
    padding-top: 12px;
    line-height: 1.45;
}

.mini-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 16px;
    align-items: start;
}

.fiscal-code-row {
    align-items: end;
    margin-top: -2px;
    padding: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 12px;
    background: color-mix(in srgb, var(--panel) 90%, var(--brand) 4%);
}

.is-disabled-field {
    opacity: .58;
}

.is-disabled-field input,
.is-disabled-field button,
.is-disabled-field select,
.is-disabled-field textarea {
    cursor: not-allowed;
}

.is-disabled-field input,
.is-disabled-field select,
.is-disabled-field textarea {
    background: color-mix(in srgb, var(--input) 68%, var(--panel) 32%);
}

.ai-warning {
    color: var(--danger);
    font-size: 11px;
    font-weight: 700;
}

.ai-action {
    width: 100%;
    min-height: 40px;
    margin: 0;
    border: 0;
    border-radius: 9px;
    color: #fff;
    background: var(--brand);
    font-size: 13px;
    font-weight: 900;
}

.form-section-title {
    min-height: 22px;
    display: flex;
    align-items: center;
    border-top: 2px solid var(--brand);
    padding-top: 6px;
    color: var(--text-strong);
    font-size: 15px;
    font-weight: 950;
}

.catalog-active-field {
    justify-content: flex-start;
    align-self: start;
    min-height: 24px;
    padding: 0;
}

.catalog-app-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.catalog-app-fields {
    display: grid;
    align-content: start;
    gap: 12px;
}

.catalog-inputs-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
}

.catalog-app-fields label,
.catalog-inputs-grid label {
    min-height: auto;
}

.field-link-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 5px;
}

.field-link-row button {
    border: 0;
    color: var(--brand-strong);
    background: transparent;
    cursor: pointer;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.field-link-row button:hover {
    text-decoration: underline;
}

.category-search,
.category-search input {
    width: 100%;
}

.check-line {
    min-height: 42px;
    display: flex !important;
    align-items: center;
    gap: 7px !important;
    padding-bottom: 4px;
}

.check-line input {
    width: 16px;
    min-height: 16px;
    accent-color: var(--brand);
}

.image-upload-small {
    position: relative;
    width: 100%;
    height: 78px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    color: var(--muted);
    background: var(--input);
    overflow: hidden;
    text-align: center;
    font-size: 12px;
    font-weight: 750;
}

.image-upload-small img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-upload-small input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.product-grid label.span-1 {
    white-space: nowrap;
}

.product-images-panel {
    align-self: stretch;
    display: grid;
    gap: 8px;
    min-width: 0;
}

.product-images-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.product-images-head strong {
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 900;
}

.image-add-button {
    width: auto;
    height: 32px;
    min-height: 32px;
    display: flex !important;
    align-items: center;
    place-items: center;
    padding: 0 12px;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    color: #fff;
    background: var(--brand);
    cursor: pointer;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.image-add-button input {
    display: none;
}

.product-image-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    max-height: 178px;
    overflow: auto;
    padding-right: 2px;
}

.product-image-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 58px 30px;
    align-items: center;
    gap: 9px;
    min-height: 54px;
    padding: 6px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: color-mix(in srgb, var(--input) 82%, var(--panel) 18%);
}

.product-image-thumb {
    width: 48px;
    height: 40px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--input);
    overflow: hidden;
    cursor: zoom-in;
}

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

.product-image-info {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.product-image-info strong {
    overflow: hidden;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 900;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-image-info span {
    overflow: hidden;
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-cover-choice {
    min-height: auto;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 5px !important;
    color: var(--muted-strong);
    font-size: 11px;
    font-weight: 850;
    white-space: nowrap;
    overflow: hidden;
}

.image-cover-choice input[type="radio"] {
    width: 13px;
    min-height: 13px;
    accent-color: var(--brand);
}

.image-delete-button {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    color: var(--danger);
    background: color-mix(in srgb, var(--panel) 80%, var(--danger) 6%);
    cursor: pointer;
}

.image-delete-button:hover {
    color: #fff;
    background: var(--danger);
}

.image-delete-button svg {
    width: 15px;
    height: 15px;
}

.image-help {
    margin: 0;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.image-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: none;
    place-items: center;
    padding: 28px;
    background: rgba(2, 8, 20, .76);
}

.image-preview-modal.is-open {
    display: grid;
}

.image-preview-modal img {
    max-width: min(900px, 92vw);
    max-height: 84vh;
    border-radius: 12px;
    background: var(--panel);
    box-shadow: 0 28px 70px rgba(0, 0, 0, .34);
}

.image-preview-modal button {
    position: absolute;
    top: 22px;
    right: 24px;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, .12);
    font-size: 24px;
    cursor: pointer;
}

.category-modal {
    position: fixed;
    inset: 0;
    z-index: 88;
    display: none;
    place-items: center;
    padding: 22px;
    background: rgba(2, 8, 20, .68);
}

.category-modal.is-open {
    display: grid;
}

.category-modal-card {
    width: min(440px, 94vw);
    display: grid;
    gap: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 16px;
    padding: 18px;
    background: var(--panel);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
}

.category-modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.category-modal-head h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: 20px;
}

.category-modal-head p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.category-modal-head button {
    width: 34px;
    height: 34px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    color: var(--text-strong);
    background: var(--input);
    cursor: pointer;
    font-size: 22px;
}

.category-create-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
}

.category-create-row input {
    width: 100%;
    min-height: 40px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font-weight: 750;
}

.category-create-row button {
    min-height: 40px;
    border: 0;
    border-radius: 10px;
    padding: 0 14px;
    color: #fff;
    background: var(--brand);
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
}

.category-list {
    display: grid;
    gap: 7px;
    max-height: 260px;
    overflow: auto;
}

.category-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    padding: 6px 7px 6px 12px;
    background: color-mix(in srgb, var(--input) 82%, var(--panel) 18%);
}

.category-row button:first-child {
    min-width: 0;
    overflow: hidden;
    border: 0;
    color: var(--text-strong);
    background: transparent;
    cursor: pointer;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 850;
}

.category-delete-button {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    color: var(--danger);
    background: color-mix(in srgb, var(--panel) 82%, var(--danger) 6%);
    cursor: pointer;
}

.category-delete-button:hover {
    color: #fff;
    background: var(--danger);
}

.category-delete-button svg {
    width: 15px;
    height: 15px;
}

.category-empty {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 750;
}

.image-count {
    display: grid;
    gap: 8px;
    align-items: end;
}

.product-grid > .span-1 {
    min-width: 0;
}

.product-grid > .span-1 input {
    padding-inline: 8px;
    text-align: center;
}

.image-count strong {
    color: var(--text-strong);
    font-size: 12px;
}

.image-count button {
    width: 38px;
    height: 38px;
    margin: 0;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    color: #fff;
    background: var(--brand);
    font-size: 28px;
    line-height: 1;
}

.span-1 { grid-column: span 1; }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: span 3; }
.span-4 { grid-column: span 4; }
.span-5 { grid-column: span 5; }
.span-6 { grid-column: span 6; }
.span-7 { grid-column: span 7; }
.span-8 { grid-column: span 8; }
.span-9 { grid-column: span 9; }
.span-10 { grid-column: span 10; }
.span-11 { grid-column: span 11; }
.span-12 { grid-column: span 12; }

.badge {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    color: #72ff9d;
    background: rgba(18, 136, 58, .35);
    font-size: 10px;
    line-height: 1.25;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

.badge.is-pending {
    color: var(--warning);
    background: rgba(146, 105, 0, .35);
}

@media (max-width: 1420px) {
    .mp-finance-top {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .mp-finance-actions {
        grid-column: 1 / -1;
        grid-row: 2;
        grid-template-columns: minmax(260px, 1.2fr) minmax(132px, .55fr) minmax(132px, .55fr) 138px 138px auto;
    }

    .mp-sync-form {
        grid-column: 2;
        grid-row: 1;
        justify-content: flex-end;
    }

    .mp-finance-card {
        height: min(calc(100svh - 290px), 680px);
    }
}

@media (max-width: 1260px) {
    .dashboard {
        grid-template-columns: 238px minmax(0, 1fr);
    }

    .sidebar { padding-inline: 12px; }
    .side-logo { margin-left: 0; }
    .logo-sidebar { width: 184px; max-height: 44px; }
    .nav-button {
        min-height: 38px;
        padding-inline: 9px;
        font-size: 13px;
    }
    .submenu { margin-left: 22px; }
    .dashboard-grid { grid-template-columns: 1fr; }
    .page-top {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .page-top > div:first-child {
        min-width: 0;
    }
    .page-top h1,
    .page-top p {
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .list-actions,
    .form-actions {
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 2px;
    }
    .search-input {
        flex: 0 0 360px;
        width: 360px;
    }
    .mp-finance-top {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 12px;
    }
    .mp-finance-actions {
        grid-template-columns: minmax(240px, 1fr) minmax(124px, .45fr) minmax(124px, .45fr) 132px 132px auto;
        overflow-x: auto;
    }
    .mp-finance-actions .search-input {
        flex-basis: auto;
        width: auto;
    }
    .receivable-filter-actions {
        justify-content: flex-start;
    }
    .chart-card,
    .recent-card {
        height: auto;
        min-height: 360px;
    }
    .bars {
        height: 300px;
    }
    .contacts-card {
        height: calc(100svh - 220px);
        min-height: 420px;
    }
    .sales-item-entry {
        grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(90px, .4fr)) 42px;
    }
    .sales-item-entry label:first-child {
        grid-column: span 5;
    }
    .sales-item-entry label:nth-child(5),
    .sales-item-entry label:nth-child(6) {
        grid-column: span 2;
    }
}

@media (max-width: 1040px) {
    .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sales-item-entry {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sales-item-entry label,
    .sales-item-entry label:first-child,
    .sales-item-entry label:nth-child(5),
    .sales-item-entry label:nth-child(6) {
        grid-column: span 1;
    }
    .sales-item-entry .line-confirm {
        width: 100%;
    }
}

@media (max-width: 900px) {
    body.is-dashboard { overflow: auto; }

    .dashboard {
        display: block;
    }

    .sidebar {
        position: static;
        height: auto;
        min-height: auto;
        max-width: 100%;
        gap: 14px;
        padding: 16px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .side-logo {
        margin: 0;
        justify-content: center;
    }

    .logo-sidebar { width: 142px; max-height: 38px; }

    .side-nav {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 4px;
    }

    .menu-title,
    .submenu {
        display: none !important;
    }

    .menu-group { flex: 0 0 auto; }

    .nav-button {
        width: auto;
        min-width: 48px;
        min-height: 44px;
        grid-template-columns: 20px auto;
        padding: 0 14px;
        gap: 9px;
        white-space: nowrap;
        font-size: 14px;
    }

    .nav-button .chev { display: none; }

    .sidebar-bottom {
        margin: 0;
        display: none;
    }

    .dash-main { padding: 22px 16px; }
    .mp-finance-top {
        grid-template-columns: 1fr;
    }
    .mp-finance-actions {
        grid-column: auto;
        grid-row: auto;
        grid-template-columns: minmax(240px, 1fr) minmax(130px, .55fr) minmax(130px, .55fr) 136px 136px auto;
        overflow-x: auto;
        padding-bottom: 4px;
    }
    .mp-sync-form {
        grid-column: auto;
        grid-row: auto;
        justify-content: flex-start;
    }
    .mp-finance-card {
        height: auto;
        min-height: 460px;
    }
    .form-page-main {
        height: auto;
        min-height: 100svh;
        overflow: visible;
    }
    .customer-form {
        height: auto;
        display: block;
    }
    .form-card {
        max-height: none;
        overflow: visible;
    }
    .logo-upload {
        grid-template-columns: 1fr;
    }
    .mini-grid,
    .catalog-panel,
    .catalog-app-layout,
    .catalog-inputs-grid {
        grid-template-columns: 1fr;
    }
    .order-items {
        overflow-x: auto;
    }
    .order-items-head,
    .order-item-row {
        min-width: 900px;
    }
    .order-summary {
        display: grid;
        justify-content: stretch;
    }
    .permissions-grid {
        grid-template-columns: 1fr;
    }
    .seller-user-fields {
        grid-template-columns: 1fr;
    }
    .dash-top { display: grid; }
    .top-actions,
    .search-box { width: 100%; }
    .receivable-filters {
        grid-template-columns: 1fr;
    }
    .contacts-footer {
        align-items: flex-start;
        flex-direction: column;
        padding-block: 12px;
    }
    .receivable-totals {
        justify-content: flex-start;
    }
    .bars { gap: 12px; }
    .bar { width: 32px; }
    .chart-card,
    .recent-card {
        min-height: 320px;
    }
}

@media (max-width: 640px) {
    body { overflow: auto; }
    .page { padding: 34px 17px; }
    .login-shell { gap: 24px; }
    .login-card {
        min-height: auto;
        padding: 30px 24px 28px;
        border-radius: 22px;
    }
    .login-card h1 {
        margin-bottom: 26px;
        font-size: 22px;
    }
    label { font-size: 16px; }
    input { height: 50px; }
    .login-card > button { height: 50px; font-size: 17px; }
    .actions { font-size: 14px; }
    .stats-grid { grid-template-columns: 1fr; }
    .chart-card,
    .recent-card { min-height: 320px; }
    .bars { height: 220px; }
    .sale-row {
        grid-template-columns: 30px 1fr;
    }
    .sale-value {
        grid-column: 2;
        align-items: flex-start;
        text-align: left;
        white-space: normal;
    }
}

/* Integracoes */
.integrations-form {
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 6px;
}

.integrations-form > .page-top { grid-row: 1; }
.integrations-form > .integration-tabs { grid-row: 2; }
.integrations-form > .integrations-card {
    min-height: 0;
    grid-row: 3;
}

.integrations-feedback:empty {
    display: none;
}

.integrations-feedback {
    position: fixed;
    top: 18px;
    right: 24px;
    z-index: 620;
    display: grid;
    gap: 10px;
    width: min(420px, calc(100vw - 48px));
    pointer-events: none;
}

.integrations-feedback .page-alert {
    pointer-events: auto;
    box-shadow: 0 10px 26px rgba(15, 32, 56, .18);
}

.integrations-card {
    display: grid;
    align-content: start;
    gap: 20px;
    padding: 22px 24px 26px;
}

.integration-tabs {
    min-width: 0;
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 8px 10px;
    background: var(--panel);
    box-shadow: var(--shadow);
    scrollbar-width: thin;
}

.integration-tab {
    width: 150px;
    min-width: 150px;
    height: 54px;
    min-height: 54px;
    flex: 0 0 150px;
    display: grid;
    grid-template-columns: 34px 1fr;
    grid-template-rows: 1fr auto;
    align-items: center;
    gap: 0 9px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 7px 11px;
    color: var(--muted-strong);
    background: var(--panel-soft);
    text-align: left;
    text-decoration: none;
}

.integration-tab strong {
    font-size: 13px;
    white-space: nowrap;
}

.integration-tab small {
    grid-column: 2;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
}

.integration-tab.is-active {
    border-color: var(--brand);
    color: var(--text-strong);
    background: color-mix(in srgb, var(--brand) 8%, var(--panel));
    box-shadow: inset 0 -2px 0 var(--brand);
}

.integration-tab:disabled {
    cursor: not-allowed;
    opacity: .62;
}

.integration-panel {
    display: none;
}

.integration-panel.is-active {
    display: block;
}

.integration-bubble-stack.is-active {
    grid-row: 4;
    grid-column: 1 / -1;
    min-width: 0;
    max-height: calc(100vh - 115px);
    overflow-y: auto;
    overscroll-behavior: contain;
    display: grid;
    gap: 16px;
    align-content: start;
}

.integration-bubble-stack .bubble-section-divider {
    border-top: 1px solid #dfe5ed;
    margin-top: 14px;
    padding-top: 14px;
}

.integration-provider-head-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.danger-action-outline {
    border: 1px solid #f2b8b5;
    background: transparent;
    color: #912018;
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.danger-action-outline:hover {
    background: #fef4f3;
}

.integration-hidden-form {
    display: none;
}

.integration-danger-modal-field {
    display: grid;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: var(--muted-strong);
    margin-top: 4px;
}

.integration-danger-modal-field input {
    font-weight: 400;
}

.sinc-bubble-relatorio-wrap {
    max-height: 420px;
    overflow: auto;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
}

.sinc-bubble-relatorio-tabela {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.sinc-bubble-relatorio-tabela th {
    position: sticky;
    top: 0;
    background: var(--panel-soft);
    text-align: left;
    padding: 8px 10px;
    font-weight: 800;
    color: var(--muted-strong);
    border-bottom: 1px solid var(--line-soft);
}

.sinc-bubble-relatorio-tabela td {
    padding: 6px 10px;
    border-bottom: 1px solid var(--line-soft);
}

.sinc-bubble-linha-excluir td {
    background: #fef4f3;
    color: #912018;
}

.sinc-bubble-linha-incluir td {
    background: #fff8e6;
    color: #8a5a00;
}

.sinc-bubble-linha-erro td {
    background: #f5f5f5;
    color: var(--muted);
}

.integration-provider-mark {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    grid-row: 1 / 3;
    border-radius: 8px;
    color: #fff;
    font-size: 11px;
    font-weight: 950;
}

.integration-provider-mark.mp { background: #168ddb; }
.integration-provider-mark.rc { background: #426aa1; }
.integration-provider-mark.sp { background: #d71920; }
.integration-provider-mark.ps { background: #0082c8; }
.integration-provider-mark.wa { background: #24b866; }
.integration-provider-mark.os { background: #e5484d; }
.integration-provider-mark.ef { background: #26364b; }
.integration-provider-mark.tn { background: #2764c4; }
.integration-provider-mark.pd { background: #0f8a75; }
.integration-provider-mark.bd { background: #4b5563; }

/* Superficie unificada da tela de Integracoes. */
.integrations-main {
    background: #f6f8fb;
}

.integrations-form {
    gap: 6px;
}

.integrations-form > .page-top {
    min-height: 52px;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    padding: 0 2px;
}

.integrations-form > .page-top h1 {
    margin-bottom: 1px;
    font-size: 22px;
    line-height: 1.1;
}

.integrations-form > .page-top p {
    font-size: 12px;
    font-weight: 650;
}

.integration-tabs {
    min-height: 40px;
    gap: 6px;
    padding: 4px;
    border-color: #e6ebf1;
    background: #fbfcfe;
    box-shadow: 0 2px 8px rgba(21, 39, 66, .03);
}

.integration-tab {
    width: auto;
    min-width: 92px;
    height: 32px;
    min-height: 32px;
    flex: 0 0 auto;
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 0 7px;
    border-color: transparent;
    background: transparent;
    padding: 2px 10px;
    opacity: .82;
    transition: background .16s ease, border-color .16s ease, opacity .16s ease, transform .16s ease;
}

.integration-tab:hover:not(:disabled) {
    border-color: #dde5f0;
    background: #fff;
    opacity: 1;
    transform: translateY(-1px);
}

.integration-tab.is-active {
    border-color: #356ca7;
    background: #eef5ff;
    opacity: 1;
    box-shadow: inset 0 -2px 0 #356ca7;
}

.integration-tab strong {
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.integration-tab small {
    font-size: 8.5px;
    font-weight: 700;
    white-space: nowrap;
}

.integration-tab .integration-provider-mark {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    font-size: 6.5px;
}

.integrations-card {
    min-height: 0;
    border: 1px solid #dfe5ed;
    border-radius: 8px;
    padding: 20px 22px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(19, 39, 64, .06);
}

.integration-section {
    gap: 20px;
    border-top: 0;
    padding: 0;
}

.integration-provider-head {
    min-height: 62px;
    padding: 0 0 20px;
    border-bottom: 1px solid #e4e9f0;
}

.integration-provider-head > div {
    min-width: 0;
    gap: 14px;
}

.integration-provider-head .integration-provider-mark {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    box-shadow: 0 5px 11px rgba(36, 82, 136, .16);
}

.integration-provider-head h2 {
    font-size: 20px;
    font-weight: 850;
}

.integration-provider-head p,
.integration-section-head p {
    color: #6e7d91;
    font-size: 12px;
    font-weight: 600;
}

.integration-fields-grid {
    gap: 16px;
}

.integration-fields-grid label,
.integration-environment {
    color: var(--muted-strong);
    font-size: 12px;
    font-weight: 800;
}

.integration-environment select,
.integration-fields-grid input,
.integration-fields-grid select {
    height: 42px;
    min-height: 42px;
    margin-top: 6px;
    border-color: var(--line-soft);
    border-radius: 6px;
    background: var(--input);
    box-shadow: none;
    color: var(--text-strong);
    font-weight: 650;
}

.integration-environment select:focus,
.integration-fields-grid input:focus,
.integration-fields-grid select:focus {
    border-color: var(--brand);
    background: var(--panel);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent);
}

.integration-enable {
    min-height: 38px;
    gap: 10px;
    color: var(--muted-strong);
    font-size: 12px;
    font-weight: 800;
}

.integration-enable input,
.integration-check input {
    width: 17px;
    height: 17px;
    flex-basis: 17px;
}

.integration-operation-summary,
.integration-token-status {
    gap: 10px;
    border: 1px solid var(--line-soft);
    border-radius: 6px;
    padding: 13px 15px;
    background: var(--panel-soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.integration-operation-summary strong {
    color: var(--text-strong);
    font-weight: 850;
}

.integration-connect-card {
    border-color: var(--line-soft);
    border-radius: 8px;
    padding: 18px;
    background: var(--panel-soft);
}

.integration-connect-card.is-connected {
    border-color: var(--success);
    background: color-mix(in srgb, var(--success) 12%, var(--panel-soft));
}

.integrations-card .form-actions,
.integrations-card .integration-save-row,
.integration-connect-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 4px;
}

.integrations-card .form-actions button,
.integrations-card .form-actions .button-like,
.integrations-card .integration-connect-actions button,
.integrations-card .integration-connect-actions .button-like {
    min-height: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0;
    border-radius: 6px;
    padding: 0 15px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.integrations-card .secondary-action,
.integrations-card .button-like.secondary-action {
    border-color: #c8d5e4;
    background: #fff;
    color: #294c72;
}

.integrations-card .secondary-action:hover,
.integrations-card .button-like.secondary-action:hover {
    border-color: #86a9ce;
    background: #f4f8fc;
}

@media (max-width: 760px) {
    .integrations-card { min-height: 0; padding: 20px 16px; }
    .integration-provider-head { align-items: flex-start; gap: 14px; }
    .integration-provider-head .integration-enable { padding-top: 4px; }
    .integrations-card .form-actions > * { flex: 1 1 100%; }
}

.integration-provider-head,
.integration-provider-head > div,
.integration-section-head,
.integration-enable,
.integration-check {
    display: flex;
    align-items: center;
}

.integration-provider-head {
    justify-content: space-between;
    gap: 20px;
    padding: 2px 2px 0;
}

.integration-provider-head > div {
    gap: 12px;
}

.integration-provider-head .integration-provider-mark {
    width: 44px;
    height: 44px;
    font-size: 13px;
}

.integration-provider-head h2,
.integration-section h3 {
    margin: 0;
    color: var(--text-strong);
}

.integration-provider-head h2 { font-size: 21px; }
.integration-section h3 { font-size: 16px; }

.integration-provider-head p,
.integration-section-head p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.integration-enable,
.integration-check {
    gap: 9px;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 850;
}

.integration-enable input,
.integration-check input {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    accent-color: var(--brand);
}

.integration-section {
    display: grid;
    gap: 16px;
    border-top: 2px solid color-mix(in srgb, var(--brand) 72%, var(--line-soft));
    padding: 17px 2px 2px;
}

.integration-section-head {
    justify-content: space-between;
    gap: 18px;
}

.integration-environment {
    width: min(220px, 100%);
    display: grid;
    gap: 6px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 850;
}

.integration-environment select,
.integration-fields-grid input,
.integration-fields-grid select {
    width: 100%;
    height: 44px;
    min-height: 44px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 13px;
    font-weight: 750;
}

.integration-token-status {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 12px 14px;
    background: var(--panel-soft);
}

.integration-connect-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 16px;
    background: var(--panel-soft);
}

.integration-connect-card.is-connected {
    border-color: color-mix(in srgb, #0ea66b 42%, var(--line-soft));
    background: color-mix(in srgb, #0ea66b 6%, var(--panel));
}

.integration-connect-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: #159ad6;
    font-size: 14px;
    font-weight: 950;
}

.integration-connect-card.is-connected .integration-connect-icon {
    background: #0ea66b;
    font-size: 22px;
}

.integration-connect-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.integration-connect-copy strong {
    color: var(--text-strong);
    font-size: 16px;
    font-weight: 950;
}

.integration-connect-copy p,
.integration-connect-copy small {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.4;
}

.integration-connect-copy small {
    color: #0a8b5a;
    font-weight: 850;
}

.integration-connect-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

.integration-connect-actions button {
    min-height: 42px;
    margin: 0;
    border-radius: 8px;
    padding: 0 17px;
    font-size: 13px;
    font-weight: 900;
    white-space: nowrap;
}

.integration-connect-actions .secondary-action {
    border: 1px solid var(--brand);
    color: var(--brand-strong);
    background: var(--panel);
}

.button-like {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.integration-mobile-connect {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 156px auto;
    align-items: center;
    gap: 16px;
    border: 1px dashed color-mix(in srgb, var(--brand) 48%, var(--line-soft));
    border-radius: 8px;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--brand) 5%, var(--panel));
}

.integration-mobile-connect strong {
    color: var(--text-strong);
    font-size: 14px;
    font-weight: 950;
}

.integration-mobile-connect p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.4;
}

.integration-mobile-connect .secondary-action {
    min-height: 40px;
    border: 1px solid var(--brand);
    border-radius: 8px;
    padding: 0 16px;
    color: var(--brand-strong);
    background: var(--panel);
    font-size: 13px;
    font-weight: 900;
    white-space: nowrap;
}

.integration-oauth-qr {
    width: 156px;
    height: 156px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 10px;
    background: #fff;
}

.integration-oauth-qr canvas,
.integration-oauth-qr img,
.integration-oauth-qr svg {
    width: 132px !important;
    height: 132px !important;
}

.integration-oauth-qr span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-align: center;
}

.credentials-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    place-items: center;
    padding: 16px;
    background: rgba(15, 23, 42, .42);
    backdrop-filter: blur(5px);
}

.credentials-modal.is-open {
    display: grid;
}

.credentials-card {
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100dvh - 40px);
    overflow: auto;
}

.token-update-card {
    width: min(560px, calc(100vw - 32px));
    max-height: calc(100dvh - 32px);
    padding: 22px 24px;
}

.token-update-card h2 {
    margin-bottom: 6px;
    text-align: left;
}

.token-update-card .modal-head {
    margin-bottom: 18px;
}

.token-update-card .credentials-field {
    grid-template-columns: minmax(0, 1fr) auto;
}

.token-update-card .integration-save-row {
    margin-top: 18px;
    justify-content: flex-end;
}

.credentials-list {
    display: grid;
    gap: 12px;
}

.credentials-list label {
    display: grid;
    gap: 6px;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 850;
}

.credentials-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
}

.credentials-field input {
    width: 100%;
    height: 42px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--text-strong);
    background: var(--input);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
    font-weight: 750;
}

.credentials-field button {
    min-width: 74px;
    border: 1px solid var(--brand);
    border-radius: 8px;
    padding: 0 12px;
    color: var(--brand-strong);
    background: var(--panel);
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.credentials-warning {
    margin-top: 14px;
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--muted-strong);
    background: var(--panel-soft);
    font-size: 12px;
    font-weight: 750;
}

.integration-token-status > div:not(.integration-status-pill) {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.integration-token-status span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
}

.integration-token-status strong {
    overflow: hidden;
    color: var(--text-strong);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.integration-api-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.integration-api-actions button {
    min-height: 42px;
    margin: 0;
    border: 1px solid var(--brand);
    border-radius: 8px;
    padding: 0 18px;
    font-size: 13px;
    font-weight: 900;
    cursor: pointer;
}

.integration-api-actions .primary-action {
    color: #fff;
    background: var(--brand);
}

.integration-api-actions .secondary-action {
    color: var(--brand-strong);
    background: var(--panel);
}

.integration-api-actions button:disabled {
    border-color: var(--line-soft);
    color: var(--muted);
    background: var(--panel-soft);
    cursor: not-allowed;
    opacity: .72;
}

.integration-status-pill {
    border: 1px solid var(--line-soft);
    border-radius: 999px;
    padding: 7px 10px;
    color: var(--muted-strong);
    background: var(--panel);
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.integration-status-pill.is-ready {
    border-color: color-mix(in srgb, #0ea66b 45%, var(--line-soft));
    color: #0a8b5a;
    background: color-mix(in srgb, #0ea66b 9%, var(--panel));
}

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

.integration-fields-grid label {
    min-width: 0;
    display: grid;
    align-content: end;
    gap: 7px;
    margin: 0;
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 850;
}

.integration-fields-grid label > small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.35;
}

.integration-secret {
    width: 100%;
}

.integration-secret .toggle-password {
    bottom: 6px;
    color: var(--muted) !important;
}

.integration-secret .toggle-password:hover {
    color: var(--text-strong) !important;
}

.integration-fields-grid.operational {
    grid-template-columns: repeat(2, minmax(0, 1fr)) repeat(2, max-content);
    align-items: end;
}

.integration-fields-grid.operational .integration-check {
    min-height: 44px;
    padding: 0 6px;
}

.integration-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}

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

.integration-link-pedidos {
    grid-column: 1 / -1;
}

.integration-payment-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    padding: 11px 13px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--panel-soft);
}

.integration-payment-methods .integration-check {
    min-height: 24px;
}

.integration-fields-grid .span-two {
    grid-column: 1 / -1;
}

.integration-mp-resources .integration-section-head > button {
    min-height: 40px;
    margin: 0;
    border: 1px solid var(--brand);
    border-radius: 8px;
    padding: 0 16px;
    color: var(--brand-strong);
    background: var(--panel);
    font-weight: 850;
    cursor: pointer;
}

.integration-resource-status {
    border-radius: 7px;
    padding: 9px 12px;
    color: var(--muted-strong);
    background: var(--panel-soft);
    font-size: 12px;
    font-weight: 750;
}

.integration-resource-status.is-success { color: #087c52; }
.integration-resource-status.is-error { color: #c33b49; }

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

.integration-resource-card {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 12px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 14px;
    background: var(--panel-soft);
}

.integration-resource-card h4 {
    margin: 0;
    color: var(--text-strong);
    font-size: 14px;
}

.integration-resource-card label,
.integration-resource-fields label {
    min-width: 0;
    display: grid;
    gap: 6px;
    color: var(--text-strong);
    font-size: 11px;
    font-weight: 850;
}

.integration-resource-card input,
.integration-resource-card select {
    width: 100%;
    height: 42px;
    min-height: 42px;
    border: 1px solid var(--line-soft);
    border-radius: 7px;
    padding: 0 11px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 12px;
    font-weight: 750;
}

.integration-resource-card > button,
.integration-resource-fields > button {
    min-height: 40px;
    margin: 0;
    border: 0;
    border-radius: 7px;
    padding: 0 13px;
    color: #fff;
    background: var(--brand);
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.integration-resource-card button:disabled { opacity: .55; cursor: wait; }

.integration-resource-create {
    border-top: 1px solid var(--line-soft);
    padding-top: 10px;
}

.integration-resource-create summary {
    color: var(--brand-strong);
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.integration-resource-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding-top: 12px;
}

.integration-resource-fields .span-two { grid-column: 1 / -1; }

.integration-print-fields {
    display: grid;
    gap: 10px;
    padding-top: 12px;
}

.integration-print-fields label {
    display: grid;
    gap: 6px;
}

.integration-print-fields textarea {
    width: 100%;
    min-height: 88px;
    resize: vertical;
    border: 1px solid var(--line-soft);
    border-radius: 7px;
    padding: 10px 11px;
    color: var(--text-strong);
    background: var(--input);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.4;
}

.integration-print-preview {
    width: 100%;
    border: 1px dashed var(--line-soft);
    border-radius: 8px;
    padding: 8px;
    background: var(--panel);
}

.integration-print-preview img {
    width: 100%;
    max-height: 150px;
    object-fit: contain;
    display: block;
}

.integration-operation-summary {
    display: grid;
    gap: 9px;
}

.integration-operation-summary span {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--line-soft);
    padding: 7px 0;
    color: var(--muted-strong);
    font-size: 12px;
    font-weight: 700;
}

.integration-operation-summary strong { color: var(--text-strong); }

.bubble-sync-order-list {
    display: grid;
    gap: 4px;
    margin: 0;
    padding: 0 0 0 20px;
    color: var(--muted-strong);
    font-size: 12px;
    font-weight: 700;
}

.bubble-sync-order-list li strong { color: var(--text-strong); }

.bubble-sync-order-list li small {
    display: block;
    color: var(--muted);
    font-weight: 600;
}

.integration-force-full {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--muted-strong);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.integration-force-full input {
    margin: 0;
}

@media (max-width: 1180px) {
    .integration-fields-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .integration-columns {
        grid-template-columns: 1fr;
    }

    .integration-resource-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .integrations-form {
        gap: 10px;
    }

    .integration-tabs {
        min-height: 68px;
        padding: 6px 8px;
    }

    .integrations-card {
        padding-inline: 16px;
    }

    .integration-provider-head,
    .integration-section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .integration-token-status,
    .integration-fields-grid,
    .integration-fields-grid.operational,
    .integration-fields-grid.compact {
        grid-template-columns: 1fr;
    }

    .integration-fields-grid .span-two {
        grid-column: auto;
    }

    .integration-status-pill {
        justify-self: start;
    }

    .integration-connect-card {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .integration-connect-icon {
        width: 44px;
        height: 44px;
    }

    .integration-connect-actions {
        grid-column: 1 / -1;
        flex-wrap: wrap;
    }

    .integration-mobile-connect {
        grid-template-columns: 1fr;
    }

    .integration-oauth-qr {
        justify-self: start;
    }

    .credentials-field {
        grid-template-columns: 1fr;
    }

    .integration-resource-fields { grid-template-columns: 1fr; }
    .integration-resource-fields .span-two { grid-column: auto; }
}

/* Rota Certa / CIOT */
.ciot-table .contacts-head,
.ciot-table .contacts-row {
    grid-template-columns: minmax(170px, 1.45fr) 74px 118px 92px 82px 104px 42px;
    column-gap: 10px;
}
.ciot-table .contacts-head > span,
.ciot-table .contacts-row > span,
.ciot-table .contacts-row > strong,
.ciot-table .contacts-row > div {
    min-width: 0;
}
.ciot-table .contacts-head > span {
    white-space: nowrap;
}
.ciot-table .contacts-row .status-pill {
    min-width: 0;
    width: fit-content;
    max-width: 100%;
    padding-inline: 10px;
}
.ciot-table .action-cell {
    justify-content: center;
}
.cte-table .contacts-head,
.cte-table .contacts-row {
    grid-template-columns: 38px minmax(82px, .56fr) minmax(62px, .44fr) minmax(86px, .56fr) minmax(148px, 1.04fr) minmax(166px, 1.16fr) minmax(104px, .7fr) minmax(116px, .76fr) minmax(70px, .44fr) 42px;
    column-gap: 8px;
    row-gap: 8px;
}
.cte-card {
    height: min(calc(100svh - 170px), 638px);
    min-height: 0;
}
.cte-card .contacts-table {
    width: 100%;
    min-width: 0;
}
.cte-card .contacts-scroll {
    max-height: none;
}
.cte-table .contacts-head {
    min-height: 44px;
}
.cte-table .contacts-row {
    min-height: 58px;
    padding-top: 8px;
    padding-bottom: 8px;
}
.cte-table .contacts-row > *,
.cte-main-cell {
    min-width: 0;
}
.cte-main-cell strong,
.cte-main-cell small,
.cte-key-cell {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cte-key-cell {
    color: var(--muted);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 11px;
    font-weight: 700;
}
.cte-insurance-cell {
    min-width: 0;
    display: grid;
    gap: 4px;
    align-content: center;
}
.cte-insurance-cell .status-pill {
    width: fit-content;
}
.cte-insurance-cell small {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: var(--muted);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cte-table .contacts-row > strong:nth-child(3) {
    font-size: 14px;
    white-space: nowrap;
}
.cte-table .status-pill {
    justify-self: start;
}
.cte-select-cell,
.mdfe-select-cell {
    display: grid;
    place-items: center;
    width: 28px;
    justify-self: center;
}
.cte-select-cell input,
.mdfe-select-cell input {
    appearance: none;
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    margin: 0;
    border: 2px solid var(--line-soft);
    border-radius: 4px;
    background: var(--input);
    accent-color: var(--brand);
    cursor: pointer;
}
.cte-select-cell input:checked,
.mdfe-select-cell input:checked {
    border-color: var(--brand);
    background:
        linear-gradient(45deg, transparent 52%, #fff 52% 62%, transparent 62%) 2px 0 / 6px 10px no-repeat,
        linear-gradient(-45deg, transparent 48%, #fff 48% 58%, transparent 58%) 5px 0 / 7px 10px no-repeat,
        var(--brand);
}
.cte-select-cell input:disabled,
.mdfe-select-cell input:disabled {
    cursor: not-allowed;
    opacity: .45;
}
.cte-table .contacts-row > span,
.cte-table .contacts-row > strong {
    align-self: center;
}
.cte-table .contacts-row > span:not(.status-pill):not(.cte-insurance-icon):not(.cte-select-cell),
.cte-table .contacts-row > strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cte-insurance-icon {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    justify-self: center;
    color: #f59e0b;
}
.cte-insurance-icon svg {
    width: 22px;
    height: 22px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.cte-insurance-icon.is-ok {
    color: #22c55e;
}
.cte-insurance-icon.is-error {
    color: #ef4444;
}
.cte-insurance-icon.is-pending {
    color: #f59e0b;
}
.mdfe-table .contacts-head,
.mdfe-table .contacts-row {
    grid-template-columns: 38px minmax(82px, .56fr) minmax(62px, .42fr) minmax(78px, .5fr) minmax(82px, .5fr) minmax(104px, .68fr) minmax(86px, .56fr) minmax(70px, .46fr) minmax(110px, .72fr) minmax(70px, .44fr) 42px;
    column-gap: 8px;
    row-gap: 8px;
}
.cte-table .contacts-head > *,
.cte-table .contacts-row > *,
.mdfe-table .contacts-head > *,
.mdfe-table .contacts-row > * {
    min-width: 0;
}
.cte-table .action-cell,
.mdfe-table .action-cell {
    width: 42px;
    justify-self: end;
}
.cte-table .dots-button,
.mdfe-table .dots-button {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    justify-self: end;
}
.mdfe-table .contacts-row strong,
.mdfe-table .contacts-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mdfe-table .contacts-row > span,
.mdfe-table .contacts-row > strong {
    align-self: center;
}
.mdfe-table .contacts-row > span:not(.status-pill):not(.mdfe-insurance-icon):not(.mdfe-select-cell),
.mdfe-table .contacts-row > strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mdfe-insurance-icon {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    justify-self: center;
    color: #f59e0b;
}
.mdfe-insurance-icon svg {
    width: 22px;
    height: 22px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.mdfe-insurance-icon.is-ok {
    color: #22c55e;
}
.mdfe-insurance-icon.is-error {
    color: #ef4444;
}
.mdfe-insurance-icon.is-pending {
    color: #f59e0b;
}
.mdfe-doc-list {
    display: grid;
    gap: 8px;
    max-height: 280px;
    overflow: auto;
    padding: 8px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel-soft);
}
.mdfe-doc-list label {
    min-height: 58px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 8px;
    background: var(--panel);
}
.mdfe-doc-list span,
.mdfe-doc-list strong,
.mdfe-doc-list small {
    min-width: 0;
}
.mdfe-doc-list strong,
.mdfe-doc-list small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mdfe-doc-list small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.cte-file-field input[type="file"] {
    height: auto;
    min-height: 54px;
    padding: 14px;
    border-style: dashed;
    line-height: 1.3;
}
.cte-file-field small {
    display: block;
    margin-top: 8px;
}
.trips-table .contacts-head,
.trips-table .contacts-row {
    grid-template-columns: minmax(150px, .9fr) minmax(220px, 1.25fr) minmax(190px, 1fr) 80px 110px minmax(140px, .85fr);
}
.drivers-table .contacts-head,
.drivers-table .contacts-row {
    grid-template-columns: minmax(180px, 1.15fr) minmax(130px, .75fr) minmax(180px, 1fr) minmax(120px, .8fr) 96px 86px;
}
.vehicles-table .contacts-head,
.vehicles-table .contacts-row {
    grid-template-columns: minmax(150px, 1fr) minmax(110px, .65fr) minmax(120px, .75fr) minmax(170px, 1fr) 110px 86px;
}
.routes-table .contacts-head,
.routes-table .contacts-row {
    grid-template-columns: minmax(180px, 1fr) minmax(170px, .9fr) minmax(170px, .9fr) minmax(120px, .75fr) 96px 86px;
}
.sales-routes-table .contacts-head,
.sales-routes-table .contacts-row {
    grid-template-columns: minmax(120px, .75fr) minmax(130px, .85fr) minmax(170px, 1fr) minmax(120px, .85fr) 96px 110px 86px;
}
.sales-routes-table .contacts-row > div {
    min-width: 0;
}
.sales-routes-table .contacts-row strong,
.sales-routes-table .contacts-row small {
    overflow-wrap: anywhere;
}
.trips-table .contacts-row > div {
    min-width: 0;
}
.drivers-table .contacts-row > div {
    min-width: 0;
}
.vehicles-table .contacts-row > div,
.routes-table .contacts-row > div {
    min-width: 0;
}
.trips-table .contacts-row strong,
.trips-table .contacts-row small,
.drivers-table .contacts-row strong,
.drivers-table .contacts-row small,
.vehicles-table .contacts-row strong,
.vehicles-table .contacts-row small,
.routes-table .contacts-row strong,
.routes-table .contacts-row small {
    overflow-wrap: anywhere;
}
.status-pill {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 3px 12px;
    border-radius: 999px;
    border: 1px solid rgba(66, 106, 161, .35);
    background: rgba(66, 106, 161, .12);
    color: var(--accent-strong, #315f9b);
    font-weight: 800;
    font-size: 13px;
}
.status-encerrado { background: rgba(16, 185, 129, .12); color: #047857; border-color: rgba(16, 185, 129, .35); }
.status-erro { background: rgba(220, 38, 38, .14); color: #b91c1c; border-color: rgba(220, 38, 38, .35); }
.trip-status-finalizada { background: rgba(16, 185, 129, .12); color: #047857; border-color: rgba(16, 185, 129, .35); }
.trip-status-cancelada { background: rgba(220, 38, 38, .14); color: #b91c1c; border-color: rgba(220, 38, 38, .35); }
.trip-status-em-andamento { background: rgba(245, 158, 11, .14); color: #92400e; border-color: rgba(245, 158, 11, .35); }
.trip-status-pronta-para-iniciar { background: rgba(66, 106, 161, .12); color: var(--accent-strong, #315f9b); border-color: rgba(66, 106, 161, .35); }
.trip-status-rascunho { background: rgba(107, 114, 128, .12); color: #4b5563; border-color: rgba(107, 114, 128, .32); }
.ciot-preview-card { margin-top: 18px; }
.ciot-preview-header,
.ciot-preview-layout {
    display: grid;
    gap: 18px;
}
.ciot-preview-header {
    grid-template-columns: 1fr auto;
    align-items: center;
    border-bottom: 2px solid var(--accent, #426aa1);
    padding-bottom: 14px;
}
.ciot-preview-header h2,
.ciot-preview-header p { margin: 0; }
.ciot-preview-layout { grid-template-columns: minmax(280px, .85fr) minmax(0, 1.4fr); align-items: stretch; }
.ciot-cte-list {
    display: grid;
    gap: 10px;
    align-content: start;
}
.ciot-cte-list h3 { margin: 0 0 4px; }
.ciot-cte-item {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 10px;
    background: var(--surface-muted, #f3f6fb);
}
.ciot-cte-item span,
.ciot-cte-item small { color: var(--muted, #6b7280); overflow-wrap: anywhere; }

/* Padrao visual compartilhado para listagens administrativas (Figma 357:4). */
:root[data-theme="dark"] {
    --list-page-bg: var(--app-bg);
    --list-surface: var(--panel);
    --list-surface-soft: var(--panel-soft);
    --list-border: var(--line-soft);
    --list-row-border: rgba(148, 163, 184, .18);
    --list-text-primary: var(--text-strong);
    --list-text-secondary: var(--muted);
    --list-action-bg: var(--brand);
    --list-action-border: var(--brand);
    --list-action-text: #ffffff;
    --list-hover-bg: rgba(59, 96, 143, .16);
}

:root[data-theme="light"] {
    --list-page-bg: #f4f4f5;
    --list-surface: #ffffff;
    --list-surface-soft: #fafafa;
    --list-border: #e4e4e7;
    --list-row-border: rgba(131, 131, 131, .25);
    --list-text-primary: #090f1b;
    --list-text-secondary: #71717a;
    --list-action-bg: #3b608f;
    --list-action-border: #3b608f;
    --list-action-text: #ffffff;
    --list-hover-bg: rgba(59, 96, 143, .06);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .dash-main {
    padding: 32px;
    background: var(--list-page-bg);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .page-top {
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 20px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .page-top h1 {
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .page-top p {
    margin-top: 4px;
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions {
    gap: 12px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .search-input {
    width: 320px;
    height: 44px;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    padding: 0 14px;
    border-color: var(--list-border);
    border-radius: 10px;
    color: var(--list-text-secondary);
    background: var(--list-surface);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .search-input svg {
    width: 18px;
    height: 18px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .search-input input {
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .search-input input::placeholder {
    color: var(--list-text-secondary);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .ghost-action,
.dashboard:has(.contacts-card):not(.dashboard-home) .primary-action {
    min-width: 0;
    min-height: 44px;
    gap: 8px;
    padding: 0 20px;
    border-radius: 10px;
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .ghost-action {
    border-color: var(--list-border);
    color: var(--list-text-primary);
    background: var(--list-surface);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .ghost-action svg {
    width: 16px;
    height: 16px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .primary-action {
    border-color: var(--list-action-border);
    color: var(--list-action-text);
    background: var(--list-action-bg);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .primary-action > span {
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-card {
    height: calc(100svh - 140px);
    min-height: 420px;
    border-color: var(--list-border);
    border-radius: 20px;
    background: var(--list-surface);
    overflow: hidden;
    box-shadow: none;
}

:root[data-theme="light"] .dashboard:has(.contacts-card):not(.dashboard-home) .contacts-card {
    box-shadow: none;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-table {
    min-width: 900px;
    height: 100%;
    min-height: 0;
    background: var(--list-surface);
    align-self: stretch;
    overflow: hidden;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-card > [data-bulk-receivables-delete-form],
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-card > [data-bulk-payables-form] {
    display: none;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-scroll {
    max-height: none;
    height: 100%;
    min-height: 0;
    overflow-x: auto;
    overflow-y: auto;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-head,
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row {
    gap: 14px;
    padding-right: 20px;
    padding-left: 20px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-head {
    min-height: 50px;
    border-bottom-color: var(--list-border);
    color: var(--list-text-primary);
    font-family: "Inter";
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .6px;
    text-transform: uppercase;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row {
    min-height: 68px;
    border-bottom-color: var(--list-row-border);
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row:hover {
    background: var(--list-hover-bg);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > span,
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > strong,
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > div:not(.action-cell) {
    min-width: 0;
    overflow-wrap: anywhere;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row strong {
    color: var(--list-text-primary);
    font-family: "Poppins";
    font-size: 15px;
    font-weight: 500;
    line-height: 1.25;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row small {
    margin-top: 3px;
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 12px;
    font-weight: 400;
    line-height: 1.3;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > span:not(:has(.type-pill)) {
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill,
.dashboard:has(.contacts-card):not(.dashboard-home) .status-pill {
    min-height: 24px;
    padding: 3px 9px;
    border-radius: 20px;
    font-family: "Poppins";
    font-size: 11px;
    font-weight: 600;
    line-height: 1.15;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill {
    border-color: #3b82f6;
    color: #60a5fa;
    background: rgba(59, 130, 246, .12);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-supplier {
    border-color: #a855f7;
    color: #c084fc;
    background: rgba(168, 85, 247, .10);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-admin,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-pago,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-entregue,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-entrada,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-stock-entrada {
    border-color: #22c55e;
    color: #16a34a;
    background: rgba(34, 197, 94, .12);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-service,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-aberto,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-parcial,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-aguardando_pagamento,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-estornado {
    border-color: #f59e0b;
    color: #d97706;
    background: rgba(245, 158, 11, .12);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-atrasado,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-vencido,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-cancelado,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-saida,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-stock-saida {
    border-color: #ef4444;
    color: #dc2626;
    background: rgba(239, 68, 68, .12);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-status-expirado,
.dashboard:has(.contacts-card):not(.dashboard-home) .type-pill.is-stock-ajuste {
    border-color: #94a3b8;
    color: #64748b;
    background: rgba(100, 116, 139, .12);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-origin-pill {
    min-width: 18px;
    min-height: 18px;
    padding: 0 5px;
    font-size: 9px;
    line-height: 1;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .order-origin-pill.is-pdv {
    border-color: #17c979;
    color: #047857;
    background: rgba(23, 201, 121, .14);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .order-origin-pill.is-order {
    border-color: #5a96ff;
    color: #2563eb;
    background: rgba(90, 150, 255, .12);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .order-origin-pill.is-consignment {
    border-color: #f0b84f;
    color: #b7791f;
    background: rgba(240, 184, 79, .16);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .order-origin-pill.is-tele-venda {
    border-color: #8b5cf6;
    color: #6d28d9;
    background: rgba(139, 92, 246, .16);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-reference-line {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: none;
    min-width: 0;
    overflow: visible;
    white-space: nowrap;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-reference-line strong {
    font-size: 16px;
    line-height: 1.2;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .contacts-row > div:first-child:not(.action-cell) {
    overflow: visible;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .action-cell {
    justify-self: center;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-head > span:last-child {
    text-align: center;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .dots-button {
    width: 36px;
    height: 36px;
    padding: 8px;
    border-radius: 8px;
    color: var(--list-text-secondary);
    font-size: 0;
    letter-spacing: 0;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .dots-button::before {
    content: "";
    width: 20px;
    height: 20px;
    display: block;
    background: currentColor;
    -webkit-mask: radial-gradient(circle at 5px 10px, #000 0 2px, transparent 2.1px), radial-gradient(circle at 10px 10px, #000 0 2px, transparent 2.1px), radial-gradient(circle at 15px 10px, #000 0 2px, transparent 2.1px);
    mask: radial-gradient(circle at 5px 10px, #000 0 2px, transparent 2.1px), radial-gradient(circle at 10px 10px, #000 0 2px, transparent 2.1px), radial-gradient(circle at 15px 10px, #000 0 2px, transparent 2.1px);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .dots-button:hover,
.dashboard:has(.contacts-card):not(.dashboard-home) .action-cell.is-open .dots-button {
    color: var(--list-text-primary);
    background: var(--list-surface-soft);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .row-actions-menu {
    border-color: var(--list-border);
    border-radius: 12px;
    background: var(--list-surface);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .row-actions-menu a,
.dashboard:has(.contacts-card):not(.dashboard-home) .row-actions-menu button {
    min-height: 38px;
    border-color: transparent;
    border-radius: 8px;
    color: var(--list-text-primary);
    background: transparent;
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .row-actions-menu a:hover,
.dashboard:has(.contacts-card):not(.dashboard-home) .row-actions-menu button:hover {
    border-color: transparent;
    background: var(--list-hover-bg);
    color: var(--list-text-primary);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .empty-row {
    min-height: 80px;
    display: grid;
    place-items: center;
    padding: 24px;
    color: var(--list-text-secondary);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-footer {
    min-height: 56px;
    padding: 12px 20px;
    border-top: 1px solid var(--list-border);
    color: var(--list-text-secondary);
    background: var(--list-surface);
    font-family: "Inter";
    font-size: 13px;
    font-weight: 400;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager {
    gap: 8px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager a,
.dashboard:has(.contacts-card):not(.dashboard-home) .pager button {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-color: var(--list-border);
    border-radius: 8px;
    color: var(--list-text-primary);
    background: transparent;
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 400;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager svg {
    width: 16px;
    height: 16px;
    display: block;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager > :first-child,
.dashboard:has(.contacts-card):not(.dashboard-home) .pager > :last-child {
    font-size: 0;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager > :first-child:not(:has(svg))::before,
.dashboard:has(.contacts-card):not(.dashboard-home) .pager > :last-child:not(:has(svg))::before {
    content: "";
    width: 16px;
    height: 16px;
    display: block;
    background: currentColor;
    -webkit-mask: linear-gradient(45deg, transparent 42%, #000 43% 57%, transparent 58%), linear-gradient(-45deg, transparent 42%, #000 43% 57%, transparent 58%);
    mask: linear-gradient(45deg, transparent 42%, #000 43% 57%, transparent 58%), linear-gradient(-45deg, transparent 42%, #000 43% 57%, transparent 58%);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager > :first-child:not(:has(svg))::before {
    transform: rotate(180deg);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager a.is-active,
.dashboard:has(.contacts-card):not(.dashboard-home) .pager button.is-active {
    border-color: var(--list-action-border);
    color: #ffffff;
    background: var(--list-action-bg);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .pager a.is-disabled {
    opacity: .42;
    pointer-events: none;
}

@media (max-width: 1120px) {
    .dashboard:has(.contacts-card):not(.dashboard-home) .page-top {
        display: grid;
        grid-template-columns: 1fr;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .list-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
        overflow: visible;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .search-input {
        flex: 1 1 320px;
        width: auto;
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .dashboard:has(.contacts-card):not(.dashboard-home) .dash-main {
        padding: 24px 16px;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .page-top h1,
    .dashboard:has(.contacts-card):not(.dashboard-home) .page-top p {
        white-space: normal;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .list-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .search-input,
    .dashboard:has(.contacts-card):not(.dashboard-home) .ghost-action,
    .dashboard:has(.contacts-card):not(.dashboard-home) .primary-action {
        width: 100%;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .contacts-card {
        height: min(calc(100svh - 180px), 620px);
        min-height: 320px;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .contacts-table {
        min-width: 760px;
        height: 100%;
    }

    .dashboard:has(.contacts-card):not(.dashboard-home) .contacts-footer {
        align-items: flex-start;
        gap: 12px;
    }
}

/* Sidebar unificada: todas as telas autenticadas usam o mesmo padrão do Dashboard. */
:root[data-theme="dark"] .dashboard,
:root[data-theme="dark"] .dashboard:not(.dashboard-home),
:root[data-theme="dark"] .dashboard-home {
    --home-sidebar-bg: linear-gradient(180deg, #07101f 0%, #070d18 100%);
    --home-sidebar-bottom-bg: #070d18;
    --home-inner-bg: rgba(15, 23, 42, .56);
    --home-icon-bg: rgba(15, 23, 42, .9);
    --home-nav-text: #8f9db2;
    --home-nav-active-bg: #3B608F;
    --figma-icon-primary: #f8fafc;
    --figma-icon-secondary: #cbd5e1;
    --figma-icon-muted: #94a3b8;
    --figma-icon-accent: #38b6ff;
}

:root[data-theme="light"] .dashboard,
:root[data-theme="light"] .dashboard:not(.dashboard-home),
:root[data-theme="light"] .dashboard-home {
    --home-sidebar-bg: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    --home-sidebar-bottom-bg: #ffffff;
    --home-inner-bg: #f8fafc;
    --home-icon-bg: #f1f8ff;
    --home-nav-text: #64748b;
    --home-nav-active-bg: #3B608F;
    --figma-icon-primary: #0f172a;
    --figma-icon-secondary: #475569;
    --figma-icon-muted: #64748b;
    --figma-icon-accent: #0284c7;
}

.dashboard .sidebar,
.dashboard:not(.dashboard-home) .sidebar,
.dashboard-home .sidebar {
    gap: 14px;
    padding: 24px 18px max(12px, env(safe-area-inset-bottom));
    border-right-color: var(--line);
    background: var(--home-sidebar-bg);
}

.dashboard .logo-sidebar,
.dashboard:not(.dashboard-home) .logo-sidebar,
.dashboard-home .logo-sidebar {
    width: 194px;
    max-height: 46px;
}

:root[data-theme="dark"] .dashboard .logo-sidebar-dark,
:root[data-theme="dark"] .dashboard:not(.dashboard-home) .logo-sidebar-dark,
:root[data-theme="dark"] .dashboard-home .logo-sidebar-dark {
    display: block;
}

:root[data-theme="dark"] .dashboard .logo-sidebar-light,
:root[data-theme="dark"] .dashboard:not(.dashboard-home) .logo-sidebar-light,
:root[data-theme="dark"] .dashboard-home .logo-sidebar-light {
    display: none;
}

:root[data-theme="light"] .dashboard .logo-sidebar-dark,
:root[data-theme="light"] .dashboard:not(.dashboard-home) .logo-sidebar-dark,
:root[data-theme="light"] .dashboard-home .logo-sidebar-dark {
    display: none;
}

:root[data-theme="light"] .dashboard .logo-sidebar-light,
:root[data-theme="light"] .dashboard:not(.dashboard-home) .logo-sidebar-light,
:root[data-theme="light"] .dashboard-home .logo-sidebar-light {
    display: block;
}

.dashboard .sidebar-bottom,
.dashboard:not(.dashboard-home) .sidebar-bottom,
.dashboard-home .sidebar-bottom {
    background: var(--home-sidebar-bottom-bg);
}

.dashboard .side-nav,
.dashboard:not(.dashboard-home) .side-nav,
.dashboard-home .side-nav {
    gap: 7px;
}

.dashboard .menu-title,
.dashboard:not(.dashboard-home) .menu-title,
.dashboard-home .menu-title {
    margin: 13px 10px 5px;
    color: color-mix(in srgb, var(--muted) 78%, transparent);
    font-family: "Inter";
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
}

.dashboard .nav-button,
.dashboard:not(.dashboard-home) .nav-button,
.dashboard-home .nav-button {
    min-height: 40px;
    border-radius: 10px;
    color: var(--home-nav-text);
    font-family: "Inter";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
}

.dashboard .submenu button,
.dashboard .submenu a,
.dashboard:not(.dashboard-home) .submenu button,
.dashboard:not(.dashboard-home) .submenu a,
.dashboard-home .submenu button,
.dashboard-home .submenu a {
    min-height: 31px;
    color: var(--muted);
    font-family: "Inter";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
}

.dashboard .submenu-group-title,
.dashboard:not(.dashboard-home) .submenu-group-title,
.dashboard-home .submenu-group-title {
    font-family: "Inter";
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
}

.dashboard .submenu button:hover,
.dashboard .submenu button:focus-visible,
.dashboard .submenu button.is-active,
.dashboard .submenu a:hover,
.dashboard .submenu a:focus-visible,
.dashboard .submenu a.is-active,
.dashboard:not(.dashboard-home) .submenu button:hover,
.dashboard:not(.dashboard-home) .submenu button:focus-visible,
.dashboard:not(.dashboard-home) .submenu button.is-active,
.dashboard:not(.dashboard-home) .submenu a:hover,
.dashboard:not(.dashboard-home) .submenu a:focus-visible,
.dashboard:not(.dashboard-home) .submenu a.is-active,
.dashboard-home .submenu button:hover,
.dashboard-home .submenu button:focus-visible,
.dashboard-home .submenu button.is-active,
.dashboard-home .submenu a:hover,
.dashboard-home .submenu a:focus-visible,
.dashboard-home .submenu a.is-active {
    color: #FFFFFF;
    background: var(--home-nav-active-bg);
}

.dashboard .nav-button:hover,
.dashboard .nav-button:focus-visible,
.dashboard:not(.dashboard-home) .nav-button:hover,
.dashboard:not(.dashboard-home) .nav-button:focus-visible,
.dashboard-home .nav-button:hover,
.dashboard-home .nav-button:focus-visible {
    color: var(--text-strong);
    background: color-mix(in srgb, var(--home-nav-active-bg) 22%, transparent);
}

.dashboard .nav-button.is-active,
.dashboard .menu-group.is-open > .nav-button,
.dashboard:not(.dashboard-home) .nav-button.is-active,
.dashboard:not(.dashboard-home) .menu-group.is-open > .nav-button,
.dashboard-home .nav-button.is-active,
.dashboard-home .menu-group.is-open > .nav-button {
    color: #FFFFFF;
    background: var(--home-nav-active-bg);
}

.dashboard .figma-icon--sidebar,
.dashboard:not(.dashboard-home) .figma-icon--sidebar,
.dashboard-home .figma-icon--sidebar {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    color: var(--figma-icon-secondary);
}

.dashboard .nav-button:hover .figma-icon--sidebar,
.dashboard .nav-button:focus-visible .figma-icon--sidebar,
.dashboard:not(.dashboard-home) .nav-button:hover .figma-icon--sidebar,
.dashboard:not(.dashboard-home) .nav-button:focus-visible .figma-icon--sidebar,
.dashboard-home .nav-button:hover .figma-icon--sidebar,
.dashboard-home .nav-button:focus-visible .figma-icon--sidebar {
    color: var(--figma-icon-primary);
}

.dashboard .nav-button.is-active .figma-icon--sidebar,
.dashboard .menu-group.is-open > .nav-button .figma-icon--sidebar,
.dashboard:not(.dashboard-home) .nav-button.is-active .figma-icon--sidebar,
.dashboard:not(.dashboard-home) .menu-group.is-open > .nav-button .figma-icon--sidebar,
.dashboard-home .nav-button.is-active .figma-icon--sidebar,
.dashboard-home .menu-group.is-open > .nav-button .figma-icon--sidebar {
    color: #FFFFFF;
}

.dashboard .nav-button .chev,
.dashboard:not(.dashboard-home) .nav-button .chev,
.dashboard-home .nav-button .chev {
    width: 16px;
    height: 16px;
    display: grid;
    place-items: center;
    font-size: 0;
    transform: none;
}

.dashboard .nav-button .figma-icon--chevron,
.dashboard:not(.dashboard-home) .nav-button .figma-icon--chevron,
.dashboard-home .nav-button .figma-icon--chevron {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px;
    color: var(--figma-icon-muted);
    transition: transform .16s ease, color .16s ease;
}

.dashboard .menu-group.is-open .chev,
.dashboard:not(.dashboard-home) .menu-group.is-open .chev,
.dashboard-home .menu-group.is-open .chev {
    transform: none;
}

.dashboard .menu-group.is-open > .nav-button .figma-icon--chevron,
.dashboard:not(.dashboard-home) .menu-group.is-open > .nav-button .figma-icon--chevron,
.dashboard-home .menu-group.is-open > .nav-button .figma-icon--chevron {
    color: #FFFFFF;
    transform: rotate(90deg);
}

.dashboard .cert-mini,
.dashboard:not(.dashboard-home) .cert-mini,
.dashboard-home .cert-mini {
    margin: 0 18px 10px;
    padding: 9px 10px;
    border-color: var(--line-soft);
    border-radius: 12px;
    background: var(--home-inner-bg);
    box-shadow: none;
}

.dashboard .cert-mini .shield,
.dashboard:not(.dashboard-home) .cert-mini .shield,
.dashboard-home .cert-mini .shield {
    color: var(--figma-icon-accent);
    background: var(--home-icon-bg);
}

.dashboard .user-strip,
.dashboard:not(.dashboard-home) .user-strip,
.dashboard-home .user-strip {
    min-height: 54px;
    padding: 10px 18px;
    border-top-color: var(--line);
}

@media (max-width: 1100px) {
    .dashboard .logo-sidebar,
    .dashboard:not(.dashboard-home) .logo-sidebar,
    .dashboard-home .logo-sidebar {
        width: 184px;
        max-height: 44px;
    }
}

@media (max-width: 768px) {
    .dashboard .sidebar,
    .dashboard:not(.dashboard-home) .sidebar,
    .dashboard-home .sidebar {
        padding: 16px;
        border-right: 0;
    }

    .dashboard .logo-sidebar,
    .dashboard:not(.dashboard-home) .logo-sidebar,
    .dashboard-home .logo-sidebar {
        width: 142px;
        max-height: 38px;
    }

    .dashboard .nav-button,
    .dashboard:not(.dashboard-home) .nav-button,
    .dashboard-home .nav-button {
        width: auto;
        min-width: 48px;
        min-height: 44px;
        padding: 0 14px;
        white-space: nowrap;
    }
}
.json-preview {
    min-height: 360px;
    max-height: 560px;
    overflow: auto;
    margin: 0;
    padding: 16px;
    border-radius: 10px;
    border: 1px solid var(--border, #d8dee9);
    background: #071637;
    color: #e8f1ff;
    font: 13px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    white-space: pre-wrap;
}
@media (max-width: 980px) {
    .ciot-table .contacts-head,
    .ciot-table .contacts-row { grid-template-columns: minmax(180px, 1fr) 92px 86px 42px; }
    .ciot-table .contacts-head span:nth-child(2),
    .ciot-table .contacts-row > span:nth-child(2),
    .ciot-table .contacts-head span:nth-child(3),
    .ciot-table .contacts-row > strong:nth-child(3),
    .ciot-table .contacts-head span:nth-child(6),
    .ciot-table .contacts-row > span:nth-child(6) { display: none; }
    .cte-table .contacts-head,
    .cte-table .contacts-row { grid-template-columns: 82px minmax(150px, 1fr) 96px 48px; }
    .cte-table .contacts-head span:nth-child(1),
    .cte-table .contacts-row > .cte-select-cell,
    .cte-table .contacts-head span:nth-child(3),
    .cte-table .contacts-row > strong:nth-child(3),
    .cte-table .contacts-head span:nth-child(4),
    .cte-table .contacts-row > span:nth-child(4),
    .cte-table .contacts-head span:nth-child(6),
    .cte-table .contacts-row > span:nth-child(6),
    .cte-table .contacts-head span:nth-child(7),
    .cte-table .contacts-row > strong:nth-child(7),
    .cte-table .contacts-head span:nth-child(9),
    .cte-table .contacts-row > .cte-insurance-icon { display: none; }
    .mdfe-table .contacts-head,
    .mdfe-table .contacts-row { grid-template-columns: 38px 82px 70px minmax(92px, 1fr) 96px 48px; }
    .mdfe-table .contacts-head span:nth-child(4),
    .mdfe-table .contacts-row > span:nth-child(4),
    .mdfe-table .contacts-head span:nth-child(6),
    .mdfe-table .contacts-row > strong:nth-child(6),
    .mdfe-table .contacts-head span:nth-child(7),
    .mdfe-table .contacts-row > span:nth-child(7),
    .mdfe-table .contacts-head span:nth-child(8),
    .mdfe-table .contacts-row > span:nth-child(8),
    .mdfe-table .contacts-head span:nth-child(10),
    .mdfe-table .contacts-row > .mdfe-insurance-icon { display: none; }
    .trips-table .contacts-head,
    .trips-table .contacts-row { grid-template-columns: minmax(180px, 1fr) minmax(170px, 1fr) 96px 126px; }
    .trips-table .contacts-head span:nth-child(3),
    .trips-table .contacts-row > div:nth-child(3),
    .trips-table .contacts-head span:nth-child(4),
    .trips-table .contacts-row > span:nth-child(4) { display: none; }
    .drivers-table .contacts-head,
    .drivers-table .contacts-row { grid-template-columns: minmax(180px, 1fr) minmax(150px, 1fr) 96px 86px; }
    .drivers-table .contacts-head span:nth-child(2),
    .drivers-table .contacts-row > div:nth-child(2),
    .drivers-table .contacts-head span:nth-child(4),
    .drivers-table .contacts-row > span:nth-child(4) { display: none; }
    .vehicles-table .contacts-head,
    .vehicles-table .contacts-row { grid-template-columns: minmax(180px, 1fr) minmax(130px, .75fr) 110px 86px; }
    .vehicles-table .contacts-head span:nth-child(3),
    .vehicles-table .contacts-row > span:nth-child(3),
    .vehicles-table .contacts-head span:nth-child(4),
    .vehicles-table .contacts-row > div:nth-child(4) { display: none; }
    .routes-table .contacts-head,
    .routes-table .contacts-row { grid-template-columns: minmax(180px, 1fr) minmax(170px, 1fr) 96px 86px; }
    .routes-table .contacts-head span:nth-child(3),
    .routes-table .contacts-row > span:nth-child(3),
    .routes-table .contacts-head span:nth-child(4),
    .routes-table .contacts-row > div:nth-child(4) { display: none; }
    .ciot-preview-layout { grid-template-columns: 1fr; }
}
.ciot-json-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(7, 22, 55, .58);
}

.vpo-trips-table .contacts-head,
.vpo-trips-table .contacts-row {
    grid-template-columns: minmax(150px, 1fr) minmax(165px, 1fr) minmax(140px, .75fr) minmax(190px, 1.1fr) minmax(112px, .55fr) 64px;
}

.vpo-trips-table .contacts-row > strong:nth-child(4) {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.25;
    font-size: 12px;
}

.vpo-trips-table .contacts-row > .status-pill {
    justify-self: start;
    max-width: 100%;
    white-space: normal;
    text-align: center;
    line-height: 1.15;
}

.vpo-modal .payments-modal-card {
    width: min(940px, 96vw);
    max-height: 92vh;
    overflow: auto;
}

.vpo-result {
    display: grid;
    gap: 12px;
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid rgba(100, 116, 139, .22);
    border-radius: 8px;
    background: rgba(248, 250, 252, .72);
}

.vpo-result h3 {
    margin: 0;
    font-size: 16px;
}

.vpo-result p {
    margin: 0;
    color: #647084;
}

.vpo-result details {
    border-top: 1px solid rgba(100, 116, 139, .22);
    padding-top: 10px;
}

.vpo-result pre {
    max-height: 260px;
    overflow: auto;
    margin: 10px 0 0;
    padding: 12px;
    border-radius: 8px;
    background: #111827;
    color: #e5e7eb;
    font-size: 12px;
}

.vpo-mini-table {
    display: grid;
    gap: 6px;
    overflow-x: auto;
}

.vpo-mini-table > div {
    display: grid;
    grid-template-columns: 120px minmax(180px, 1fr) 110px 90px 100px 100px;
    gap: 10px;
    min-width: 700px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid rgba(100, 116, 139, .16);
    font-size: 13px;
}

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

.vpo-summary-grid span {
    display: grid;
    gap: 4px;
    padding: 10px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid rgba(100, 116, 139, .18);
}

.vpo-summary-grid small {
    color: #647084;
    font-size: 12px;
}

.vpo-summary-grid strong {
    overflow-wrap: anywhere;
}

@media (max-width: 980px) {
    .vpo-trips-table .contacts-head,
    .vpo-trips-table .contacts-row {
        grid-template-columns: minmax(190px, 1fr) minmax(160px, 1fr) 104px 64px;
    }
    .vpo-trips-table .contacts-head span:nth-child(3),
    .vpo-trips-table .contacts-row > div:nth-child(3),
    .vpo-trips-table .contacts-head span:nth-child(4),
    .vpo-trips-table .contacts-row > strong:nth-child(4) {
        display: none;
    }
    .vpo-summary-grid {
        grid-template-columns: 1fr 1fr;
    }
}
.ciot-json-modal.is-open { display: flex; }
.ciot-json-dialog {
    width: min(1040px, 94vw);
    max-height: 90vh;
    display: grid;
    grid-template-rows: auto minmax(260px, 1fr) auto;
    gap: 14px;
    padding: 20px;
    border-radius: 14px;
    background: var(--surface, #fff);
    box-shadow: 0 24px 80px rgba(7, 22, 55, .28);
}
.ciot-json-header,
.ciot-json-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.ciot-json-header h2,
.ciot-json-header p { margin: 0; }
.ciot-json-modal-preview {
    max-height: 62vh;
    min-height: 320px;
}
.ciot-json-footer form { margin: 0; }
.ciot-cancel-dialog,
.ciot-pix-dialog {
    width: min(680px, 94vw);
    grid-template-rows: auto auto auto;
}
.ciot-cancel-form,
.ciot-pix-body {
    display: grid;
    gap: 14px;
}
.ciot-pix-body {
    justify-items: center;
}
.ciot-pix-qr {
    width: min(240px, 68vw);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    object-fit: contain;
    padding: 10px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 8px;
    background: #fff;
    color: var(--muted, #64748b);
    font-weight: 800;
    text-align: center;
}
.ciot-pix-qr canvas,
.ciot-pix-qr img,
.ciot-pix-qr svg {
    width: 220px !important;
    height: 220px !important;
    max-width: 100%;
    max-height: 100%;
}
.ciot-pix-info {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.ciot-pix-info span {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 8px;
    background: var(--muted-surface, #f7f9fc);
}
.ciot-pix-info small {
    color: var(--muted, #64748b);
    font-weight: 700;
}
.danger-action {
    min-height: 42px;
    border: 0;
    border-radius: 8px;
    padding: 0 16px;
    color: #fff;
    background: #b42318;
    font-weight: 800;
    cursor: pointer;
}
.danger-action:hover { background: #912018; }
.status-cancelado,
.status-pix-cancelado {
    background: #fee4e2;
    color: #b42318;
    border-color: #fda29b;
}
.status-pix-nao_gerado {
    background: #f2f4f7;
    color: #667085;
    border-color: #d0d5dd;
}
.status-pix-pendente {
    background: #fff6db;
    color: #92400e;
    border-color: #facc15;
}
.status-pix-pago {
    background: #dcfae6;
    color: #067647;
    border-color: #75e0a7;
}
.status-pix-erro {
    background: #fee4e2;
    color: #b42318;
    border-color: #fda29b;
}
.ciot-pix-copy-link {
    border: 0;
    background: transparent;
    color: var(--primary, #416a9d);
    font-weight: 800;
    text-decoration: underline;
    cursor: pointer;
}
.ciot-pix-copy-link:hover {
    color: #264f83;
}
@media (max-width: 720px) {
    .ciot-json-dialog { width: 96vw; padding: 14px; }
    .ciot-json-header,
    .ciot-json-footer { align-items: stretch; flex-direction: column; }
    .ciot-pix-info { grid-template-columns: 1fr; }
}

.ciot-table .contacts-head,
.ciot-table .contacts-row {
    display: grid !important;
    grid-template-columns: minmax(138px, 1.35fr) minmax(54px, .45fr) minmax(92px, .7fr) minmax(72px, .55fr) minmax(66px, .48fr) minmax(84px, .62fr) 38px !important;
    gap: 8px !important;
    padding-left: 16px;
    padding-right: 14px;
}
.ciot-table .contacts-head {
    min-height: 46px;
    font-size: 11px;
}
.ciot-table .contacts-row {
    min-height: 76px;
}
.ciot-table .contacts-row > div:first-child strong,
.ciot-table .contacts-row > div:first-child small,
.ciot-table .contacts-row > span,
.ciot-table .contacts-row > strong {
    overflow: hidden;
    text-overflow: ellipsis;
}
.ciot-table .contacts-row > span,
.ciot-table .contacts-row > strong {
    white-space: nowrap;
}
.ciot-table .contacts-head span:last-child,
.ciot-table .contacts-row .action-cell {
    justify-self: center;
}

/* Importação Bubble */
.bubble-import-page .page-top {
    align-items: flex-start;
}

.bubble-import-card {
    display: grid;
    gap: 22px;
    padding: 24px;
}

.bubble-import-section {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.bubble-download-form,
.bubble-upload-form,
.bubble-import-actions {
    display: grid;
    gap: 12px;
    align-items: end;
}

.bubble-download-form {
    grid-template-columns: minmax(260px, 1fr) auto;
}

.bubble-upload-form {
    grid-template-columns: minmax(240px, 420px) auto;
    align-items: end;
}

.bubble-download-form label,
.bubble-upload-form label,
.bubble-import-actions label {
    min-width: 0;
    margin: 0;
}

.bubble-download-form input,
.bubble-upload-form input,
.bubble-import-actions select {
    width: 100%;
}

.bubble-import-card .stats-grid {
    margin: 0;
}

.bubble-import-card .stat-card {
    min-height: 128px;
    overflow: hidden;
}

.bubble-import-card .stat-card span {
    overflow-wrap: anywhere;
}

.bubble-import-actions {
    grid-template-columns: minmax(190px, 240px) auto auto auto;
    justify-content: end;
    border-top: 2px solid var(--accent, #426aa1);
    padding-top: 18px;
}

.import-inline-alert,
.page-alert.is-info.import-inline-alert {
    position: static;
    max-width: none;
    padding: 12px 14px;
    border-color: rgba(66, 106, 161, .28);
    color: var(--muted-strong, #64748b);
    background: var(--surface-muted, #f3f6fb);
    box-shadow: none;
    animation: none;
    backdrop-filter: none;
}

@media (max-width: 1020px) {
    .bubble-download-form,
    .bubble-upload-form,
    .bubble-import-actions {
        grid-template-columns: 1fr;
        justify-content: stretch;
    }

    .bubble-download-form .primary-action,
    .bubble-upload-form .secondary-action,
    .bubble-import-actions .primary-action,
    .bubble-import-actions .secondary-action {
        width: 100%;
    }
}

.app-loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 36%, rgba(37, 99, 235, .16), transparent 34%),
        rgba(15, 23, 42, .62);
    opacity: 0;
    pointer-events: none;
    backdrop-filter: blur(8px);
    transition: opacity .36s ease;
}

.app-loading-overlay.is-open {
    opacity: 1;
    pointer-events: auto;
}

.app-loading-card {
    width: min(360px, calc(100vw - 36px));
    min-height: 310px;
    position: relative;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 14px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 14px;
    padding: 32px 28px 26px;
    color: var(--text-strong);
    background: color-mix(in srgb, var(--panel) 92%, transparent);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .34);
}

.app-loading-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,.16), transparent 36%, rgba(37,99,235,.08));
    pointer-events: none;
}

.app-loading-orbit {
    width: 156px;
    height: 156px;
    position: absolute;
    top: 35px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, .18);
    animation: appLoadingSpin 4.8s linear infinite;
}

.app-loading-orbit span {
    width: 10px;
    height: 10px;
    position: absolute;
    border-radius: 999px;
    background: var(--brand);
    box-shadow: 0 0 22px rgba(37, 99, 235, .55);
}

.app-loading-orbit span:nth-child(1) { top: -5px; left: 72px; }
.app-loading-orbit span:nth-child(2) { right: 14px; bottom: 18px; opacity: .74; }
.app-loading-orbit span:nth-child(3) { left: 14px; bottom: 18px; opacity: .48; }

.app-loading-emblem {
    width: 112px;
    height: 112px;
    position: relative;
    display: grid;
    place-items: center;
    border: 1px solid rgba(148, 163, 184, .24);
    border-radius: 50%;
    background: linear-gradient(180deg, var(--panel), var(--panel-soft));
    box-shadow: inset 0 0 0 8px rgba(148, 163, 184, .08), 0 18px 46px rgba(15, 23, 42, .18);
}

.app-loading-logo {
    position: absolute;
    width: 82px;
    height: 82px;
    object-fit: contain;
    animation: appLoadingFadeA 4s ease-in-out infinite;
}

.app-loading-logo-light {
    animation-name: appLoadingFadeB;
}

.sr-only {
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.app-loading-card strong {
    position: relative;
    margin-top: 10px;
    font-size: 18px;
    font-weight: 950;
}

.app-loading-card p {
    position: relative;
    max-width: 280px;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.45;
    text-align: center;
}

.app-loading-progress {
    width: 210px;
    height: 5px;
    position: relative;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, .18);
}

.app-loading-progress span {
    width: 42%;
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent, var(--brand), transparent);
    animation: appLoadingSweep 2s ease-in-out infinite;
}

@keyframes appLoadingSpin {
    to { transform: rotate(360deg); }
}

@keyframes appLoadingFadeA {
    0%, 38% { opacity: 1; transform: scale(1); }
    50%, 88% { opacity: 0; transform: scale(.94); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes appLoadingFadeB {
    0%, 38% { opacity: 0; transform: scale(.94); }
    50%, 88% { opacity: 1; transform: scale(1); }
    100% { opacity: 0; transform: scale(.94); }
}

@keyframes appLoadingSweep {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(240%); }
}

.mdfe-doc-source-panel {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto;
    gap: 14px;
    align-items: end;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel-soft);
}

.mdfe-xml-uploader {
    margin: 0;
}

.mdfe-doc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.mdfe-uploaded-xml-list {
    grid-column: 1 / -1;
    display: grid;
    gap: 8px;
}

.mdfe-uploaded-xml-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 320px);
    gap: 10px;
    align-items: center;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
}

.mdfe-uploaded-xml-row span {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
}

.mdfe-uploaded-xml-row input {
    width: 100%;
}

.mdfe-doc-summary {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.mdfe-doc-summary span,
.mdfe-doc-chips span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
}

.mdfe-doc-chips {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 32px;
}

.mdfe-doc-chips small {
    color: var(--muted);
    font-weight: 750;
}

.mdfe-doc-modal {
    display: none;
}

.mdfe-doc-modal.is-open {
    display: flex;
}

.mdfe-doc-modal-card {
    width: min(920px, calc(100vw - 32px));
    max-height: min(760px, calc(100vh - 40px));
}

.mdfe-doc-modal-list {
    display: grid;
    gap: 8px;
    max-height: min(480px, 54vh);
    overflow: auto;
    padding: 2px 2px 8px;
}

.mdfe-doc-option {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0;
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    cursor: pointer;
}

.mdfe-doc-option:hover {
    border-color: rgba(66, 133, 244, .42);
    background: var(--panel-strong);
}

.mdfe-doc-option input {
    width: 16px;
    height: 16px;
    margin-top: 2px;
}

.mdfe-doc-option span {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.mdfe-doc-option strong {
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 900;
}

.mdfe-doc-option small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.mdfe-doc-option.is-disabled {
    opacity: .58;
    cursor: not-allowed;
}

@media (max-width: 760px) {
    .mdfe-doc-source-panel {
        grid-template-columns: 1fr;
    }

    .mdfe-doc-actions {
        justify-content: stretch;
    }

    .mdfe-doc-actions .secondary-action {
        width: 100%;
    }

    .mdfe-uploaded-xml-row {
        grid-template-columns: 1fr;
    }
}

.mdfe-pick-option {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    text-align: left;
    font: inherit;
}

.mdfe-pick-option:focus-visible {
    outline: 3px solid rgba(52, 165, 255, .28);
    outline-offset: 2px;
}

.mdfe-fiscal-actions {
    justify-content: flex-start;
}

.money-input {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.logs-dashboard {
    position: relative;
    display: block;
    min-height: 100svh;
    overflow: hidden;
}

.logs-dashboard .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 920;
    width: min(294px, 88vw);
    height: 100svh;
    transform: translateX(-104%);
    transition: transform .22s ease;
    box-shadow: 18px 0 42px rgba(15, 23, 42, .22);
}

.logs-dashboard.is-menu-open .sidebar {
    transform: translateX(0);
}

.logs-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 900;
    display: block;
    border: 0;
    background: rgba(15, 23, 42, .42);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
}

.logs-dashboard.is-menu-open .logs-menu-backdrop {
    opacity: 1;
    pointer-events: auto;
}

body.logs-menu-open {
    overflow: hidden;
}

.logs-main {
    width: 100%;
    min-width: 0;
    min-height: 100svh;
    padding: 18px 22px;
}

.logs-topbar {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}

.logs-title {
    flex: 1 1 auto;
    min-width: 0;
}

.logs-topbar h1 {
    margin: 0;
    color: var(--text-strong);
    font-size: 25px;
    line-height: 1.1;
}

.logs-topbar p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.logs-topbar-actions {
    flex: 0 1 auto;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    min-width: 0;
}

.logs-retention-status {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.logs-retention-status.is-active {
    border-color: color-mix(in srgb, var(--success) 36%, var(--line));
    background: color-mix(in srgb, var(--success) 10%, var(--panel));
    color: var(--success);
}

.logs-menu-button {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel);
    color: var(--brand);
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
    cursor: pointer;
}

.logs-menu-button:hover {
    border-color: rgba(65, 106, 157, .38);
    background: var(--panel-strong);
}

.logs-menu-button svg {
    width: 22px;
    height: 22px;
}

.logs-filters {
    display: grid;
    grid-template-columns: 190px 190px auto auto auto;
    align-items: end;
    gap: 10px;
    margin: 0;
}

.logs-filters label {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.logs-filters span {
    color: var(--text-strong);
    font-size: 11px;
    font-weight: 900;
}

.logs-filters input,
.logs-filters select {
    width: 100%;
    min-width: 0;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--input);
    color: var(--text);
    padding: 0 12px;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
}

.logs-filters .primary-action,
.logs-filters .secondary-action {
    height: 42px;
    min-height: 42px;
    padding: 0 16px;
}

.logs-advanced-filters {
    grid-column: auto;
    min-width: 0;
    position: relative;
    align-self: end;
    height: 42px;
}

.logs-advanced-filters summary {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 14px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--panel-soft);
    color: var(--brand);
    cursor: pointer;
    font-size: 13px;
    font-weight: 900;
    list-style: none;
}

.logs-advanced-filters summary::-webkit-details-marker {
    display: none;
}

.logs-advanced-filters summary::after {
    content: "";
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .18s ease;
}

.logs-advanced-filters[open] summary::after {
    transform: translateY(2px) rotate(225deg);
}

.logs-advanced-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 45;
    width: min(1320px, calc(100vw - 28px));
    max-height: min(560px, calc(100svh - 118px));
    overflow-x: hidden;
    overflow-y: auto;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel);
    box-shadow: 0 22px 48px rgba(15, 23, 42, .18);
}

.logs-advanced-retention {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 10px;
}

.logs-advanced-grid {
    display: grid;
    grid-template-columns: minmax(190px, 1fr) minmax(250px, 1.15fr) minmax(360px, 1.45fr) minmax(180px, .8fr) minmax(220px, .95fr);
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel-soft);
}

.logs-event-filters {
    display: grid;
    grid-template-columns: repeat(6, minmax(175px, 1fr));
    gap: 6px 16px;
    margin: 8px 0 0;
    padding: 10px 12px;
    border: 0;
    border-radius: 10px;
    background: var(--panel);
}

.logs-event-filters label {
    min-height: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 18px;
    align-items: center;
    gap: 8px;
}

.logs-event-filters span {
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

.logs-event-filters input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    margin: 0;
    padding: 0;
    accent-color: var(--brand);
}

.logs-card {
    height: calc(100svh - 120px);
    max-height: none;
}

.logs-table {
    min-width: 1180px;
}

.logs-table .contacts-head,
.logs-table .contacts-row {
    grid-template-columns: 136px minmax(170px, 1.05fr) minmax(180px, 1.1fr) 150px minmax(260px, 1.45fr) 180px 92px;
    gap: 12px;
}

.bubble-logs-table {
    min-width: 1040px;
}

.bubble-logs-table .contacts-head,
.bubble-logs-table .contacts-row {
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 0;
    padding: 0;
}

.bubble-logs-table .contacts-head {
    min-height: 34px;
}

.bubble-logs-table .contacts-head span {
    min-height: 34px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-right: 1px solid var(--line);
}

.bubble-logs-table .contacts-head span:last-child {
    border-right: 0;
}

.logs-table .contacts-scroll {
    max-height: none;
    overflow-x: auto;
}

.log-row {
    min-height: 68px;
}

.bubble-log-row {
    align-items: stretch;
    min-height: 138px;
    border-bottom: 1px solid var(--line);
}

.bubble-log-row > div {
    min-width: 0;
    padding: 9px 12px;
    border-right: 1px solid var(--line);
}

.bubble-log-row > div:last-child {
    border-right: 0;
}

.bubble-log-identity {
    display: grid;
    align-content: start;
    gap: 6px;
}

.bubble-log-identity strong {
    white-space: normal;
    line-height: 1.25;
}

.bubble-log-identity span {
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.bubble-log-message {
    display: grid;
    align-content: start;
    gap: 7px;
}

.bubble-log-message-head {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.bubble-log-message-head strong {
    font-size: 13px;
    white-space: normal;
}

.bubble-log-message p {
    margin: 0;
    color: var(--text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.bubble-log-message p b {
    color: var(--text-strong);
    font-weight: 900;
}

.bubble-log-message pre {
    max-height: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    color: var(--text);
    font: 12px/1.35 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.bubble-log-collapsible {
    margin-top: 5px;
}

.bubble-log-collapsible summary {
    width: fit-content;
    cursor: pointer;
    color: var(--brand);
    font-size: 12px;
    font-weight: 900;
    list-style: none;
}

.bubble-log-collapsible summary::-webkit-details-marker {
    display: none;
}

.bubble-log-collapsible summary::before {
    content: "+";
    display: inline-block;
    margin-right: 6px;
    color: var(--muted);
    font-weight: 950;
}

.bubble-log-collapsible[open] summary::before {
    content: "-";
}

.bubble-log-collapsible pre {
    margin-top: 7px;
    padding: 10px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: var(--panel-soft);
}

.bubble-log-section,
.bubble-log-group {
    display: grid;
    gap: 5px;
    margin-top: 4px;
}

.bubble-log-section > strong,
.bubble-log-group > strong {
    color: var(--text-strong);
    font-size: 12px;
    font-weight: 900;
}

.bubble-log-fields {
    display: grid;
    gap: 3px 18px;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
}

.bubble-log-fields p,
.bubble-log-group-item p {
    margin: 0;
    color: var(--text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.bubble-log-group {
    margin-top: 10px;
}

.bubble-log-group-item {
    display: grid;
    grid-template-columns: repeat(3, minmax(160px, 1fr));
    gap: 3px 16px;
    padding: 8px 10px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel-strong) 54%, transparent);
}

.bubble-log-group-item em {
    grid-column: 1 / -1;
    color: var(--brand);
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
}

.log-row strong,
.log-row small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.log-row strong {
    display: block;
    color: var(--text-strong);
    font-size: 13px;
    font-weight: 900;
    white-space: nowrap;
}

.log-row small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.bubble-log-row strong,
.bubble-log-row small {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

.bubble-log-row .bubble-log-identity span,
.bubble-log-row .bubble-log-message p {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

.log-type {
    width: fit-content;
    min-width: 74px;
    margin-bottom: 5px;
    justify-content: center;
}

.log-type-acao {
    color: #805700;
    border-color: rgba(245, 158, 11, .42);
    background: rgba(245, 158, 11, .13);
}

.log-type-seguranca {
    color: #8b1f1f;
    border-color: rgba(239, 68, 68, .42);
    background: rgba(239, 68, 68, .12);
}

.log-type-erro {
    color: #7f1d1d;
    border-color: rgba(220, 38, 38, .5);
    background: rgba(254, 226, 226, .85);
}

.log-details {
    position: relative;
}

.log-details summary {
    width: 52px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-strong);
    color: var(--brand);
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
    list-style: none;
}

.log-details summary::-webkit-details-marker {
    display: none;
}

.log-details pre {
    position: absolute;
    right: 0;
    z-index: 20;
    width: min(560px, 80vw);
    max-height: 340px;
    margin: 8px 0 0;
    padding: 14px;
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel);
    box-shadow: 0 18px 38px rgba(15, 23, 42, .18);
    color: var(--text);
    font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    white-space: pre-wrap;
}

.logs-access-denied {
    height: min(calc(100svh - 170px), 420px);
}

.logs-retention-open {
    min-height: 40px;
    border-radius: 8px;
    font-weight: 900;
}

.logs-retention-card {
    width: min(740px, calc(100vw - 28px));
    max-height: none;
    overflow: visible;
    padding: 22px;
}

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

.logs-retention-grid article,
.logs-retention-rules,
.logs-retention-last,
.logs-retention-note {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-soft);
}

.logs-retention-grid article {
    padding: 10px 12px;
}

.logs-retention-grid span,
.logs-retention-rules span,
.logs-retention-last span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.logs-retention-grid strong {
    display: block;
    margin-top: 5px;
    color: var(--text);
    font-size: 15px;
    line-height: 1.15;
}

.logs-retention-grid strong.is-success {
    color: var(--success);
}

.logs-retention-grid strong.is-muted {
    color: var(--muted);
}

.logs-retention-rules {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
}

.logs-retention-rules div,
.logs-retention-last,
.logs-retention-note {
    padding: 10px 12px;
}

.logs-retention-rules b,
.logs-retention-last strong,
.logs-retention-note strong {
    display: block;
    margin-bottom: 4px;
    color: var(--text);
}

.logs-retention-last {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin-top: 10px;
}

.logs-retention-last strong {
    flex: 1 0 100%;
}

.logs-retention-note {
    margin-top: 10px;
}

.logs-retention-note code {
    display: block;
    margin-top: 6px;
    padding: 9px;
    overflow: hidden;
    border-radius: 8px;
    background: var(--panel);
    color: var(--text);
    font-size: 12px;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
}

.logs-retention-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.logs-retention-actions form {
    margin: 0;
    min-width: 0;
}

.logs-retention-action-button {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line-soft);
    border-radius: 8px;
    padding: 0 16px;
    background: var(--panel);
    color: var(--text-strong);
    cursor: pointer;
    font: inherit;
    font-size: 14px;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(15, 23, 42, .07);
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.logs-retention-action-button:hover {
    transform: translateY(-1px);
    border-color: rgba(65, 106, 157, .32);
    box-shadow: 0 14px 26px rgba(15, 23, 42, .1);
}

.logs-retention-action-button.is-primary {
    border-color: var(--brand);
    background: var(--brand);
    color: #fff;
}

.logs-retention-action-button.is-toggle {
    border-color: rgba(65, 106, 157, .25);
    background: color-mix(in srgb, var(--brand) 9%, var(--panel));
    color: var(--brand);
}

.logs-retention-action-button.is-close {
    background: var(--panel-soft);
}

.logs-flash {
    margin-bottom: 12px;
}

@media (max-width: 1180px) {
    .logs-topbar {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .logs-topbar-actions {
        width: 100%;
        justify-content: flex-start;
        margin-left: 60px;
    }

    .logs-filters {
        grid-template-columns: 190px 190px auto auto minmax(0, 1fr);
    }

    .logs-advanced-grid {
        grid-template-columns: repeat(3, minmax(220px, 1fr));
    }

    .logs-event-filters {
        grid-template-columns: repeat(3, minmax(220px, 1fr));
    }

    .bubble-log-fields,
    .bubble-log-group-item {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }
}

@media (max-width: 760px) {
    .logs-main {
        padding: 14px 12px;
    }

    .logs-topbar h1 {
        font-size: 23px;
    }

    .logs-topbar p {
        white-space: normal;
    }

    .logs-topbar {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .logs-topbar-actions {
        width: 100%;
        justify-content: space-between;
        margin-left: 0;
    }

    .logs-retention-open {
        width: auto;
        margin-left: 0;
    }

    .logs-filters {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .logs-advanced-filters {
        height: auto;
    }

    .logs-advanced-filters summary {
        width: 100%;
        justify-content: center;
    }

    .logs-advanced-panel {
        position: static;
        width: 100%;
        max-height: none;
        margin-top: 8px;
    }

    .logs-advanced-retention {
        align-items: stretch;
        flex-direction: column;
    }

    .logs-advanced-grid {
        grid-template-columns: 1fr;
    }

    .logs-event-filters {
        grid-template-columns: 1fr;
    }

    .bubble-log-fields,
    .bubble-log-group-item {
        grid-template-columns: 1fr;
    }

    .logs-card {
        height: calc(100svh - 338px);
        min-height: 420px;
    }

    .logs-retention-grid,
    .logs-retention-rules {
        grid-template-columns: 1fr;
    }

    .logs-retention-card {
        padding: 16px;
    }

    .logs-retention-actions,
    .logs-retention-actions form,
    .logs-retention-actions button {
        width: 100%;
    }
}


.database-backup-summary code,
.database-backup-list code {
    font-size: 11px;
    word-break: break-all;
}

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

.database-action-card {
    display: grid;
    align-content: start;
    gap: 12px;
    min-height: 260px;
    padding: 16px;
    border: 1px solid #dfe5ed;
    border-radius: 8px;
    background: #fbfcfe;
}

.database-action-card h3 {
    margin: 0;
    font-size: 16px;
    color: var(--text-strong);
}

.database-action-card p {
    margin: 0;
    color: var(--muted-strong);
    font-size: 13px;
    line-height: 1.45;
}

.database-action-card label {
    display: grid;
    gap: 6px;
    font-size: 12px;
    font-weight: 800;
    color: var(--muted-strong);
}

.database-action-card input,
.database-action-card select {
    width: 100%;
}

.database-action-card.is-danger {
    border-color: #f2c8c8;
    background: #fffafa;
}

.database-backup-list {
    display: grid;
    gap: 0;
    overflow-x: auto;
    border: 1px solid #dfe5ed;
    border-radius: 8px;
}

.database-backup-row {
    grid-template-columns: minmax(240px, 1.3fr) 150px 90px 150px minmax(320px, 1.3fr);
    min-width: 1000px;
}

@media (max-width: 1100px) {
    .database-actions-grid {
        grid-template-columns: 1fr;
    }
}


.button-like.is-disabled {
    opacity: .55;
    pointer-events: none;
    cursor: not-allowed;
}


.database-action-card code {
    display: block;
    padding: 8px;
    border-radius: 6px;
    background: #eef2f7;
    color: #36465c;
    font-size: 11px;
    white-space: normal;
    word-break: break-word;
}

.extensao-row-nome {
    display: flex;
    align-items: center;
    gap: 10px;
}
.extensao-row-nome .store-card-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
}

.extensions-admin-card {
    min-height: 0;
}

.extensions-admin-table {
    height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
}

.extensions-admin-table .contacts-head,
.extensions-admin-table .contacts-row {
    grid-template-columns: minmax(280px, 1.45fr) minmax(150px, .8fr) minmax(110px, .6fr) minmax(120px, .7fr) minmax(120px, .7fr) 72px;
}

.extensions-admin-table .contacts-scroll {
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow-x: auto;
    overflow-y: auto;
}

.extensions-admin-table .extensao-row-nome > div {
    min-width: 0;
}

.extensions-admin-table .extensao-row-nome strong,
.extensions-admin-table .extensao-row-nome small {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.extensions-admin-table .extensao-row-nome strong {
    white-space: nowrap;
}

.extensions-admin-table .extensao-row-nome small {
    white-space: normal;
}

/* Mensalidades (admin) */
.mensalidades-table .contacts-head,
.mensalidades-table .contacts-row {
    grid-template-columns: 2fr 1fr .9fr 1.1fr .8fr;
}
.inline-actions {
    display: inline-flex;
    margin-right: 8px;
}
.inline-actions:last-child {
    margin-right: 0;
}

/* Aviso de mensalidade pendente/vencida */
.mensalidade-aviso-banner {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 70;
    display: flex;
    align-items: center;
    gap: 14px;
    max-width: min(460px, calc(100vw - 32px));
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--app-blue);
    background: var(--panel);
    color: var(--text-strong);
    box-shadow: 0 18px 48px var(--shadow);
}
.mensalidade-aviso-banner[hidden] {
    display: none;
}
.mensalidade-aviso-banner.is-vencida {
    border-color: var(--app-red);
    border-left-color: var(--app-red);
    background: var(--app-red);
    color: #fff;
}
.mensalidade-aviso-texto {
    flex: 1 1 auto;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4;
}
.mensalidade-aviso-pagar {
    flex: 0 0 auto;
    height: 34px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: var(--app-blue);
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}
.mensalidade-aviso-banner.is-vencida .mensalidade-aviso-pagar {
    background: #fff;
    color: var(--app-red);
}
.mensalidade-aviso-fechar {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}
.mensalidade-aviso-pill {
    position: fixed;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 70;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--panel);
    color: var(--text-strong);
    font-size: 12.5px;
    font-weight: 800;
    box-shadow: 0 12px 30px var(--shadow);
    cursor: pointer;
}
.mensalidade-aviso-pill[hidden] {
    display: none;
}
.mensalidade-aviso-pill.is-vencida {
    border-color: var(--app-red);
    background: var(--app-red);
    color: #fff;
}
.mensalidade-aviso-pill-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--app-blue);
    flex: 0 0 auto;
}
.mensalidade-aviso-pill.is-vencida .mensalidade-aviso-pill-dot {
    background: #fff;
}
.mensalidade-modal-card {
    display: grid;
    gap: 16px;
}
.mensalidade-modal-qr {
    width: 132px;
    height: 132px;
    margin: 0 auto;
    border-radius: 8px;
    overflow: hidden;
}

/* Loja de Extensões */
.store-page {
    --store-surface: var(--list-surface, var(--panel));
    --store-surface-soft: var(--list-surface-soft, var(--panel-soft));
    --store-border: var(--list-border, var(--line-soft));
    --store-text: var(--list-text-primary, var(--text-strong));
    --store-muted: var(--list-text-secondary, var(--muted));
    --store-accent: #3B608F;
}

.store-search-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 16px 0 12px;
}
.store-search-row .search-input {
    width: clamp(280px, 32vw, 440px);
    max-width: 100%;
    border-color: var(--store-border);
    border-radius: 8px;
    color: var(--store-muted);
    background: var(--store-surface);
    box-shadow: none;
}
.store-search-row .search-input input {
    color: var(--store-text);
    font-family: "Poppins";
    font-size: 13px;
    font-weight: 500;
}
.store-search-row .search-input input::placeholder {
    color: var(--store-muted);
}
.store-category-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}
.store-chip {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid var(--store-border);
    background: var(--store-surface);
    color: var(--store-muted);
    font-family: "Inter";
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
}
.store-chip:hover,
.store-chip:focus-visible {
    border-color: color-mix(in srgb, var(--store-accent) 42%, var(--store-border));
    background: var(--store-surface-soft);
    color: var(--store-text);
    outline: 0;
    text-decoration: none;
}
.store-chip.is-active {
    background: var(--store-accent);
    border-color: var(--store-accent);
    color: #fff;
}
.store-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 16px;
}
.store-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 258px;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid var(--store-border);
    background: var(--store-surface);
    box-shadow: none;
}
.store-card-icon {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--store-accent) 18%, var(--store-border));
    background: color-mix(in srgb, var(--store-accent) 12%, var(--store-surface));
    color: var(--store-accent);
    overflow: hidden;
}
.store-card-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.store-card-icon svg {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.store-card-name {
    color: var(--store-text);
    font-family: "Inter";
    font-size: 15px;
    font-weight: 600;
    line-height: 1.28;
    letter-spacing: 0;
}
.store-card-desc {
    color: var(--store-muted);
    font-family: "Poppins";
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.4;
    flex: 1;
}
.store-card-footer {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin-top: 4px;
}
.store-card-price {
    color: var(--store-text);
    font-family: "Inter";
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
}
.store-card-footer form {
    margin: 0;
    display: block;
}
.store-card-footer .primary-action,
.store-card-footer .secondary-action {
    width: 100%;
    min-height: 40px;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 8px;
    padding: 0 12px;
    font-family: "Inter";
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.store-card-footer .primary-action {
    border-color: var(--store-accent);
    color: #fff;
    background: var(--store-accent);
    box-shadow: 0 10px 22px rgba(59, 96, 143, .18);
}
.store-card-footer .primary-action:hover,
.store-card-footer .primary-action:focus-visible {
    border-color: #34567f;
    background: #34567f;
    outline: 0;
}
.store-card-footer .secondary-action {
    border-color: var(--store-border);
    color: var(--store-text);
    background: var(--store-surface-soft);
}
.store-card-footer .secondary-action:hover,
.store-card-footer .secondary-action:focus-visible {
    border-color: color-mix(in srgb, var(--store-accent) 42%, var(--store-border));
    background: color-mix(in srgb, var(--store-surface-soft) 86%, var(--store-accent) 14%);
    color: var(--store-text);
    outline: 0;
}
.store-card-status {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    color: var(--store-muted);
    font-family: "Inter";
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
}
.store-card-status.is-danger {
    color: #ef4444;
}

/* Minha Conta */
.conta-hero-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 22px 24px;
    margin-bottom: 18px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--app-blue), var(--brand, #1e3f6b));
    color: #fff;
    box-shadow: 0 18px 48px var(--shadow);
}
.conta-hero-card.is-empty {
    background: var(--panel);
    color: var(--text-strong);
    border: 1px dashed var(--line);
    box-shadow: none;
}
.conta-hero-icon {
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .18);
    overflow: hidden;
}
.conta-hero-card.is-empty .conta-hero-icon {
    background: var(--panel-soft);
    color: var(--muted);
}
.conta-hero-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.conta-hero-icon svg {
    width: 32px;
    height: 32px;
}
.conta-hero-body {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.conta-hero-tag {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    opacity: .8;
}
.conta-hero-name {
    font-size: 22px;
    font-weight: 900;
}
.conta-hero-detail {
    font-size: 13px;
    font-weight: 700;
    opacity: .9;
}
.conta-summary-card {
    border: 1px solid var(--line);
    background: var(--panel-soft);
    color: var(--muted);
}
.conta-summary-card strong {
    color: var(--text-strong);
}

/* Perfil de Cores: usa .dash-main puro (sem .form-page-main/.integrations-main,
   que são sempre-claro e cortam o scroll) para herdar o scroll normal de
   página e o tema dark/light igual às demais telas administrativas. */
.perfil-cores-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
}
.perfil-cores-tab {
    height: 40px;
    padding: 0 18px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--panel);
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}
.perfil-cores-tab.is-active {
    border-color: var(--brand);
    background: var(--panel-soft);
    color: var(--text-strong);
}
.perfil-cores-sugestoes {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}
.perfil-cores-sugestoes span {
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 800;
}
.perfil-cores-sugestoes .secondary-action {
    height: 32px;
    min-width: 0;
    padding: 0 12px;
    font-size: 12px;
}
.perfil-cores-campo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: var(--panel-soft);
    color: var(--text-strong);
    font-size: 12.5px;
    font-weight: 700;
}
.perfil-cores-campo input[type="color"] {
    width: 40px;
    height: 32px;
    padding: 2px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--panel);
    cursor: pointer;
}
.perfil-cores-campo input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
}
.perfil-cores-campo input[type="color"]::-webkit-color-swatch {
    border: none;
    border-radius: 4px;
}
.perfil-cores-campo input[type="color"]::-moz-color-swatch {
    border: none;
    border-radius: 4px;
}

/* Listagens: primeira coluna mais compacta, com quebra natural apenas quando necessario. */
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > div:first-child:not(.action-cell),
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > strong:first-child,
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > span:first-child {
    min-width: 0;
    overflow: hidden;
    overflow-wrap: break-word;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > div:first-child:not(.action-cell) strong,
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > strong:first-child,
.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > span:first-child {
    max-width: 100%;
    color: var(--list-text-primary);
    font-size: 14px;
    line-height: 1.28;
    white-space: normal;
    overflow-wrap: break-word;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .contacts-row > div:first-child:not(.action-cell) small {
    max-width: 100%;
    font-size: 11px;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: break-word;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-reference-line {
    width: max-content;
    max-width: 100%;
    overflow: visible;
    white-space: nowrap;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-reference-line strong {
    font-size: 16px;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-payment-cell {
    display: grid;
    align-content: center;
    gap: 3px;
    overflow: hidden;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-payment-method {
    max-width: 100%;
    color: var(--list-text-primary);
    font-size: 13px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-payment-status,
.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-receivable-indicator {
    max-width: 100%;
    margin-top: 0;
    color: var(--list-text-secondary);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .orders-table .order-receivable-indicator {
    color: var(--success);
}

/* Controles administrativos: inputs e dropdowns alinhados ao padrao Figma. */
.dashboard:not(.dashboard-home) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.dashboard:not(.dashboard-home) select,
.dashboard:not(.dashboard-home) textarea {
    min-height: 44px;
    border: 1px solid var(--list-border, var(--line-soft));
    border-radius: 10px;
    color: var(--list-text-primary, var(--text-strong));
    background-color: var(--list-surface, var(--input));
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0;
    box-shadow: none;
}

.dashboard:not(.dashboard-home) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"])::placeholder,
.dashboard:not(.dashboard-home) textarea::placeholder {
    color: var(--list-text-secondary, var(--muted));
}

.dashboard:not(.dashboard-home) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):focus,
.dashboard:not(.dashboard-home) select:focus,
.dashboard:not(.dashboard-home) textarea:focus {
    border-color: #3b608f;
    box-shadow: 0 0 0 3px rgba(59, 96, 143, .16);
    outline: 0;
}

.dashboard:not(.dashboard-home) select,
.dashboard:not(.dashboard-home) .order-origin-filter,
.dashboard:not(.dashboard-home) .filter-select,
.dashboard:not(.dashboard-home) .date-filter {
    height: 44px;
    padding: 0 36px 0 14px;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .ghost-action,
.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .secondary-action {
    min-height: 44px;
    border-color: var(--list-border);
    border-radius: 10px;
    color: var(--list-text-primary);
    background: var(--list-surface);
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    box-shadow: none;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .ghost-action:hover,
.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .secondary-action:hover {
    color: var(--list-text-primary);
    background: var(--list-surface-soft);
    transform: none;
}

.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .order-origin-filter,
.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .filter-select,
.dashboard:has(.contacts-card):not(.dashboard-home) .list-actions .date-filter {
    width: auto;
    min-width: 128px;
    border-color: var(--list-border);
    color: var(--list-text-primary);
    background-color: var(--list-surface);
}

.dashboard:has(.contacts-card):not(.dashboard-home) .search-input input {
    min-height: 0;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.dashboard:not(.dashboard-home) .search-input input,
.dashboard:not(.dashboard-home) .search-input input:focus {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.dashboard:not(.dashboard-home) .search-input input::placeholder,
.dashboard:has(.contacts-card):not(.dashboard-home) .search-input input::placeholder {
    font-size: 12px;
    font-weight: 500;
    color: var(--list-text-secondary, var(--muted));
}

.dashboard .cert-mini,
.dashboard:not(.dashboard-home) .cert-mini,
.dashboard-home .cert-mini {
    grid-template-columns: 30px minmax(0, 1fr);
    min-height: 52px;
    gap: 10px;
    border-color: color-mix(in srgb, var(--line-soft) 78%, var(--home-nav-active-bg, #3B608F) 22%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--home-inner-bg) 88%, var(--home-nav-active-bg, #3B608F) 12%), var(--home-inner-bg));
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.dashboard .cert-mini:hover,
.dashboard .cert-mini:focus-visible,
.dashboard:not(.dashboard-home) .cert-mini:hover,
.dashboard:not(.dashboard-home) .cert-mini:focus-visible,
.dashboard-home .cert-mini:hover,
.dashboard-home .cert-mini:focus-visible {
    border-color: color-mix(in srgb, var(--home-nav-active-bg, #3B608F) 52%, var(--line-soft));
    background: color-mix(in srgb, var(--home-inner-bg) 88%, var(--home-nav-active-bg, #3B608F) 12%);
    text-decoration: none !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 10px 24px rgba(2, 8, 23, .16);
    outline: 0;
    transform: translateY(-1px);
}

.dashboard .cert-mini > div,
.dashboard:not(.dashboard-home) .cert-mini > div,
.dashboard-home .cert-mini > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.dashboard .cert-mini,
.dashboard .cert-mini *,
.dashboard:not(.dashboard-home) .cert-mini,
.dashboard:not(.dashboard-home) .cert-mini *,
.dashboard-home .cert-mini,
.dashboard-home .cert-mini * {
    text-decoration: none !important;
}

.dashboard .cert-mini strong,
.dashboard:not(.dashboard-home) .cert-mini strong,
.dashboard-home .cert-mini strong {
    color: var(--text-strong);
    font-family: "Inter";
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0;
}

.dashboard .cert-mini > div > span,
.dashboard:not(.dashboard-home) .cert-mini > div > span,
.dashboard-home .cert-mini > div > span {
    color: var(--muted);
    font-family: "Inter";
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Movimento global: interacoes mais suaves e consistentes. */
.nav-button,
.submenu a,
.submenu button,
.ghost-action,
.primary-action,
.secondary-action,
.cancel-action,
.button-like,
.search-input,
.order-origin-filter,
.filter-select,
.date-filter,
.contacts-row,
.dots-button,
.row-actions-menu,
.pager a,
.pager button,
.stat-card,
.chart-card,
.recent-card,
.sale-row,
.type-pill,
.status-pill,
.fiscal-list-document,
.cert-mini,
.company-switch-trigger,
.logout-icon,
.receivable-filters,
.filter-modal-head button,
.dashboard:not(.dashboard-home) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.dashboard:not(.dashboard-home) select,
.dashboard:not(.dashboard-home) textarea {
    transition-duration: var(--motion-duration-fast);
    transition-timing-function: var(--motion-ease);
}

.nav-button,
.submenu a,
.submenu button,
.ghost-action,
.primary-action,
.secondary-action,
.cancel-action,
.button-like,
.search-input,
.order-origin-filter,
.filter-select,
.date-filter,
.dots-button,
.pager a,
.pager button,
.type-pill,
.status-pill,
.fiscal-list-document,
.filter-modal-head button,
.company-switch-trigger,
.logout-icon,
.dashboard:not(.dashboard-home) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.dashboard:not(.dashboard-home) select,
.dashboard:not(.dashboard-home) textarea {
    transition-property: background-color, background, border-color, color, box-shadow, opacity, transform;
}

.contacts-row,
.sale-row {
    transition-property: background-color, border-color, color, box-shadow;
}

.stat-card,
.chart-card,
.recent-card,
.cert-mini,
.receivable-filters {
    transition-property: background-color, background, border-color, box-shadow, opacity, transform;
}

.row-actions-menu,
.bulk-options-menu {
    transform-origin: top right;
    transition-property: opacity, transform, visibility, display;
    transition-duration: var(--motion-duration);
    transition-timing-function: var(--motion-ease-emphasis);
    transition-behavior: allow-discrete;
}

.action-cell.is-open .row-actions-menu,
.order-action-menu[open] .row-actions-menu,
.bulk-options.is-open .bulk-options-menu {
    animation: menu-soft-in var(--motion-duration) var(--motion-ease-emphasis) both;
}

.filter-modal.is-open .receivable-filters {
    animation: modal-soft-in var(--motion-duration-slow) var(--motion-ease-emphasis) both;
}

.submenu {
    display: grid;
    max-height: 0;
    margin-top: 0;
    margin-bottom: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
        max-height var(--motion-duration-slow) var(--motion-ease-emphasis),
        margin var(--motion-duration) var(--motion-ease),
        opacity var(--motion-duration) var(--motion-ease);
}

.menu-group.is-open .submenu {
    display: grid;
    max-height: 460px;
    margin: 4px 0 8px 25px;
    opacity: 1;
    pointer-events: auto;
}

.settle-modal,
.filter-modal,
.modal-backdrop,
.item-edit-modal,
.image-preview-modal,
.category-modal,
.credentials-modal,
.ciot-json-modal,
.mdfe-doc-modal {
    opacity: 0;
    visibility: hidden;
    transition:
        opacity var(--motion-duration-slow) var(--motion-ease-emphasis),
        visibility var(--motion-duration-slow) var(--motion-ease-emphasis),
        display var(--motion-duration-slow) var(--motion-ease-emphasis);
    transition-behavior: allow-discrete;
}

.settle-modal.is-open,
.filter-modal.is-open,
.modal-backdrop.is-open,
.item-edit-modal.is-open,
.image-preview-modal.is-open,
.category-modal.is-open,
.credentials-modal.is-open,
.ciot-json-modal.is-open,
.mdfe-doc-modal.is-open {
    opacity: 1;
    visibility: visible;
}

.settle-modal-card,
.receivable-filters,
.modal-card,
.user-modal,
.item-edit-dialog,
.image-preview-modal img,
.category-modal-card,
.credentials-card,
.ciot-json-dialog,
.mdfe-doc-modal-card {
    opacity: 0;
    transform: translateY(10px) scale(.985);
    transition:
        opacity var(--motion-duration-slow) var(--motion-ease-emphasis),
        transform var(--motion-duration-slow) var(--motion-ease-emphasis);
}

.settle-modal.is-open .settle-modal-card,
.filter-modal.is-open .receivable-filters,
.modal-backdrop.is-open .modal-card,
.modal-backdrop.is-open .user-modal,
.item-edit-modal.is-open .item-edit-dialog,
.image-preview-modal.is-open img,
.category-modal.is-open .category-modal-card,
.credentials-modal.is-open .credentials-card,
.ciot-json-modal.is-open .ciot-json-dialog,
.mdfe-doc-modal.is-open .mdfe-doc-modal-card {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.row-actions-menu,
.bulk-options-menu,
.product-suggestions,
.category-suggestions,
.customer-suggestions,
.seller-suggestions {
    opacity: 0;
    transform: translateY(-6px) scale(.985);
    visibility: hidden;
}

.action-cell.is-open .row-actions-menu,
.order-action-menu[open] .row-actions-menu,
.bulk-options.is-open .bulk-options-menu,
.product-suggestions.is-open,
.category-suggestions.is-open,
.customer-suggestions.is-open,
.seller-suggestions.is-open {
    opacity: 1;
    transform: translateY(0) scale(1);
    visibility: visible;
}

@starting-style {
    .settle-modal.is-open,
    .filter-modal.is-open,
    .modal-backdrop.is-open,
    .item-edit-modal.is-open,
    .image-preview-modal.is-open,
    .category-modal.is-open,
    .credentials-modal.is-open,
    .ciot-json-modal.is-open,
    .mdfe-doc-modal.is-open {
        opacity: 0;
    }

    .settle-modal.is-open .settle-modal-card,
    .filter-modal.is-open .receivable-filters,
    .modal-backdrop.is-open .modal-card,
    .modal-backdrop.is-open .user-modal,
    .item-edit-modal.is-open .item-edit-dialog,
    .image-preview-modal.is-open img,
    .category-modal.is-open .category-modal-card,
    .credentials-modal.is-open .credentials-card,
    .ciot-json-modal.is-open .ciot-json-dialog,
    .mdfe-doc-modal.is-open .mdfe-doc-modal-card {
        opacity: 0;
        transform: translateY(10px) scale(.985);
    }
}

.menu-group .chev,
.dashboard .nav-button .figma-icon--chevron,
.dashboard:not(.dashboard-home) .nav-button .figma-icon--chevron,
.dashboard-home .nav-button .figma-icon--chevron {
    transition-duration: var(--motion-duration);
    transition-timing-function: var(--motion-ease-emphasis);
}

.page-alert {
    animation-duration: var(--motion-duration-slow);
    animation-timing-function: var(--motion-ease-emphasis);
}

@keyframes menu-soft-in {
    from {
        opacity: 0;
        transform: translateY(-6px) scale(.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes modal-soft-in {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}