@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800&display=swap");

:root {
    --blue: #1769e0;
    --blue-dark: #0e5bbd;
    --ink: #17283e;
    --muted: #718096;
    --line: #dfe6ef;
    --surface: #fff;
    --background: #f4f7fb
}

/* Interacciones críticas: cursor inmediato y consistente en toda la aplicación. */
:where(
    button:not(:disabled),
    a[href],
    select:not(:disabled),
    summary,
    [role="button"]:not([aria-disabled="true"]),
    [role="tab"]:not([aria-disabled="true"]),
    [role="menuitem"]:not([aria-disabled="true"]),
    [role="option"]:not([aria-disabled="true"]),
    input[type="checkbox"]:not(:disabled),
    input[type="radio"]:not(:disabled),
    input[type="file"]:not(:disabled),
    label[for],
    [onclick],
    .clickable,
    [data-clickable="true"]
) {
    cursor: pointer !important
}

:where(button:disabled, select:disabled, input:disabled, textarea:disabled, [aria-disabled="true"]) {
    cursor: not-allowed !important
}

/* Cierres disponibles desde el primer instante, incluidos sus iconos. */
:where([aria-label*="cerrar" i], [title*="cerrar" i], button.close, .close-modal, .modal-close, .dialog-close, .trace-close, .toast-close, [data-close], [data-modal-close], [data-dialog-close], [data-commercial-close], [data-close-inventory], #close-trace):not(:disabled):not([aria-disabled="true"]),
:where([aria-label*="cerrar" i], [title*="cerrar" i], button.close, .close-modal, .modal-close, .dialog-close, .trace-close, .toast-close, [data-close], [data-modal-close], [data-dialog-close], [data-commercial-close], [data-close-inventory], #close-trace):not(:disabled):not([aria-disabled="true"]) * {
    pointer-events: auto !important;
    cursor: pointer !important
}


* {
    box-sizing: border-box
}

html,
body {
    min-height: 100%;
    margin: 0
}

html {
    scrollbar-gutter: stable
}

body {
    color: var(--ink);
    background: var(--background);
    font-family: Inter, system-ui, sans-serif
}

/* Pantalla de entrada SSO: mismo patrón visual de Planilla y Recursos Humanos. */
.access-body {
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 50% 0, #0f4f91, #06182f 55%);
}

.access-card {
    width: min(440px, 90%);
    padding: 40px;
    color: #fff;
    background: #ffffff0d;
    border: 1px solid #ffffff24;
    border-radius: 22px;
    box-shadow: 0 30px 80px #0008;
    text-align: center;
}

.access-logo {
    width: 60px;
    height: 60px;
    margin: 0 auto 20px;
    display: grid;
    place-items: center;
    background: var(--blue);
    border-radius: 17px;
    font: 800 18px Manrope, sans-serif;
}

.access-card small {
    color: #65bdf5;
    letter-spacing: .12em;
}

.access-card h1 {
    font: 800 25px Manrope, sans-serif;
}

.access-card p {
    color: #b5c8df;
    line-height: 1.6;
}

.access-card a {
    display: inline-block;
    margin-top: 12px;
    color: #fff;
}

button,
input,
select,
textarea {
    font: inherit
}

button,
a,
select {
    cursor: pointer
}

button:disabled {
    cursor: not-allowed;
    opacity: .55
}

.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 288px minmax(0, 1fr);
    transition: grid-template-columns .2s ease
}

.workspace {
    min-width: 0;
    grid-column: 2
}

.content {
    padding: 12px
}

.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 30;
    width: 288px;
    display: flex;
    flex-direction: column;
    color: #53657b;
    background: linear-gradient(180deg, #fbfdff, #f3f7fc);
    border-right: 1px solid #dce5f0;
    box-shadow: 8px 0 28px #1737600b;
    transition: width .2s ease, transform .2s ease
}

.brand {
    position: relative;
    height: 65px;
    padding: 14px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    border-bottom: 1px solid #e3eaf3
}

.brand-logo {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    padding: 0;
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, #1776ed, #25a7d4);
    border: 0;
    border-radius: 11px;
    box-shadow: 0 8px 22px #0076ff4d;
    font: 800 12px Manrope, sans-serif
}

.brand-logo:hover {
    filter: brightness(1.06)
}

.brand>div {
    display: grid;
    gap: 2px
}

.brand strong {
    color: #153354;
    font: 800 15px Manrope, sans-serif;
    letter-spacing: .02em;
    white-space: nowrap
}

.brand small {
    color: #7d8da2;
    font-size: 9px
}

.brand #collapse {
    margin-left: auto;
    border: 0;
    border-radius: 8px;
    color: #60748d;
    background: transparent;
    font-size: 18px
}

.brand #collapse:hover {
    color: var(--blue);
    background: #edf4ff
}

.sidebar nav {
    flex: 1;
    min-height: 0;
    padding: 14px 10px;
    overflow: auto
}

.nav-group {
    margin-bottom: 3px
}

.nav-parent {
    width: 100%;
    min-height: 46px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #5c6d82;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    text-align: left
}

.nav-parent:hover,
.nav-group.open>.nav-parent {
    color: #17365b;
    background: #fff;
    border-color: #d7e3f1;
    box-shadow: 0 5px 15px #1737600d
}

.nav-parent span {
    flex: 1;
    font-size: 14px;
    font-weight: 700
}

.nav-parent b {
    color: #91a0b2;
    font-size: 13px;
    transition: transform .2s
}

.nav-group.open>.nav-parent b {
    transform: rotate(180deg)
}

.menu-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    color: var(--blue);
    background: #e9f2ff;
    border-radius: 10px
}

.menu-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round
}

.nav-2 .menu-icon {
    color: #6d4bd3;
    background: #f0ecff
}

.nav-3 .menu-icon {
    color: #0e8b77;
    background: #e5f8f4
}

.nav-4 .menu-icon {
    color: #d16813;
    background: #fff0df
}

.submenu {
    display: none;
    padding: 5px 0 8px 42px
}

.nav-group.open .submenu {
    display: grid
}

.submenu a {
    min-height: 34px;
    padding: 8px 10px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    color: #738398;
    border-left: 1px solid #dce5ef;
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    line-height: 1.35;
    text-decoration: none
}

.submenu a:hover {
    color: #244b75;
    background: #edf4fb
}

.submenu a.active {
    color: var(--blue-dark);
    background: #e5f0ff;
    border-left: 2px solid var(--blue);
    font-weight: 750
}

.submenu i {
    width: 5px;
    height: 5px;
    margin-top: 5px;
    flex: 0 0 5px;
    background: currentColor;
    border-radius: 50%
}

.user-card {
    margin: 9px;
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #dce5ef;
    border-radius: 11px;
    overflow: hidden
}

.user-card>span {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--blue);
    border-radius: 9px;
    font-size: 9px;
    font-weight: 800;
    flex: 0 0 31px
}

.user-card div {
    flex: 1 1 auto;
    width: 0;
    min-width: 0;
    display: grid;
    gap: 2px
}

.user-card strong,
.user-card small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.user-card strong {
    color: #29435f;
    font-size: 11px
}

.user-card small {
    color: #7e8fa3;
    font-size: 12px
}

.user-card a {
    flex: 0 0 auto;
    margin-left: auto;
    margin-right: -4px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: #6c8098;
    border-radius: 8px;
    text-decoration: none
}

.central-session-ended {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background: #f4f7fb;
}

.central-session-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.central-session-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 18px;
    display: grid;
    place-items: center;
    color: #2669df;
}

.central-session-icon svg {
    width: 48px;
    height: 48px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.central-session-card h1 {
    margin: 0;
    color: #17375b;
    font: 800 clamp(25px, 2.2vw, 34px)/1.15 Manrope, Inter, sans-serif;
    letter-spacing: -.035em;
}

.central-session-card p {
    margin: 12px 0 26px;
    color: #6b7f99;
    font-size: 16px;
}

.central-session-card a {
    min-height: 46px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #fff;
    background: #2164d8;
    border-radius: 10px;
    box-shadow: 0 8px 22px #1769e02b;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
}

.central-session-card a:hover {
    background: #1557c3;
}

.central-session-card a svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.central-session-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.central-session-card .central-session-actions a {
    margin: 0;
    border: 1px solid #2669df;
}

.central-session-card .central-session-actions a.secondary {
    color: #2669df;
    background: #fff;
    box-shadow: none;
}

.central-session-card .central-session-actions a.secondary:hover {
    background: #edf4ff;
}

.central-session-card>small {
    margin-top: 18px;
    color: #8494a8;
    font-size: 11px;
}

.user-card a:hover {
    color: var(--blue);
    background: #eaf2ff
}

.user-card a svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round
}

.sidebar-collapsed .app-shell {
    grid-template-columns: 82px minmax(0, 1fr)
}

.sidebar-collapsed .sidebar {
    width: 82px
}

.sidebar-collapsed .brand {
    justify-content: center;
    padding: 14px 10px
}

.sidebar-collapsed .brand-logo {
    width: 42px;
    height: 42px;
    flex-basis: 42px
}

.sidebar-collapsed .brand #collapse {
    display: none
}

.sidebar-collapsed .brand>div,
.sidebar-collapsed .nav-parent span,
.sidebar-collapsed .nav-parent b,
.sidebar-collapsed .submenu,
.sidebar-collapsed .user-card div,
.sidebar-collapsed .user-card a {
    display: none
}

.sidebar-collapsed .nav-parent {
    position: relative;
    min-height: 52px;
    padding: 4px;
    justify-content: center
}

.sidebar-collapsed .menu-icon {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 12px
}

.sidebar-collapsed .nav-parent:hover:after {
    content: attr(title);
    position: absolute;
    left: 72px;
    z-index: 50;
    padding: 8px 10px;
    color: #fff;
    background: #17365b;
    border-radius: 7px;
    box-shadow: 0 8px 20px #1235;
    font-size: 9px;
    white-space: nowrap
}

.sidebar-collapsed .user-card {
    justify-content: center
}

.topbar {
    height: 65px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-bottom: 1px solid #dfe7f0
}

.breadcrumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #8090a4;
    font-size: 12px
}

.breadcrumbs b {
    color: #c5ced9
}

.breadcrumbs strong {
    color: #294763
}

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

.company {
    min-width: 0
}

.active-company {
    width: fit-content;
    max-width: min(420px, 42vw);
    height: 46px;
    padding: 6px 12px 6px 8px;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #087966;
    background: #edfbf6;
    border: 1px solid #afe5d5;
    border-radius: 13px
}

.company-icon {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: grid;
    place-items: center;
    background: #fff;
    border-radius: 9px
}

.company-icon svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round
}

.company-copy {
    min-width: 0;
    width: max-content;
    max-width: 100%;
    display: grid;
    gap: 1px
}

.company-copy small {
    color: #4b8f81;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase
}

.company-copy strong {
    overflow: hidden;
    color: #08725f;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap
}

.mobile-menu {
    display: none;
    border: 0;
    background: transparent;
    color: #31506f;
    font-size: 20px
}

.page-heading {
    min-height: 96px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: #fff;
    border: 1px solid #e0e7ef;
    border-radius: 13px
}

.eyebrow {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em
}

.page-heading h1 {
    margin: 4px 0;
    color: #153454;
    font: 800 25px Manrope, sans-serif
}

.page-heading p {
    margin: 0;
    color: #74859a;
    font-size: 12px
}

.page-heading>div:first-child {
    min-width: 0;
    flex: 1 1 50%
}

.page-plan-summary {
    width: 50%;
    max-width: 660px;
    min-width: 430px;
    min-height: 58px;
    padding: 8px 13px;
    display: grid;
    grid-template-columns: minmax(135px, .75fr) minmax(220px, 1.25fr);
    align-items: center;
    gap: 20px;
    color: #183653;
    background: linear-gradient(135deg, #eef8f7, #f4f8fc);
    border: 1px solid #cfe4e2;
    border-radius: 11px
}

.page-plan-name {
    min-width: 0;
    display: grid;
    gap: 1px
}

.page-plan-name small {
    color: #0f766e;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .1em
}

.page-plan-name strong {
    overflow: hidden;
    font-size: 15px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap
}

.page-plan-name span,
.page-plan-summary .subscription-consumption>small {
    overflow: hidden;
    color: #667d90;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.page-plan-summary .subscription-consumption p {
    margin-bottom: 5px;
    font-size: 10px
}

.page-plan-summary .subscription-progress {
    height: 6px;
    margin-bottom: 4px
}

.heading-actions {
    display: flex;
    gap: 8px
}

.invoice-page-actions {
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px
}

.invoice-list-commands {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px
}

.invoice-refresh-command,
.invoice-list-command {
    box-sizing: border-box;
    width: auto;
    min-width: 80px;
    height: 52px;
    min-height: 52px;
    padding: 7px 12px;
    display: inline-grid;
    place-items: center;
    align-content: center;
    gap: 3px;
    border: 1px solid #e4e9f2;
    border-radius: 8px;
    color: #60728a;
    background: #fbfcfe;
    font-size: 12px;
    font-weight: 700;
    line-height: 14px;
    white-space: nowrap;
    box-shadow: none;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease
}

.invoice-refresh-command:not(:disabled) {
    color: #315f8f;
    border-color: #adc7e5;
    background: #f3f7fc
}

.invoice-refresh-command:not(:disabled):hover,
.invoice-list-command:not(:disabled):hover {
    color: #fff;
    border-color: #1769e0;
    background: #1769e0;
    box-shadow: 0 6px 14px rgba(23, 105, 224, .24);
    transform: translateY(-1px)
}

.invoice-list-command.primary:not(:disabled):hover {
    color: #fff;
    border-color: #7040bf;
    background: #7040bf;
    box-shadow: 0 6px 14px rgba(112, 64, 191, .25)
}

#invoice-list-view:not(:disabled):hover,
#quote-list-view:not(:disabled):hover,
#order-list-view:not(:disabled):hover,
#guide-list-view:not(:disabled):hover {
    color: #fff;
    border-color: #16877b;
    background: #16877b;
    box-shadow: 0 6px 14px rgba(22, 135, 123, .24)
}

#invoice-list-edit:not(:disabled):hover,
#quote-list-edit:not(:disabled):hover,
#order-list-edit:not(:disabled):hover,
#guide-list-edit:not(:disabled):hover {
    color: #fff;
    border-color: #1769e0;
    background: #1769e0;
    box-shadow: 0 6px 14px rgba(23, 105, 224, .24)
}

#quote-list-generate:not(:disabled):hover {
    color: #fff;
    border-color: #b76700;
    background: #b76700;
    box-shadow: 0 6px 14px rgba(183, 103, 0, .24)
}

#invoice-list-cancel:not(:disabled):hover,
#quote-list-cancel:not(:disabled):hover,
#order-list-cancel:not(:disabled):hover {
    border-color: #cf3d49;
    background: #cf3d49;
    box-shadow: 0 6px 14px rgba(207, 61, 73, .23)
}

#invoice-list-delete:not(:disabled):hover,
#quote-list-delete:not(:disabled):hover,
#order-list-delete:not(:disabled):hover {
    border-color: #b42335;
    background: #b42335;
    box-shadow: 0 6px 14px rgba(180, 35, 53, .23)
}

.invoice-list-command.primary {
    color: #7040bf;
    border-color: #bca1e7;
    background: #fbf9ff;
    box-shadow: none
}

#quote-list-generate:not(:disabled) {
    color: #9a5b00;
    border-color: #e3b35d;
    background: #fff8eb;
    box-shadow: none
}

#quote-list-view:not(:disabled),
#order-list-view:not(:disabled),
#guide-list-view:not(:disabled) {
    color: #087c72;
    border-color: #7bc8bd;
    background: #effbf9;
    box-shadow: none
}

#invoice-list-view:not(:disabled) {
    color: #087c72;
    border-color: #7bc8bd;
    background: #effbf9;
    box-shadow: none
}

#quote-list-edit:not(:disabled),
#order-list-edit:not(:disabled),
#guide-list-edit:not(:disabled) {
    color: #1769e0;
    border-color: #9fc0ef;
    background: #f2f7ff;
    box-shadow: none
}

#invoice-list-edit:not(:disabled) {
    color: #1769e0;
    border-color: #9fc0ef;
    background: #f2f7ff;
    box-shadow: none
}

#guide-list-invoice {
    position: relative;
    gap: 0
}

#guide-list-invoice:not(:disabled) {
    color: #087c61;
    border-color: #79c9b0;
    background: #effbf7;
    width: 80px;
    min-width: 80px;
    padding: 3px 4px 2px
}

#guide-list-invoice:disabled {
    width: 80px;
    min-width: 80px;
    padding: 3px 4px 2px
}

#guide-list-invoice svg {
    width: 22px;
    height: 22px
}

#guide-list-invoice span {
    white-space: normal;
    text-align: center;
    font-size: 10.5px;
    line-height: 10px
}

.guide-invoice-caret {
    position: absolute;
    right: 6px;
    top: 6px;
    width: 0;
    height: 0;
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
    border-top: 4px solid currentColor;
    opacity: .7;
    transition: transform .16s ease
}

#guide-list-invoice[aria-expanded="true"] .guide-invoice-caret {
    transform: rotate(180deg)
}

#guide-list-invoice:not(:disabled):hover {
    color: #fff;
    border-color: #087c61;
    background: #087c61;
    box-shadow: 0 6px 14px rgba(8, 124, 97, .24)
}

.invoice-refresh-command svg,
.invoice-list-command svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
    shape-rendering: geometricPrecision
}

.invoice-refresh-command svg *,
.invoice-list-command svg * {
    vector-effect: non-scaling-stroke
}

.invoice-refresh-command span,
.invoice-list-command span {
    display: block
}

.invoice-list-command.invoice-list-cancel:not(:disabled) {
    border-color: #e5a13a;
    color: #d97706;
    background: #fff8eb
}

.invoice-list-command.invoice-list-activate:not(:disabled) {
    border-color: #79c9b0;
    color: #087c61;
    background: #effbf7
}

.invoice-list-command.invoice-list-activate:not(:disabled):hover {
    border-color: #087c61;
    color: #fff;
    background: #087c61;
    box-shadow: 0 6px 14px rgba(8, 124, 97, .24)
}

#quote-list-cancel.invoice-list-activate:not(:disabled):hover {
    border-color: #087c61;
    color: #fff;
    background: #087c61;
    box-shadow: 0 6px 14px rgba(8, 124, 97, .24)
}

.invoice-list-command.invoice-list-delete:not(:disabled) {
    border-color: #eaa2af;
    color: #d78e9c;
    background: #fff8f9
}

.invoice-refresh-command:focus-visible,
.invoice-list-command:focus-visible {
    outline: 2px solid #78aef0;
    outline-offset: 2px
}

.issuance-command-bar {
    margin-bottom: 16px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border: 1px solid #dce6f1;
    border-radius: 13px;
    background: #fff
}

.issuance-command-bar>div:first-child>span {
    color: #1769e0;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em
}

.issuance-command-bar h1 {
    margin: 3px 0;
    color: #173b60;
    font-size: 24px
}

.issuance-command-bar p {
    margin: 0;
    color: #71859a;
    font-size: 12px
}

.issuance-command-bar .invoice-page-actions {
    margin-bottom: 0;
    flex: 0 0 auto
}

.cpe-command-bar {
    margin-bottom: 16px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid #dce6f1;
    border-radius: 13px;
    background: #fff
}

.cpe-selection-context {
    min-width: 210px;
    display: grid;
    gap: 4px
}

.cpe-selection-context small {
    color: #6d8298;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .09em
}

.cpe-selection-context strong {
    color: #173b60;
    font-size: 13px
}

.cpe-list-commands {
    justify-content: flex-end
}

#cpe-list-view:not(:disabled) {
    color: #087c72;
    border-color: #7bc8bd;
    background: #effbf9
}

#cpe-list-view:not(:disabled):hover {
    color: #fff;
    border-color: #16877b;
    background: #16877b
}

#cpe-list-reconcile:not(:disabled) {
    color: #9a5b00;
    border-color: #e3b35d;
    background: #fff8eb
}

#cpe-list-reconcile:not(:disabled):hover {
    color: #fff;
    border-color: #b76700;
    background: #b76700
}

@media (max-width: 720px) {
    .issuance-command-bar {
        align-items: stretch;
        flex-direction: column
    }

    .issuance-command-bar .invoice-page-actions {
        justify-content: flex-start
    }

    .issuance-command-bar .invoice-list-commands {
        width: 100%
    }

    .issuance-command-bar .invoice-list-command {
        flex: 1 1 104px
    }

    .cpe-command-bar {
        align-items: stretch;
        flex-direction: column
    }

    .cpe-list-commands {
        justify-content: flex-start
    }
}

.primary,
.secondary {
    min-height: 38px;
    padding: 9px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 750
}

.primary {
    color: #fff;
    background: linear-gradient(135deg, #1769e0, #0b82d5);
    border: 0;
    box-shadow: 0 6px 15px #1769e033
}

.secondary {
    color: #365a7c;
    background: #fff;
    border: 1px solid #ccd9e7
}

.notice {
    margin-top: 12px;
    padding: 13px 16px;
    display: grid;
    gap: 3px;
    color: #27545b;
    background: #eaf8f6;
    border: 1px solid #bce6df;
    border-radius: 11px
}

.notice strong {
    font-size: 13px
}

.notice span {
    font-size: 11px
}

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

.kpi-grid article {
    height: 90px;
    min-height: 90px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #e0e7ef;
    border-radius: 12px;
    box-shadow: 0 3px 12px #17376008
}

.kpi-grid article:hover {
    border-color: #cfdbe8;
    box-shadow: 0 6px 18px #17376010
}

.kpi-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-weight: 800
}

.kpi-icon.blue {
    color: #1769e0;
    background: #e9f2ff
}

.kpi-icon.green {
    color: #07845d;
    background: #e4f7ed
}

.kpi-icon.amber {
    color: #b26a00;
    background: #fff2d9
}

.kpi-icon.violet {
    color: #7446b8;
    background: #f0e8ff
}

.kpi-icon.teal {
    color: #087f75;
    background: #e1f7f3
}

.kpi-icon.red {
    color: #b42318;
    background: #feecec
}

.kpi-grid article div {
    min-width: 0;
    height: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0
}

.kpi-grid small {
    color: #8593a4;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap
}

.kpi-grid strong {
    color: #193955;
    font-size: 22px;
    line-height: 1
}

.kpi-grid em {
    color: #8a99a9;
    font-size: 10px;
    font-style: normal;
    line-height: 1;
    white-space: nowrap
}

.data-card {
    margin-top: 12px;
    background: #fff;
    border: 1px solid #dfe7ef;
    border-radius: 13px;
    box-shadow: 0 3px 14px #17376008;
    overflow: hidden
}

.data-card>header {
    min-height: 68px;
    padding: 14px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-bottom: 1px solid #e5ebf2
}

.data-card>header h2 {
    margin: 0;
    color: #213e5c;
    font-size: 24px
}

.data-card>header p {
    margin: 4px 0 0;
    color: #8291a2;
    font-size: 12px
}

.data-card>header.document-list-filters-only {
    min-height: 64px;
    justify-content: flex-end
}

.filters {
    display: flex;
    gap: 8px
}

.filters input,
.filters select {
    min-width: 145px
}

.filters button {
    width: 36px;
    border: 1px solid #d5e0eb;
    border-radius: 8px;
    background: #fff;
    color: #52708d
}

.document-filterbar {
    align-items: flex-end;
    flex-wrap: wrap;
    justify-content: flex-end
}

.data-card>header.invoice-list-filters {
    justify-content: flex-start
}

.invoice-list-filters .document-filterbar {
    justify-content: flex-start;
    margin-right: auto
}

.data-card>header.guide-list-filters,
.data-card>header.quote-list-filters,
.data-card>header.order-list-filters {
    justify-content: flex-start
}

.guide-filterbar,
.quote-filterbar,
.order-filterbar {
    justify-content: flex-start;
    margin-right: auto
}

.document-filter-field {
    display: grid;
    gap: 5px
}

.document-filter-field>span:first-child {
    color: #607991;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .05em;
    line-height: 1;
    text-transform: uppercase
}

.document-filter-field input,
.document-filter-field select,
.document-search-control {
    height: 33px;
    border: 1px solid #cedbea;
    border-radius: 9px;
    background: #fff;
    color: #294863;
    font-size: 12px;
    transition: border-color .16s ease, box-shadow .16s ease
}

.document-filter-field input,
.document-filter-field select {
    padding: 0 11px
}

.document-filter-field input:focus,
.document-filter-field select:focus,
.document-search-control:focus-within {
    border-color: #2d82e5;
    box-shadow: 0 0 0 3px #2d82e51a;
    outline: none
}

.document-period-filter input {
    width: 180px
}

.document-range-filter select {
    width: 155px;
    cursor: pointer
}

.document-date-range {
    display: flex;
    align-items: flex-end;
    gap: 8px
}

.document-date-range input {
    width: 150px;
    min-width: 150px
}

.document-status-filter select {
    width: 180px;
    cursor: pointer
}

.document-search-control {
    width: 260px;
    display: flex;
    align-items: center;
    padding-left: 11px
}

.document-search-control svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    fill: none;
    stroke: #7a90a5;
    stroke-linecap: round;
    stroke-width: 1.8
}

.document-search-control input {
    width: 100%;
    min-width: 0;
    height: 31px;
    border: 0;
    background: transparent;
    box-shadow: none
}

.document-search-control input:focus {
    box-shadow: none
}

.table-wrap {
    overflow: auto
}

.electronic-documents-table {
    min-width: 1460px;
    table-layout: fixed
}

.electronic-documents-table.invoice-document-list {
    min-width: 1540px
}

.electronic-documents-table.cpe-document-list {
    min-width: 1390px
}

.data-card>.table-wrap>table>tbody>tr {
    height: 32px
}

.data-card>.table-wrap>table>tbody>tr>td {
    padding-top: 2px;
    padding-bottom: 2px
}

.invoice-selectable-row,
.cpe-selectable-row,
.commercial-selectable-row {
    cursor: pointer;
    transition: background-color .14s ease, box-shadow .14s ease
}

.invoice-selectable-row:hover>td,
.cpe-selectable-row:hover>td,
.commercial-selectable-row:hover>td {
    background: #f7faff
}

.invoice-selectable-row[aria-selected="true"]>td,
.cpe-selectable-row[aria-selected="true"]>td,
.commercial-selectable-row[aria-selected="true"]>td {
    background: #edf5ff
}

.invoice-selectable-row[aria-selected="true"]>td:first-child,
.cpe-selectable-row[aria-selected="true"]>td:first-child,
.commercial-selectable-row[aria-selected="true"]>td:first-child {
    box-shadow: inset 3px 0 #1769e0
}

.invoice-selectable-row:focus-visible,
.cpe-selectable-row:focus-visible,
.commercial-selectable-row:focus-visible {
    outline: 2px solid #78aef0;
    outline-offset: -2px
}

.electronic-documents-table .col-issued {
    width: 94px
}

.electronic-documents-table .col-due {
    width: 82px
}

.electronic-documents-table .col-type {
    width: 68px
}

.electronic-documents-table .col-series {
    width: 52px
}

.electronic-documents-table .col-number {
    width: 80px
}

.electronic-documents-table .col-record {
    width: 140px
}

.electronic-documents-table .col-document {
    width: 100px
}

.electronic-documents-table .col-customer {
    width: 250px
}

.electronic-documents-table .col-currency {
    width: 55px
}

.electronic-documents-table .col-detail {
    width: auto
}

.electronic-documents-table .col-total {
    width: 90px
}

.electronic-documents-table .col-status {
    width: 85px
}

.electronic-documents-table .col-actions {
    width: 150px
}

.electronic-documents-table .col-seller {
    width: 255px
}

.cpe-document-list .cpe-col-issued {
    width: 92px
}

.cpe-document-list .cpe-col-type {
    width: 78px
}

.cpe-document-list .cpe-col-record {
    width: 150px
}

.cpe-document-list .cpe-col-document {
    width: 105px
}

.cpe-document-list .cpe-col-customer {
    width: 235px
}

.cpe-document-list .cpe-col-total {
    width: 100px
}

.cpe-document-list .cpe-col-status {
    width: 165px
}

.cpe-document-list .cpe-col-response {
    width: 235px
}

.cpe-document-list .cpe-col-attempts {
    width: 76px
}

.cpe-document-list .cpe-col-updated {
    width: 100px
}

.cpe-document-list .cpe-response-cell small,
.cpe-document-list td>small {
    display: block;
    margin-top: 2px;
    color: #7f91a3;
    font-size: 9px
}

.cpe-document-list .cpe-response-cell small {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.cpe-document-list .cpe-response-cell>span {
    color: #8a9aae
}

/* Facturas y boletas: compacta el bloque operativo sin quitar espacio al
   detalle ni al vendedor, y entrega ese ancho al estado fiscal. */
body[data-page="facturas-boletas"] .invoice-document-list .col-due {
    width: 76px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-type {
    width: 62px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-series {
    width: 48px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-number {
    width: 74px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-document {
    width: 94px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-customer,
body[data-page="facturas-boletas"] .invoice-document-list .document-customer-column {
    width: 220px;
    min-width: 220px;
    max-width: 220px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-currency {
    width: 48px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-total {
    width: 82px
}

body[data-page="facturas-boletas"] .invoice-document-list .col-status {
    width: 152px
}

body.sidebar-collapsed[data-page="facturas-boletas"] .invoice-document-list .col-customer,
body.sidebar-collapsed[data-page="facturas-boletas"] .invoice-document-list .document-customer-column {
    width: 300px;
    min-width: 300px;
    max-width: 300px
}

body[data-page="facturas-boletas"] .invoice-document-list :is(th, td):nth-child(2),
body[data-page="facturas-boletas"] .invoice-document-list :is(th, td):nth-child(3) {
    position: relative;
    left: -6px
}

body[data-page="centro-cpe"] .electronic-documents-table .col-record {
    width: 124px
}

body[data-page="centro-cpe"] .electronic-documents-table .col-status {
    width: 161px
}

.data-card .electronic-documents-table th,
.data-card .electronic-documents-table td {
    padding-right: 8px;
    padding-left: 8px;
    vertical-align: middle
}

.electronic-documents-table .document-status-column {
    text-align: left;
    vertical-align: middle
}

.electronic-documents-table .document-status-column .status {
    min-width: 0;
    padding: 0;
    justify-content: flex-start;
    border-radius: 0;
    background: transparent
}

.electronic-documents-table .document-detail-cell {
    width: auto;
    min-width: 220px;
    max-width: none
}

.data-card .invoice-document-list .document-detail-cell {
    padding-right: 2px;
    padding-left: 2px
}

.electronic-documents-table .document-customer-column {
    width: 250px;
    min-width: 250px;
    max-width: 250px
}

.electronic-documents-table .document-customer-name {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.electronic-documents-table .document-type-cell {
    font-weight: 400;
    text-transform: uppercase
}

.electronic-documents-table .document-seller-name {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.document-item-list {
    width: 100%;
    display: block;
    overflow: hidden;
    color: #425c75;
    line-height: 1.3;
    letter-spacing: -.25px;
    max-height: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: help
}

.data-card table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px
}

.data-card th {
    padding: 11px 12px;
    color: #597088;
    background: #f3f7fb;
    border-bottom: 1px solid #dfe7ef;
    text-align: left;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .05em
}

.data-card td {
    padding: 11px 12px;
    border-bottom: 1px solid #edf1f5;
    color: #425c75;
    font-size: 11px;
    font-weight: 400
}

.data-card td strong {
    color: #23435f;
    font-weight: 400
}

.data-card tbody td b,
.data-card tbody td .status {
    font-size: 11px;
    font-weight: 400
}

.data-card td small {
    display: block;
    margin-top: 3px;
    color: #8797a7;
    font-size: 11px;
    font-weight: 400
}

.numeric {
    text-align: right !important
}

.empty {
    text-align: center !important;
    padding: 30px !important;
    color: #8796a5 !important
}

.data-card>footer {
    padding: 10px 14px;
    display: flex;
    justify-content: space-between;
    color: #788a9c;
    font-size: 10px
}

.data-card>footer button {
    min-width: 30px;
    padding: 5px;
    border: 1px solid #dae3ec;
    background: #fff;
    color: #71849a
}

.data-card>footer button.selected {
    color: #fff;
    background: var(--blue);
    border-color: var(--blue)
}

.status {
    min-width: 105px;
    padding: 5px 8px;
    display: inline-flex;
    justify-content: center;
    border-radius: 999px;
    color: #50667b;
    background: #edf2f5;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap
}

.status-accepted,
.status-active,
.status-approved,
.status-issued,
.status-billed {
    color: #087852;
    background: #ddf7ec
}

.status-ready_to_sign,
.status-sent,
.status-in_progress {
    color: #174fa6;
    background: #e6efff
}

.status-simulated {
    color: #6b35a5;
    background: #e9ddff
}

.status-rejected,
.status-observed,
.status-voided {
    color: #b42318;
    background: #fee7e7
}

.status-queued,
.status-pending,
.status-draft {
    color: #9a6000;
    background: #fff3d9
}

.row-actions {
    display: flex;
    gap: 4px
}

.row-actions a,
.row-actions button {
    padding: 5px 7px;
    color: #1769e0;
    background: #edf4ff;
    border: 0;
    border-radius: 6px;
    font-size: 9px;
    font-weight: 800;
    text-decoration: none
}

.document-row-actions {
    align-items: center;
    flex-wrap: nowrap
}

.document-row-actions a,
.document-row-actions button {
    width: 27px;
    min-width: 27px;
    height: 27px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d8e6f8;
    border-radius: 7px
}

.document-row-actions svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round
}

.document-row-actions .document-delete-action {
    border-color: #f3d5d8;
    color: #c9344b;
    background: #fff7f8
}

.document-row-actions .document-cancel-action {
    border-color: #f0dcc2;
    color: #a85d00;
    background: #fff9ef
}

.document-row-actions .document-delete-action:hover {
    border-color: #d23b51;
    color: #fff;
    background: #d23b51
}

.document-consultation-mode input:disabled,
.document-consultation-mode select:disabled,
.document-consultation-mode textarea:disabled {
    color: #304c68;
    background: #f5f8fb;
    opacity: 1;
    cursor: default
}

.document-consultation-mode .tool-new,
.document-consultation-mode .tool-emit,
.document-consultation-mode .tool-advance,
.document-consultation-mode .tool-copy,
.document-consultation-mode #add-line,
.document-consultation-mode #add-installment {
    display: none
}

@media (max-width: 980px) {
    .data-card>header {
        align-items: flex-start;
        flex-direction: column
    }

    .document-filterbar {
        width: 100%;
        justify-content: flex-start
    }

    .document-date-range {
        flex-wrap: wrap
    }

    .document-search-filter,
    .document-search-control {
        flex: 1 1 240px
    }
}

.company-icon img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    border-radius: 7px
}

.data-card>footer.document-pagination {
    min-height: 54px;
    padding: 9px 15px;
    align-items: center;
    gap: 18px;
    border-top: 1px solid #e3eaf2;
    background: #fff
}

.document-pagination-summary {
    color: #8a9aae;
    font-size: 11px;
    white-space: nowrap
}

.document-pagination-summary strong {
    color: #173956;
    font-weight: 900
}

.document-pagination nav {
    display: flex;
    align-items: center;
    gap: 7px
}

.data-card>footer.document-pagination button {
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer
}

.data-card>footer.document-pagination button.page-step {
    min-width: 76px
}

.data-card>footer.document-pagination button i {
    font-style: normal;
    font-size: 18px;
    line-height: 1
}

.data-card>footer.document-pagination button.active {
    min-width: 34px;
    padding: 0;
    color: #fff;
    border-color: var(--blue);
    background: var(--blue);
    box-shadow: 0 4px 10px #1672dc35
}

.data-card>footer.document-pagination button:disabled {
    color: #a8b8c9;
    border-color: #dce6ef;
    background: #f2f6f9;
    cursor: not-allowed
}

.document-pagination-pages {
    display: inline-flex;
    align-items: center;
    gap: 5px
}

.document-pagination-pages .ellipsis {
    padding: 0 2px;
    color: #8798aa
}

.workspace-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.compact-card {
    padding-bottom: 14px
}

.compact-card dl {
    margin: 0;
    padding: 0 17px
}

.compact-card dl div {
    padding: 11px 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #edf1f5;
    font-size: 12px
}

.compact-card dt {
    color: #75889c
}

.compact-card dd {
    margin: 0;
    color: #294761;
    font-weight: 700
}

.compact-card>.primary,
.compact-card>pre {
    margin: 14px 17px 0
}

.flow-grid {
    padding: 18px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px
}

.flow-grid article {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px;
    background: #f7fafc;
    border: 1px solid #e2eaf1;
    border-radius: 10px
}

.flow-grid article>span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--blue);
    border-radius: 50%;
    font-weight: 800
}

.flow-grid article div {
    display: grid
}

.flow-grid strong {
    font-size: 12px
}

.flow-grid small {
    color: #8191a2;
    font-size: 12px
}

.recent-list,
.catalog-list {
    margin: 0;
    padding: 0 17px;
    list-style: none
}

.recent-list li,
.catalog-list li {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #edf1f5;
    font-size: 12px
}

.recent-list li div {
    display: grid
}

.recent-list small {
    color: #8494a5
}

.workspace-form {
    padding: 18px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px
}

.workspace-form label {
    display: grid;
    gap: 6px;
    color: #526b83;
    font-size: 12px;
    font-weight: 700
}

.workspace-form label>span {
    display: inline-flex;
    align-items: center;
    gap: 3px
}

.workspace-form label b {
    color: #e14343
}

.workspace-form .wide {
    grid-column: span 2
}

#emitter-form input,
#emitter-form select {
    height: 32px;
    padding: 0 10px;
    line-height: 30px
}

#sunat-configuration-form input:not([type="file"]),
#sunat-configuration-form select {
    height: 32px;
    padding: 0 10px;
    line-height: 30px
}

#sunat-configuration-form input[type="file"] {
    height: 34px;
    padding: 2px 3px;
    line-height: 28px
}

#sunat-configuration-form input[type="file"]::file-selector-button {
    height: 28px;
    margin: 0 8px 0 0;
    padding: 0 10px;
    border: 1px solid #bccbda;
    border-radius: 5px;
    background: #f5f8fb;
    color: #29465f;
    font: 600 11px Inter, system-ui, sans-serif;
    vertical-align: middle
}

.sunat-config-card {
    margin-top: 18px
}

.sunat-tabs {
    margin: 0 18px;
    padding: 6px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    background: #f3f6fa;
    border: 1px solid #dce5ee;
    border-radius: 12px
}

.sunat-tabs button {
    min-width: 0;
    min-height: 58px;
    padding: 8px 12px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 10px;
    align-items: center;
    color: #62778b;
    text-align: left;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 9px;
    box-shadow: none
}

.sunat-tabs button>span {
    width: 28px;
    height: 28px;
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    color: #5f7891;
    background: #e6edf5;
    border-radius: 8px;
    font-size: 9px;
    font-weight: 850
}

.sunat-tabs button>b {
    overflow: hidden;
    color: #36516b;
    font: 800 12px Manrope, Inter, sans-serif;
    text-overflow: ellipsis;
    white-space: nowrap
}

.sunat-tabs button>small {
    overflow: hidden;
    color: #8292a4;
    font-size: 9px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap
}

.sunat-tabs button:hover {
    background: #fff;
    border-color: #d7e2ed
}

.sunat-tabs button[aria-selected="true"] {
    color: #1769e0;
    background: #fff;
    border-color: #bfd5f2;
    box-shadow: 0 5px 14px #1737600d
}

.sunat-tabs button[aria-selected="true"]>span {
    color: #fff;
    background: linear-gradient(135deg, #1769e0, #0b82d5)
}

.sunat-tabs button[aria-selected="true"]>b {
    color: #184f92
}

.sunat-tab-panel[hidden] {
    display: none
}

.sunat-tab-panel {
    min-height: 220px
}

.sunat-managed-banner {
    min-height: 48px;
    grid-template-columns: max-content 1fr;
    align-items: center;
    gap: 10px 16px;
    background: linear-gradient(90deg, #eaf8f6, #f4fbff)
}

.sunat-managed-banner strong {
    color: #176f68
}

.sunat-kpi-grid article {
    min-height: 78px
}

.sunat-kpi-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr))
}

.sunat-kpi-grid .rops-kpi.is-verified {
    border-color: #a9ddc6;
    background: linear-gradient(135deg, #fff, #f2fcf6)
}

.sunat-overview-grid {
    margin-top: 2px
}

.sunat-overview-card {
    margin-top: 10px
}

.sunat-guidance-grid {
    padding: 14px 18px 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px
}

.sunat-guidance-grid .notice {
    min-height: 66px;
    margin: 0;
    padding: 12px 14px;
    align-content: center
}

.sunat-guidance-grid .sunat-beta-notice {
    color: #66501c;
    background: #fff9e9;
    border-color: #f1d899
}

.sunat-settings-form {
    margin: 14px 18px 18px;
    border: 1px solid #dce6ef;
    border-radius: 12px;
    overflow: hidden
}

.sunat-form-section {
    padding: 15px 16px 16px;
    background: #fff;
    border-bottom: 1px solid #e5ebf2
}

.sunat-form-section>header {
    margin-bottom: 13px;
    display: flex;
    align-items: center;
    gap: 10px
}

.sunat-form-section>header>span {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    color: #1769e0;
    background: #eaf3ff;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 800
}

.sunat-form-section h3,
.sunat-status-heading h3 {
    margin: 0;
    color: #23435f;
    font: 800 14px Manrope, Inter, sans-serif
}

.sunat-form-section header p,
.sunat-status-heading p {
    margin: 3px 0 0;
    color: #7a8da1;
    font-size: 10px
}

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

.sunat-form-grid.two-columns,
.sunat-form-grid.certificate-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.sunat-form-grid label {
    min-width: 0;
    display: grid;
    gap: 6px
}

.sunat-form-grid label>span {
    color: #526b83;
    font-size: 11px;
    font-weight: 750
}

.sunat-form-grid .sunat-field-label {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap
}

.sunat-form-grid .sunat-field-label small {
    color: #8a9aac;
    font-size: 9.5px;
    font-weight: 600;
    line-height: 1.2
}

.sunat-form-grid input,
.sunat-form-grid select {
    font-weight: 600
}

.sunat-section-hint {
    margin: 10px 0 0;
    color: #718198;
    font-size: 10px;
    line-height: 1.45
}

.sunat-form-footer {
    min-height: 60px;
    padding: 11px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background: #f7fafd
}

.sunat-form-footer>span {
    color: #718399;
    font-size: 10px
}

.sunat-form-footer .primary {
    min-width: 205px
}

.sunat-security-status {
    margin-top: 14px;
    padding: 16px 18px 18px;
    background: #f8fafc;
    border-top: 1px solid #e1e9f1
}

.sunat-status-heading {
    margin-bottom: 12px
}

.sunat-security-status .configuration-status {
    margin: 0;
    padding: 0;
    border: 1px solid #dfe7ef;
    border-radius: 10px;
    background: #fff;
    overflow: hidden
}

.sunat-security-status .configuration-status>div {
    padding: 12px 14px;
    border-right: 1px solid #edf1f5
}

.sunat-security-status .configuration-status>div:last-child {
    border-right: 0
}

.rops-trust-panel {
    margin-top: 12px;
    overflow: hidden;
    background: #fffaf0;
    border: 1px solid #f1d38a;
    border-radius: 10px
}

.rops-trust-panel.is-verified {
    background: #f2fcf6;
    border-color: #a9ddc6
}

.rops-trust-panel.is-error {
    background: #fff5f4;
    border-color: #efb7b1
}

.rops-trust-panel>header,
.rops-trust-panel>footer {
    padding: 12px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px
}

.rops-trust-panel>header {
    border-bottom: 1px solid #e6ecf1
}

.rops-trust-panel h3 {
    margin: 0;
    color: #23435f;
    font: 800 13px Manrope, Inter, sans-serif
}

.rops-trust-panel header p,
.rops-trust-panel footer span {
    margin: 3px 0 0;
    color: #60788e;
    font-size: 10px;
    line-height: 1.45
}

.rops-status-badge {
    flex: 0 0 auto;
    padding: 5px 9px;
    color: #8a5800;
    background: #fff1ce;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800
}

.rops-trust-panel.is-verified .rops-status-badge {
    color: #087455;
    background: #dff5e9
}

.rops-trust-panel.is-error .rops-status-badge {
    color: #a72b22;
    background: #fee6e3
}

.rops-trust-grid {
    margin: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.rops-trust-grid>div {
    min-width: 0;
    padding: 11px 14px;
    border-right: 1px solid #e6ecf1
}

.rops-trust-grid>div:last-child {
    border-right: 0
}

.rops-trust-grid dt {
    color: #77889e;
    font-size: 9px;
    font-weight: 750;
    text-transform: uppercase
}

.rops-trust-grid dd {
    margin: 5px 0 0;
    overflow: hidden;
    color: #264562;
    font-size: 11px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rops-trust-panel>footer {
    border-top: 1px solid #e6ecf1
}

.rops-trust-panel>footer span {
    margin: 0
}

.rops-trust-panel>footer .secondary {
    min-height: 32px;
    padding: 6px 11px;
    flex: 0 0 auto;
    font-size: 10px
}

.sunat-cdt-note {
    margin: 10px 0 0;
    padding: 10px 12px;
    color: #516a82;
    background: #eef6ff;
    border: 1px solid #d5e7fb;
    border-radius: 8px;
    font-size: 10px;
    line-height: 1.45
}

.sunat-cdt-note strong {
    color: #185fae
}

.sunat-readiness-grid {
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px
}

.sunat-readiness-grid .sunat-readiness {
    height: 100%;
    margin: 0
}

.sunat-readiness-grid .sunat-readiness ul {
    grid-template-columns: 1fr
}

.form-hint {
    margin: -3px 0 2px;
    color: #718198;
    font-size: 12px;
    line-height: 1.55
}

.form-actions {
    display: flex;
    justify-content: flex-end
}

.configuration-status {
    margin: 18px 18px 0;
    padding: 14px 0 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    border-top: 1px solid #e2eaf2
}

.configuration-status div {
    min-width: 0
}

.configuration-status dt {
    color: #77889e;
    font-size: 11px;
    font-weight: 750;
    text-transform: uppercase
}

.configuration-status dd {
    margin: 5px 0 0;
    overflow: hidden;
    color: #264562;
    font-size: 13px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap
}

.configuration-status .certificate-validity-range {
    display: flex;
    align-items: center;
    gap: 7px;
    overflow: visible;
    white-space: normal
}

.certificate-validity-range span {
    display: inline-flex;
    align-items: baseline;
    gap: 4px
}

.certificate-validity-range small {
    color: #77889e;
    font-size: 9px;
    font-weight: 750;
    text-transform: uppercase
}

.certificate-validity-range i {
    color: #9aabba;
    font-style: normal
}

.sunat-readiness {
    margin: 18px;
    padding: 15px;
    border: 1px solid #f1d38a;
    border-radius: 11px;
    background: #fffaf0
}

.sunat-readiness.is-ready {
    border-color: #a9ddc6;
    background: #f2fcf6
}

.sunat-readiness>div {
    display: grid;
    gap: 3px
}

.sunat-readiness>div strong {
    color: #8a5800;
    font-size: 14px
}

.sunat-readiness.is-ready>div strong {
    color: #18754a
}

.sunat-readiness>div span {
    color: #687a8e;
    font-size: 12px;
    line-height: 1.45
}

.sunat-readiness ul {
    margin: 13px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    list-style: none
}

.sunat-readiness li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-width: 0
}

.sunat-readiness li b {
    display: grid;
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 50%;
    background: #f3d89a;
    color: #725000;
    font-size: 12px
}

.sunat-readiness li.ready b {
    background: #bce8ce;
    color: #176b43
}

.sunat-readiness li span {
    display: grid;
    gap: 2px;
    min-width: 0
}

.sunat-readiness li strong {
    color: #314c66;
    font-size: 12px
}

.sunat-readiness li small {
    color: #728399;
    font-size: 11px;
    line-height: 1.35
}

.series-grid {
    padding: 18px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px
}

.series-grid article {
    padding: 14px;
    display: grid;
    gap: 4px;
    background: #f8fafc;
    border: 1px solid #e0e8f0;
    border-radius: 11px
}

.series-grid .series-type {
    color: #6f8296;
    font-size: 9px
}

.series-grid article>strong {
    color: #1769e0;
    font-size: 19px
}

.series-grid article>small,
.series-grid article>em {
    color: #8797a8;
    font-size: 9px;
    font-style: normal
}

.series-grid article>b {
    font-size: 14px
}

.catalog-workspace {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.catalog-form {
    padding: 13px;
    display: grid;
    grid-template-columns: .7fr 1fr 1.5fr 1.5fr auto;
    gap: 7px;
    border-bottom: 1px solid #e6ecf2
}

/* Series de comprobantes */
.series-workspace-card {
    border-color: #d9e4ef;
    box-shadow: 0 10px 30px #18385a0a
}

.series-editor-heading,
.series-list-heading,
.series-document-type,
.series-safety-note {
    display: flex;
    align-items: center
}

.series-new-button svg,
.series-save-button svg,
.series-edit-button svg,
.series-safety-note>svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round
}

.series-new-button,
.series-save-button,
.series-secondary-button,
.series-edit-button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 9px;
    font: 750 12px Inter, sans-serif;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease
}

.series-new-button,
.series-save-button {
    padding: 9px 14px;
    color: #fff;
    background: linear-gradient(135deg, #1769e0, #087bc8);
    border: 1px solid #1769e0;
    box-shadow: 0 6px 15px #1769e024
}

.series-new-button:hover,
.series-save-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 9px 20px #1769e032
}

.series-new-button:focus-visible,
.series-save-button:focus-visible,
.series-secondary-button:focus-visible,
.series-edit-button:focus-visible {
    outline: 3px solid #73adff55;
    outline-offset: 2px
}

.series-new-button:disabled,
.series-save-button:disabled,
.series-secondary-button:disabled {
    cursor: not-allowed;
    opacity: .42;
    transform: none;
    box-shadow: none
}

.series-save-button {
    width: 148px;
    min-width: 148px
}

.series-editor-shell {
    background: #fff
}

.series-editor-shell.is-editing {
    background: #fbfdff;
    box-shadow: inset 3px 0 #4b96ee
}

.series-editor-heading {
    min-height: 68px;
    padding: 14px 17px;
    justify-content: space-between;
    gap: 15px;
    border-bottom: 1px solid #e5ebf2
}

.series-editor-heading h3 {
    margin: 0;
    color: #173a5e;
    font: 800 24px Manrope, Inter, sans-serif
}

.series-editor-heading p {
    margin: 4px 0 0;
    color: #778ca1;
    font-size: 12px
}

.series-list-heading h3 {
    margin: 0 0 4px;
    color: #173a5e;
    font: 800 16px Manrope, Inter, sans-serif
}

.series-list-heading p {
    margin: 0;
    color: #778ca1;
    font-size: 11px
}

.series-count {
    padding: 6px 10px;
    color: #1769e0;
    background: #eaf3ff;
    border: 1px solid #d4e7ff;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 750;
    white-space: nowrap
}

.series-form {
    padding: 18px;
    display: grid;
    grid-template-columns: 1.15fr .8fr 1fr .8fr auto;
    gap: 12px;
    align-items: start
}

.series-field {
    min-width: 0;
    display: grid;
    gap: 6px;
    color: #526b83;
    font-size: 12px;
    font-weight: 700
}

.series-field>span {
    display: inline-flex;
    align-items: center;
    gap: 3px
}

.series-field>span b {
    color: #e3485f
}

.series-field input,
.series-field select {
    height: 32px;
    padding: 0 10px;
    line-height: 30px;
    color: #29465f;
    font-size: 12px;
    font-weight: 600
}

.series-field select {
    text-transform: uppercase
}

.series-field input:disabled,
.series-field select:disabled {
    color: #708397;
    background: #f1f4f7;
    border-color: #d7e0e8;
    box-shadow: none;
    cursor: not-allowed;
    opacity: 1
}

.series-field small {
    overflow: hidden;
    color: #718198;
    font-size: 10px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap
}

.series-form-actions {
    min-height: 63px;
    padding-top: 18px;
    display: flex;
    align-items: flex-start;
    gap: 7px
}

.series-form-actions button {
    min-height: 32px;
    padding: 6px 12px;
    border-radius: 8px;
    line-height: 18px
}

.series-secondary-button {
    padding: 8px 12px;
    color: #49647d;
    background: #fff;
    border: 1px solid #cbd9e7
}

.series-secondary-button:hover,
.series-edit-button:hover {
    color: #0e5fc4;
    background: #f1f7ff;
    border-color: #9fc5f4
}

.series-form-error {
    grid-column: 1 / -1;
    margin: 0;
    padding: 9px 11px;
    color: #a22929;
    background: #fff1f1;
    border: 1px solid #f4caca;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 650
}

.series-safety-note {
    margin: 0 18px 16px;
    padding-top: 11px;
    gap: 9px;
    color: #4f708c;
    border-top: 1px dashed #cfdeec
}

.series-safety-note>svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    color: #1983cb
}

.series-safety-note div {
    display: flex;
    align-items: baseline;
    gap: 7px;
    font-size: 10px
}

.series-safety-note strong {
    color: #305978
}

.series-list-heading {
    min-height: 62px;
    padding: 13px 18px;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #e8eef5
}

.series-count strong {
    margin-right: 2px;
    font-size: 12px
}

.series-table-wrap {
    border-top: 1px solid #e3eaf2
}

.series-table {
    min-width: 760px
}

.series-workspace-card .series-table th {
    height: 40px;
    padding: 10px 18px;
    color: #607890;
    background: #f4f8fc;
    font-size: 10px
}

.series-workspace-card .series-table td {
    height: 48px;
    padding: 9px 18px;
    color: #425c75;
    vertical-align: middle
}

.series-table tbody tr {
    transition: background .15s ease
}

.series-table tbody tr:hover {
    background: #fbfdff
}

.series-row-inactive {
    background: #fafbfc
}

.series-row-inactive>* {
    opacity: .72
}

.series-document-type {
    gap: 10px
}

.series-document-type>span {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    color: #1769e0;
    background: #edf5ff;
    border: 1px solid #d9e9fc;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 800
}

.series-document-type strong,
.series-next-number {
    color: #244560;
    font: 700 12px Inter, system-ui, sans-serif
}

.series-code {
    padding: 6px 10px;
    color: #124f95;
    background: #eef6ff;
    border: 1px solid #d5e8ff;
    border-radius: 7px;
    font: 700 12px Inter, system-ui, sans-serif
}

.series-next-number {
    letter-spacing: 0
}

.series-table .status {
    min-width: 88px;
    gap: 6px;
    font-size: 10px
}

.series-table .status-voided {
    color: #687a8b;
    background: #edf1f4
}

.series-action-column,
.series-action-cell {
    width: 110px;
    text-align: right !important
}

.series-edit-button {
    min-height: 33px;
    padding: 7px 10px;
    color: #1b67bd;
    background: #fff;
    border: 1px solid #cbdff5
}

.series-edit-button svg {
    width: 14px;
    height: 14px
}

.series-empty-state strong,
.series-empty-state span {
    display: block
}

.series-empty-state strong {
    margin-bottom: 5px;
    color: #42617d
}

.product-catalog-form {
    grid-template-columns: .7fr 1.4fr 1fr 1fr 1fr auto
}

input,
select,
textarea {
    width: 100%;
    padding: 0 3px 12px;
    color: #29465f;
    background: #fff;
    border: 1px solid #ccd8e5;
    border-radius: 7px;
    font-size: 12px;
    outline: none
}

input:focus,
select:focus,
textarea:focus {
    border-color: #4b96ee;
    box-shadow: 0 0 0 3px #2684ff15
}

pre {
    padding: 10px;
    white-space: pre-wrap;
    word-break: break-all;
    background: #edf4f6;
    border-radius: 7px;
    font-size: 10px
}

.toast {
    position: fixed;
    left: 50%;
    top: 30px;
    transform: translateX(-50%);
    z-index: 140;
    width: min(460px, calc(100vw - 32px));
    color: #76502b;
    background: #fffdfa;
    border: 1px solid #efb341;
    padding: 15px 42px 15px 16px;
    border-radius: 14px;
    box-shadow: 0 16px 38px #18324a30;
    font-size: 12px;
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 11px;
    align-items: center
}

.error-toast {
    color: #81521f;
    background: #fffdfa;
    border-color: #efb341
}

.success-toast {
    color: #175f55;
    border-color: #65bfae
}

.toast-icon {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #b76c00;
    background: #fff0cf;
    font-size: 17px
}

.success-toast .toast-icon {
    color: #08756a;
    background: #dff5ef
}

.toast-copy {
    display: grid;
    gap: 3px;
    line-height: 1.35
}

.toast-copy strong {
    color: #8a5517;
    font-size: 13px
}

.success-toast .toast-copy strong {
    color: #12685e
}

.toast-close {
    position: absolute;
    top: 7px;
    right: 9px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #7390aa;
    font-size: 18px;
    cursor: pointer;
    padding: 0
}

.toast[hidden] {
    display: none
}

@media (max-width: 600px) {
    .toast {
        top: 12px
    }
}

.modal-backdrop[hidden] {
    display: none
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    padding: 18px;
    display: grid;
    place-items: center;
    background: #102840a8;
    backdrop-filter: blur(2px)
}

.modal-backdrop.is-open {
    display: grid !important;
    visibility: visible;
    opacity: 1
}

.record-modal {
    width: min(1160px, 96vw);
    height: min(860px, 95vh);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 28px 80px #061b3055;
    overflow: hidden
}

.record-modal>header {
    min-height: 78px;
    padding: 17px 0 5px 20px;
    display: flex;
    justify-content: space-between;
    background: linear-gradient(135deg, #f8fbff, #edf5ff);
    border-bottom: 1px solid #dce6f0
}

.record-modal>header span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em
}

.record-modal>header h2 {
    margin: 4px 0;
    color: #173a5c;
    font: 800 19px Manrope
}

.invoice-record-modal>header {
    min-height: 64px;
    padding: 10px 22px;
    background: linear-gradient(120deg, #fbfdff, #f2f7fd);
    border-bottom: 1px solid #e3e9f1
}

.invoice-record-modal>header h2 {
    margin: 5px 0 4px;
    color: var(--ink);
    font: 800 19px Manrope, sans-serif
}

.record-modal>header p {
    margin: 0;
    color: #76899c;
    font-size: 10px
}

.close-modal {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 9px;
    color: #61778e;
    background: #fff;
    font-size: 20px
}

.invoice-form-scroll {
    flex: 1;
    min-height: 0;
    padding: 12px;
    overflow: auto;
    background: #f5f8fb
}

.invoice-form-scroll>.sales-doc-block:last-child {
    margin-bottom: 0
}

/* Cards must keep their natural height; the form owns the vertical scroll. */
.invoice-form-scroll>.sales-doc-block {
    flex: 0 0 auto
}

.invoice-form-scroll {
    display: flex;
    flex-direction: column;
}

.invoice-form-scroll .customer-block {
    order: 1
}

.invoice-form-scroll .voucher-block {
    order: 2
}

.invoice-form-scroll .sales-doc-detail {
    order: 3
}

/* The customer suggestions must be able to extend over the following card. */
.invoice-form-scroll .customer-block {
    position: relative;
    z-index: 3;
    overflow: visible
}

.customer-search-field {
    position: relative
}

.customer-search-results {
    position: absolute;
    z-index: 100;
    top: calc(100% - 12px);
    left: 0;
    width: min(520px, 80vw);
    max-height: 250px;
    overflow: auto;
    padding: 5px;
    background: #fff;
    border: 1px solid #cbd9e8;
    border-radius: 9px;
    box-shadow: 0 14px 32px #1737602b;
}

.customer-search-results button {
    width: 100%;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: 125px minmax(0, 1fr);
    gap: 3px 10px;
    color: #294763;
    background: transparent;
    border: 0;
    border-radius: 7px;
    text-align: left;
}

.customer-search-results button:hover,
.customer-search-results button.active {
    background: #edf4fb
}

.customer-search-results button strong {
    color: #173d66
}

.customer-search-results button span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.customer-search-results button small {
    grid-column: 2;
    color: #7b8da1
}

.natural-person-fields {
    padding: 0 10px 10px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px
}

.natural-person-fields[hidden] {
    display: none
}

.natural-person-fields label {
    display: grid;
    gap: 4px;
    color: #5d7287;
    font-size: 12px;
    font-weight: 700
}

.natural-person-fields input {
    min-width: 0;
    height: 33px;
    padding: 7px 8px;
    color: #3d5875;
    background: #f8fbfe;
    border: 1px solid #cbd9e8;
    border-radius: 6px
}

.action-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: #112a4073;
    backdrop-filter: blur(2px)
}

.action-dialog {
    width: min(410px, 100%);
    min-height: 238px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid #d6e0ea;
    border-radius: 14px;
    box-shadow: 0 24px 70px #102a4350
}

.action-dialog header {
    padding: 22px 24px 16px
}

.action-dialog header span {
    color: #b42338;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em
}

.action-dialog h2 {
    margin: 5px 0 7px;
    color: #243d57;
    font-size: 20px
}

.action-dialog p {
    margin: 0;
    color: #687d91;
    font-size: 12px;
    line-height: 1.55
}

.action-dialog footer {
    display: flex;
    margin-top: auto;
    justify-content: flex-end;
    gap: 9px;
    padding: 14px 24px;
    background: #f6f8fb;
    border-top: 1px solid #e4eaf0
}

.action-dialog footer button {
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid #cbd7e3;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 800
}

.action-dialog footer .danger {
    color: #fff;
    background: #c83245;
    border-color: #c83245
}

.action-dialog footer .primary {
    color: #fff;
    background: #2463a7;
    border-color: #2463a7
}

.missing-customer-dialog .missing-customer-hint {
    margin-top: 10px;
    color: #365f88;
    font-weight: 700
}

.confirmation-dialog {
    width: min(460px, 100%);
    min-height: 0;
    padding: 28px;
    border-radius: 20px
}

.confirmation-dialog .confirmation-dialog-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0
}

.confirmation-dialog .confirmation-dialog-icon {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    display: grid;
    place-items: center;
    color: #d13a52;
    background: #fff0f3;
    border-radius: 14px;
    font-size: 31px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0
}

.confirmation-dialog h2 {
    margin: 0;
    font-size: 19px;
    line-height: 1.25
}

.confirmation-dialog-reference {
    margin-top: 16px;
    padding: 14px 16px;
    overflow: hidden;
    color: #1769d2;
    background: #f5f8fc;
    border: 1px solid #d9e3ef;
    border-radius: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap
}

.confirmation-dialog > p {
    margin: 18px 0 0;
    color: #667d96;
    font-size: 14px;
    line-height: 1.55
}

.confirmation-dialog footer {
    margin-top: 24px;
    padding: 0;
    background: transparent;
    border: 0
}

.confirmation-dialog footer button {
    min-height: 41px;
    padding: 0 18px;
    background: #fff;
    border-radius: 10px;
    font-size: 13px
}

.confirmation-dialog footer .primary {
    color: #fff;
    background: #1769d2;
    border-color: #1769d2
}

.action-dialog .order-reversion-choices {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
    width: 100%;
    height: 51px;
    margin: 16px 0 0;
    padding: 5px;
    box-sizing: border-box;
    background: #f6f9fd;
    border: 1px solid #e1e9f2;
    border-radius: 12px
}

.order-reversion-choices legend {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0
}

.action-dialog .order-reversion-choices>label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
    min-height: 39px;
    padding: 0 8px;
    box-sizing: border-box;
    color: #28445f;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    cursor: pointer
}

.order-reversion-choices label:has(input:checked) {
    background: #fff;
    border-color: #b9d4f2;
    box-shadow: 0 1px 4px #1769d218
}

.action-dialog .order-reversion-choices input {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    margin: 0;
    accent-color: #1769d2
}

.action-dialog .order-reversion-choices strong {
    display: block;
    min-width: 0;
    overflow: hidden;
    font-size: 12px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap
}

.order-reversion-dialog {
    width: min(460px, calc(100vw - 32px));
    height: 303px;
    max-height: calc(100dvh - 40px);
    box-sizing: border-box;
    color: #203653;
    border-color: #dce6f1;
    box-shadow: 0 24px 80px #10243c40
}

.order-reversion-backdrop {
    background: #10243c70;
    backdrop-filter: blur(3px)
}

.order-reversion-dialog .confirmation-dialog-header {
    gap: 14px
}

.order-reversion-dialog .confirmation-dialog-icon {
    border-radius: 16px
}

.order-reversion-dialog h2 {
    font-size: 18px
}

.order-reversion-dialog>p {
    margin-top: 16px;
    color: #61748b;
    font-size: 14px;
    line-height: 1.6
}

.order-reversion-dialog footer {
    margin-top: auto;
    gap: 10px
}

.order-reversion-dialog footer button {
    padding: 11px 18px;
    color: #405875;
    border-color: #dce6f1;
    font-size: 14px;
    font-weight: 600
}

.order-reversion-dialog footer .danger {
    background: #c73950;
    border-color: #c73950
}

@media (max-width: 520px), (max-height: 360px) {
    .order-reversion-dialog {
        height: auto
    }

    .action-dialog .order-reversion-choices {
        height: auto;
        grid-template-columns: 1fr
    }

    .action-dialog .order-reversion-choices>label {
        min-height: 39px
    }
}

.commercial-empty-state {
    min-height: 360px;
    padding: 58px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.commercial-empty-state h2 {
    margin: 16px 0 7px;
    color: #173d66
}

.commercial-empty-state p {
    margin: 0;
    color: #5f738b;
    font-size: 15px
}

.commercial-empty-state>span {
    margin-top: 10px;
    color: #8a99aa;
    font-size: 12px
}

.commercial-empty-icon {
    width: 54px;
    height: 54px;
    padding: 14px;
    color: #1769e0;
    background: #eaf2ff;
    border-radius: 16px
}

.commercial-empty-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8
}

.sales-doc-block {
    margin-bottom: 10px;
    background: #fff;
    border: 1px solid #dce5ee;
    border-radius: 10px;
    overflow: hidden
}

.sales-doc-block-title {
    min-height: 32px;
    padding: 5px 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #edf4fb;
    border-bottom: 1px solid #dce5ee;
    color: #285071;
    font-size: 12px
}

.sales-doc-fields {
    padding: 10px;
    display: grid;
    gap: 8px
}

.sales-doc-fields-main {
    grid-template-columns: repeat(6, minmax(0, 1fr))
}

.sales-doc-fields-client {
    grid-template-columns: 1.2fr .8fr 1.45fr 2.75fr 1fr 1fr 1.35fr
}

[data-commercial-editor="order"] .sales-doc-fields-client {
    grid-template-columns: 13ch .75fr 1.35fr 2.2fr .9fr 13ch 13ch 1.3fr
}

.hydrobiological-fields {
    grid-template-columns: repeat(6, minmax(0, 1fr))
}

.passenger-transport-fields {
    grid-template-columns: repeat(11, minmax(0, 1fr))
}

.cargo-transport-fields {
    grid-template-columns: repeat(8, minmax(0, 1fr))
}

.sales-doc-fields label,
.note-fields label {
    min-width: 0;
    display: grid;
    gap: 4px;
    color: #5d7287;
    font-size: 12px;
    font-weight: 700
}

.invoice-record-modal .sales-doc-fields input,
.invoice-record-modal .sales-doc-fields select,
.invoice-record-modal .note-fields input,
.invoice-record-modal .note-fields select {
    min-width: 0
}

.invoice-record-modal .sales-doc-fields input,
.invoice-record-modal .sales-doc-fields select,
.invoice-record-modal .note-fields input,
.invoice-record-modal .note-fields select {
    height: 33px;
    min-height: 33px;
    padding: 2px 4px
}

.client-name {
    grid-column: auto
}

.client-address {
    grid-column: auto
}

.client-orders-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr);
    gap: 10px;
    align-items: stretch
}

.client-orders-layout .sales-doc-fields-client {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-content: start
}

/* Orden de Venta y comprobante: mantienen el mismo panel de documento origen. */
:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout {
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr)
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client {
    grid-template-columns: repeat(48, minmax(0, 1fr))
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:nth-of-type(1),
:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:nth-of-type(2) {
    grid-column: span 8
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client .client-name {
    grid-column: span 12
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client .client-address {
    grid-column: span 20
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:nth-of-type(n + 5) {
    grid-column: span 16
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:is(.client-contact, .client-phone, .client-purchase-order, .client-sales-order) {
    grid-column: span 8
}

:is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client .client-seller {
    grid-column: span 16
}

[data-commercial-editor="order"] .available-orders-table th:nth-child(3) {
    width: 58px
}

[data-commercial-editor="order"] .available-orders-table th:nth-child(5) {
    width: 74px
}

.order-source-editor .available-orders-table {
    font-size: 10px
}

.order-source-editor .available-orders-table th {
    font-size: 9px
}

.order-source-editor .available-orders-table th:nth-child(3) {
    width: 64px
}

.order-source-editor .available-orders-table th:nth-child(5) {
    width: 82px
}

.order-source-editor .available-orders-table th:last-child,
.order-source-editor .available-orders-table td:last-child {
    text-align: right
}

@media(max-width:1100px) {
    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout {
        grid-template-columns: 1fr
    }

    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:nth-of-type(1),
    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:nth-of-type(2),
    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client .client-name,
    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client .client-address,
    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client>label:nth-of-type(n + 5) {
        grid-column: auto
    }
}

@media(max-width:760px) {
    :is([data-commercial-editor="order"], .order-source-editor) .client-orders-layout .sales-doc-fields-client {
        grid-template-columns: 1fr
    }
}

.direct-gre-repeat-section,
.direct-gre-related,
.direct-gre-containers,
.direct-gre-customs-lines {
    padding: 10px 12px;
}

.direct-gre-repeat-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.direct-gre-repeat-heading>div:first-child { display: grid; gap: 2px }
.direct-gre-repeat-heading span { color: #748ba4; font-size: 10px }
.direct-gre-repeat-heading>div:last-child { display: flex; gap: 6px }

.direct-gre-repeat-row {
    display: grid;
    grid-template-columns: minmax(130px, .8fr) minmax(180px, 1.2fr) minmax(160px, 1fr) minmax(130px, .8fr) max-content;
    gap: 8px;
    align-items: end;
    margin-top: 7px;
    padding: 8px;
    border: 1px solid #d9e4ef;
    border-radius: 8px;
    background: #fbfdff;
}

.direct-gre-repeat-row label { display: grid; gap: 4px; color: #526b84; font-size: 10px; font-weight: 700 }
.direct-gre-repeat-row input,
.direct-gre-repeat-row select { width: 100%; min-height: 32px; border: 1px solid #c9d8e8; border-radius: 7px; padding: 5px 7px; color: #24425e; background: #fff }
.direct-gre-repeat-row .danger { color: #c83838; border-color: #efb3b3 }

.direct-gre-customs-lines .table-wrap { overflow-x: auto }
.direct-gre-customs-lines table { min-width: 1560px }
.direct-gre-customs-lines th { white-space: nowrap }
.direct-gre-customs-lines td:first-child { min-width: 220px; font-weight: 700; color: #335571 }
.direct-gre-customs-lines input,
.direct-gre-customs-lines select { width: 100%; min-width: 100px; min-height: 31px; border: 1px solid #c9d8e8; border-radius: 6px; padding: 4px 6px }

.direct-gre-editor .tool-prepare:not([hidden]) { color: #7651c7; border-color: #d7c8f7 }
.direct-gre-editor .tool-send:not([hidden]) { color: #087a65; border-color: #a7ddcf }
.direct-gre-editor .tool-check:not([hidden]) { color: #1767ad; border-color: #b8d5ed }

@media(max-width:900px) {
    .direct-gre-repeat-row { grid-template-columns: 1fr }
}

.available-orders-panel {
    min-width: 0;
    padding: 0 10px 10px 0;
    display: flex;
    flex-direction: column;
    gap: 7px
}

.available-orders-heading {
    min-height: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #294866
}

.available-orders-heading>div {
    min-width: 0;
    display: grid;
    gap: 1px
}

.available-orders-heading strong {
    font-size: 10px;
    letter-spacing: .055em
}

.available-orders-heading span:not(.available-orders-count) {
    color: #71859a;
    font-size: 9px
}

.available-orders-count {
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #c9dcf1;
    border-radius: 999px;
    color: #1769e0;
    background: #eef5ff;
    font-size: 10px;
    font-weight: 800
}

.client-block-title {
    justify-content: space-between
}

.client-block-title>button {
    min-height: 19px;
    padding: 2px 10px;
    display: flex;
    align-items: center;
    border: 1px solid #126fc3;
    border-radius: 6px;
    color: #fff;
    background: #1678cf;
    font-size: 9px;
    font-weight: 750;
    transform: translateY(3px)
}

.client-block-title>button:disabled {
    cursor: not-allowed;
    opacity: .5
}

.available-orders-table-wrap {
    flex: 1;
    min-height: 84px;
    overflow: auto;
    border: 1px solid #cbdbea;
    border-radius: 7px;
    background: #fff
}

.available-orders-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed
}

.available-orders-table th {
    padding: 4px 6px;
    color: #fff;
    background: linear-gradient(180deg, #22618d, #164d74);
    border-right: 1px solid #d7e5f0;
    font-size: 9px;
    line-height: 1.15;
    text-align: left;
    white-space: nowrap
}

.available-orders-table th:first-child {
    width: 44px;
    text-align: center
}

.available-orders-table th:nth-child(2) {
    width: 25%
}

.available-orders-table th:nth-child(4) {
    width: 64px;
    text-align: center
}

.available-orders-table th:last-child {
    width: 30%;
    text-align: right
}

.available-orders-table td {
    padding: 6px;
    color: #536b82;
    border-bottom: 1px solid #dce6ef;
    font-size: 11px
}

.available-orders-table .empty td {
    padding: 7px;
    color: #75879a;
    text-align: center
}

.note-fields {
    display: contents
}

.note-fields[hidden] {
    display: none
}

.note-fields>label {
    flex: 0 1 18ch;
    width: 18ch
}

.note-fields>.note-reference-field {
    flex-basis: 34ch;
    width: 34ch
}

.note-fields>.note-reason-field {
    flex-basis: 29ch;
    width: 29ch
}

.note-fields>.note-detail-field {
    flex: 1 1 28ch;
    width: 28ch;
    min-width: 28ch
}

.detail-title {
    justify-content: space-between
}

.detail-title>div {
    display: grid
}

.detail-title>div span {
    color: #8495a5;
    font-size: 9px
}

.sales-detail-tabs {
    display: flex;
    gap: 4px
}

.sales-detail-tabs button {
    padding: 7px 10px;
    color: #687e94;
    background: transparent;
    border: 0;
    border-radius: 6px;
    font-size: 9px
}

.sales-detail-tabs button.active {
    color: #1769e0;
    background: #fff;
    box-shadow: 0 2px 8px #17376012
}

.sales-detail-tabs i {
    padding: 1px 5px;
    color: #fff;
    background: #1769e0;
    border-radius: 999px;
    font-style: normal
}

.sales-detail-panel {
    display: none
}

.sales-detail-panel.active {
    display: block
}

.invoice-table-wrap {
    overflow: auto
}

.invoice-lines,
.installment-table {
    width: 100%;
    min-width: 1380px;
    border-collapse: collapse
}

.installment-table {
    min-width: 600px
}

.invoice-lines th,
.installment-table th {
    padding: 8px;
    color: #5b7187;
    background: #f7f9fb;
    border-bottom: 1px solid #dce5ee;
    font-size: 12px;
    white-space: nowrap
}

.invoice-lines td,
.installment-table td {
    padding: 5px;
    border-bottom: 1px solid #e9eef3;
    font-size: 9px;
    text-align: right
}

.invoice-lines input,
.invoice-lines select,
.installment-table input {
    min-width: 72px;
    padding: 6px;
    font-size: 9px
}

.invoice-lines td:nth-child(3) input {
    min-width: 190px
}

.invoice-lines button,
.installment-table button {
    padding: 5px 8px;
    color: #b42318;
    background: #fee7e7;
    border: 0;
    border-radius: 5px
}

.tax-affectation {
    display: none
}

.installment-toolbar {
    padding: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.installment-toolbar p {
    margin: 0;
    color: #76899c;
    font-size: 10px
}

.invoice-summary {
    padding: 10px;
    display: grid;
    grid-template-columns: 1fr 370px;
    gap: 15px;
    background: #f8fafc;
    border-top: 1px solid #dce5ee
}

.invoice-notes {
    display: grid;
    gap: 5px;
    color: #62778d;
    font-size: 9px
}

.invoice-totals {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 16px
}

.invoice-totals p {
    margin: 0;
    padding: 4px 0;
    display: flex;
    justify-content: space-between;
    color: #63788e;
    border-bottom: 1px dashed #d8e0e8;
    font-size: 12px
}

.invoice-totals p.total {
    grid-column: 1/-1;
    padding: 8px;
    color: #173e61;
    font-size: 13px;
    font-weight: 800
}

.record-modal>.form-error {
    min-height: 0;
    padding: 0 19px;
    color: #b42318;
    font-size: 10px
}

/* Las ventanas operativas informan errores mediante el aviso flotante. El
   contenedor se conserva para compatibilidad del script, pero no ocupa espacio
   ni duplica el mismo mensaje dentro del formulario. */
.record-modal .form-error {
    display: none !important
}

.trace-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: min(820px, calc(100vh - 32px));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 24px 70px #09223d55
}

.subscription-meter {
    margin-bottom: 18px;
    padding: 16px 20px;
    display: grid;
    grid-template-columns: minmax(190px, .7fr) minmax(300px, 1.3fr);
    gap: 28px;
    align-items: center;
    color: #183653;
    background: linear-gradient(135deg, #eef8f7, #f4f8fc);
    border: 1px solid #cfe4e2;
    border-radius: 12px
}

.subscription-meter>div:first-child {
    display: flex;
    flex-direction: column;
    gap: 3px
}

.subscription-meter small {
    color: #6a7f90;
    font-size: 10px
}

.subscription-meter>div:first-child>small {
    color: #0f766e;
    font-weight: 800;
    letter-spacing: 1px
}

.subscription-meter>div:first-child strong {
    font-size: 19px
}

.subscription-meter>div:first-child span {
    color: #667d90;
    font-size: 11px
}

.subscription-consumption p {
    margin: 0 0 8px;
    display: flex;
    justify-content: space-between;
    font-size: 12px
}

.subscription-consumption p strong {
    color: #0f766e
}

.subscription-progress {
    height: 8px;
    margin-bottom: 7px;
    overflow: hidden;
    background: #dbe7eb;
    border-radius: 99px
}

.subscription-progress i {
    height: 100%;
    display: block;
    background: linear-gradient(90deg, #0f766e, #22a38f);
    border-radius: inherit
}

.subscription-blocked {
    background: #fff3f2;
    border-color: #efc5c1
}

.subscription-blocked .subscription-progress i {
    background: #c7443e
}

.trace-modal>header {
    padding: 18px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    background: linear-gradient(135deg, #123b65, #0f766e)
}

.trace-modal>header span {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
    opacity: .78
}

.trace-modal>header h2 {
    margin: 3px 0 0;
    font-size: 21px
}

.trace-modal>header button {
    color: #fff;
    background: transparent;
    border: 0;
    font-size: 28px;
    cursor: pointer
}

.trace-summary {
    padding: 14px 22px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    background: #f3f7fb;
    border-bottom: 1px solid #dbe5ee
}

.trace-summary div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px
}

.trace-summary strong {
    overflow: hidden;
    color: #183653;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.trace-summary span {
    overflow: hidden;
    color: #6c7f91;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.trace-content {
    padding: 20px 22px;
    overflow-y: auto
}

.trace-loading {
    padding: 32px;
    color: #718398;
    text-align: center
}

.trace-timeline {
    margin: 0;
    padding: 0;
    list-style: none
}

.trace-timeline li {
    position: relative;
    padding: 0 0 18px 28px
}

.trace-timeline li:not(:last-child)::before {
    content: '';
    position: absolute;
    left: 7px;
    top: 14px;
    bottom: -4px;
    width: 2px;
    background: #d5e3ec
}

.trace-timeline li>i {
    position: absolute;
    left: 0;
    top: 8px;
    width: 16px;
    height: 16px;
    background: #0f766e;
    border: 4px solid #d8f1ed;
    border-radius: 50%
}

.trace-timeline article {
    padding: 13px 15px;
    background: #fff;
    border: 1px solid #dbe5ee;
    border-radius: 10px;
    box-shadow: 0 3px 12px #1737600a
}

.trace-timeline article>header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px
}

.trace-timeline article>header strong {
    color: #183653;
    font-size: 13px
}

.trace-timeline article time {
    color: #718398;
    font-size: 10px;
    white-space: nowrap
}

.trace-timeline article>p {
    margin: 6px 0 0;
    color: #526a80;
    font-size: 11px
}

.trace-details {
    margin: 10px 0 0;
    padding-top: 9px;
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 5px 12px;
    border-top: 1px dashed #dbe5ee;
    font-size: 10px
}

.trace-details dt {
    color: #718398;
    text-transform: capitalize
}

.trace-details dd {
    margin: 0;
    color: #294962;
    font-weight: 700
}

.trace-modal>footer {
    padding: 12px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #dbe5ee
}

.trace-modal>footer small {
    color: #718398
}

@media(max-width:1100px) {
    .kpi-grid {
        grid-template-columns: 1fr 1fr
    }

    .catalog-workspace,
    .workspace-split {
        grid-template-columns: 1fr
    }

    .sales-doc-fields-main {
        grid-template-columns: repeat(3, 1fr)
    }

    .sales-doc-fields-client {
        grid-template-columns: repeat(2, 1fr)
    }

    .client-orders-layout {
        grid-template-columns: 1fr
    }

    .available-orders-panel {
        padding: 0 10px 10px
    }

    .catalog-form,
    .product-catalog-form {
        grid-template-columns: 1fr 1fr
    }

    .series-form {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .series-form-actions {
        padding-top: 20px;
        justify-content: flex-end
    }

    .series-grid {
        grid-template-columns: 1fr 1fr
    }

    .flow-grid {
        grid-template-columns: 1fr 1fr
    }

    .sunat-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .sunat-readiness-grid {
        grid-template-columns: 1fr
    }

    .sunat-kpi-grid,
    .rops-trust-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .rops-trust-grid>div:nth-child(2) {
        border-right: 0
    }
}

@media(max-width:760px) {
    .subscription-meter {
        grid-template-columns: 1fr;
        gap: 14px
    }

    .trace-summary {
        grid-template-columns: 1fr
    }

    .trace-timeline article>header {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px
    }

    .app-shell,
    .sidebar-collapsed .app-shell {
        grid-template-columns: 1fr
    }

    .workspace {
        grid-column: 1
    }

    .sidebar,
    .sidebar-collapsed .sidebar {
        width: 288px;
        transform: translateX(-100%)
    }

    .mobile-open .sidebar {
        transform: translateX(0)
    }

    .mobile-menu {
        display: block
    }

    .breadcrumbs span,
    .breadcrumbs b {
        display: none
    }

    .topbar {
        padding: 0 12px
    }

    .content {
        padding: 8px
    }

    .page-heading {
        align-items: flex-start;
        flex-direction: column
    }

    .page-plan-summary {
        width: 100%;
        min-width: 0;
        grid-template-columns: 1fr 1.2fr
    }

    .kpi-grid,
    .workspace-form,
    .series-grid,
    .flow-grid {
        grid-template-columns: 1fr
    }

    .workspace-form .wide {
        grid-column: auto
    }

    .configuration-status {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .sunat-readiness ul {
        grid-template-columns: 1fr
    }

    .sunat-managed-banner,
    .sunat-guidance-grid,
    .sunat-form-grid,
    .sunat-form-grid.two-columns,
    .sunat-form-grid.certificate-grid {
        grid-template-columns: 1fr
    }

    .sunat-kpi-grid,
    .rops-trust-grid {
        grid-template-columns: 1fr
    }

    .rops-trust-grid>div {
        border-right: 0;
        border-bottom: 1px solid #e6ecf1
    }

    .rops-trust-grid>div:last-child {
        border-bottom: 0
    }

    .rops-trust-panel>header,
    .rops-trust-panel>footer {
        align-items: flex-start;
        flex-direction: column
    }

    .sunat-guidance-grid {
        padding: 10px 10px 0
    }

    .sunat-tabs {
        margin: 0 10px;
        padding: 4px;
        gap: 3px
    }

    .sunat-tabs button {
        min-height: 52px;
        padding: 7px;
        grid-template-columns: 24px minmax(0, 1fr);
        column-gap: 6px
    }

    .sunat-tabs button>span {
        width: 24px;
        height: 24px
    }

    .sunat-tabs button>small {
        display: none
    }

    .sunat-tabs button>b {
        grid-row: 1 / 3;
        font-size: 10px
    }

    .sunat-settings-form {
        margin: 10px 10px 16px
    }

    .sunat-form-footer {
        align-items: stretch;
        flex-direction: column
    }

    .sunat-form-footer .primary {
        width: 100%;
        min-width: 0
    }

    .sunat-security-status {
        padding: 14px 10px
    }

    .sunat-security-status .configuration-status {
        grid-template-columns: 1fr
    }

    .sunat-security-status .configuration-status>div {
        border-right: 0;
        border-bottom: 1px solid #edf1f5
    }

    .sunat-security-status .configuration-status>div:last-child {
        border-bottom: 0
    }

    .active-company {
        width: fit-content;
        max-width: min(300px, 58vw)
    }

    .sales-doc-fields-main,
    .sales-doc-fields-client,
    .note-fields {
        grid-template-columns: 1fr
    }

    .client-name,
    .client-address {
        grid-column: auto
    }

    .invoice-summary {
        grid-template-columns: 1fr
    }

    .record-modal {
        height: 97vh
    }

    .catalog-form,
    .product-catalog-form {
        grid-template-columns: 1fr
    }

    .series-editor-heading,
    .series-list-heading {
        align-items: flex-start;
        flex-direction: column
    }

    .series-editor-shell {
        margin: 0;
        padding: 0
    }

    .series-editor-heading,
    .series-form {
        padding: 14px
    }

    .series-editor-heading h3 {
        font-size: 21px
    }

    .series-safety-note {
        margin: 0 14px 14px
    }

    .series-form {
        grid-template-columns: 1fr
    }

    .series-form-actions {
        min-height: auto;
        padding-top: 4px;
        justify-content: stretch
    }

    .series-form-actions button {
        flex: 1
    }

    .series-safety-note,
    .series-safety-note div {
        align-items: flex-start
    }

    .series-safety-note div {
        display: grid;
        gap: 2px
    }

    .series-list-heading {
        padding: 13px 14px
    }

    .series-table-wrap {
        padding: 8px 10px 12px;
        overflow: visible
    }

    .series-table {
        min-width: 0
    }

    .series-table thead {
        display: none
    }

    .series-table tbody,
    .series-table tr,
    .series-table td {
        display: block;
        width: 100%
    }

    .series-table tr {
        margin-bottom: 9px;
        padding: 4px 12px;
        background: #fff;
        border: 1px solid #dce6f0;
        border-radius: 11px;
        box-shadow: 0 3px 10px #18385a08
    }

    .series-workspace-card .series-table td {
        min-height: 45px;
        height: auto;
        padding: 9px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        border-bottom: 1px solid #edf2f6;
        text-align: right
    }

    .series-workspace-card .series-table td::before {
        content: attr(data-label);
        color: #71879a;
        font-size: 9px;
        font-weight: 750;
        text-align: left;
        text-transform: uppercase;
        letter-spacing: .04em
    }

    .series-workspace-card .series-table td:first-child {
        justify-content: flex-start
    }

    .series-workspace-card .series-table td:first-child::before {
        display: none
    }

    .series-workspace-card .series-table td:last-child {
        border-bottom: 0
    }

    .series-document-type {
        width: 100%
    }

    .series-action-cell,
    .series-edit-button {
        width: 100%
    }

    .series-empty-state {
        display: block !important;
        padding: 26px 10px !important;
        text-align: center !important
    }

    .series-empty-state::before {
        display: none
    }
}

.modal-actionbar {
    min-height: 52px;
    padding: 4px 15px 2px 16px;
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
    gap: 5px;
    background: #fff;
    border-bottom: 1px solid #dce6f0
}

.modal-tool {
    min-width: 66px;
    padding: 6px 9px;
    display: grid;
    place-items: center;
    gap: 2px;
    border: 1px solid #d9e1ec;
    border-radius: 9px;
    background: #f8fafc;
    font-size: 9px;
    font-weight: 700
}

.modal-tool b {
    font-size: 17px;
    font-weight: 500
}

.modal-tool b svg {
    display: block;
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round
}

.tool-new {
    color: #7858d7;
    background: #f6f2ff;
    border-color: #e5dcff
}

.tool-save {
    color: #238879;
    background: #edfaf6;
    border-color: #caece4
}

.tool-emit {
    color: #248579;
    background: #effaf7;
    border-color: #d1ece7
}

.tool-cancel {
    color: #cf3d49;
    background: #fff1f2;
    border-color: #fac7cc
}

.tool-annul {
    color: #c95062;
    background: #fff4f5;
    border-color: #f4ccd2
}

.tool-print {
    color: #1775a4;
    background: #ecf8ff;
    border-color: #bee3f5
}

.tool-advance,
.tool-copy {
    color: #a65d18;
    background: #fff6e9;
    border-color: #f4d4a9
}

.sales-doc-fields-main {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.voucher-field-row {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 8px
}

.voucher-primary-row {
    flex-wrap: nowrap
}

.voucher-field-row>label {
    flex: 0 1 var(--voucher-field-width, 18ch);
    width: var(--voucher-field-width, 18ch)
}

.voucher-primary-row>label {
    flex-grow: 1
}

.field-operation {
    --voucher-field-width: 25ch
}

.field-document-type {
    --voucher-field-width: 22ch
}

.field-series {
    --voucher-field-width: 9ch
}

.field-number {
    --voucher-field-width: calc(19ch - 1cm)
}

.field-issued-at {
    --voucher-field-width: 21ch
}

.issue-datetime-control {
    display: grid;
    grid-template-columns: 14ch 9ch;
    align-items: center;
    height: 33px;
    min-height: 33px;
    overflow: hidden;
    border: 1px solid #c8d7e7;
    border-radius: 7px;
    background: #fff
}

.issue-datetime-control:focus-within {
    border-color: #168b91;
    box-shadow: 0 0 0 2px #168b9118
}

.issue-datetime-control input[type="date"] {
    min-width: 0;
    height: 31px;
    min-height: 31px;
    padding-right: 4px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    outline: 0
}

.issue-time-value {
    min-width: 8ch;
    height: 31px;
    padding: 0 6px;
    border-left: 1px solid #d7e2ee;
    color: #294866;
    font-variant-numeric: tabular-nums;
    line-height: 31px;
    text-align: center;
    background: #fff
}

.field-due-date {
    --voucher-field-width: 14ch
}

.field-currency {
    --voucher-field-width: 9ch
}

.field-payment-terms {
    --voucher-field-width: calc(20ch - 1cm)
}

.field-warehouse {
    --voucher-field-width: 12ch
}

.field-guide,
.field-purchase-order,
.field-sales-order {
    --voucher-field-width: 18ch
}

.field-free-transfer {
    --voucher-field-width: 16ch
}

.field-payment-system {
    --voucher-field-width: 24ch
}

.field-isc-system {
    --voucher-field-width: 20ch
}

.field-exchange-rate {
    --voucher-field-width: 11ch
}

.exchange-rate-field {
    margin-left: auto
}

.exchange-rate-field input {
    text-align: right;
    font-variant-numeric: tabular-nums
}

@media(max-width:1100px) {
    .voucher-primary-row {
        flex-wrap: wrap
    }

    .voucher-primary-row>label {
        flex-grow: 0
    }
}

@media(max-width:760px) {
    .modal-actionbar {
        justify-content: flex-start;
        overflow-x: auto
    }

    .modal-tool {
        min-width: 62px
    }

    .voucher-field-row>label {
        flex-basis: 100%;
        width: 100%
    }

    .voucher-primary-row {
        flex-wrap: wrap
    }

    .exchange-rate-field {
        margin-left: 0
    }

    .note-fields>label,
    .note-fields>.note-detail-field {
        flex-basis: 100%;
        width: 100%;
        min-width: 0
    }
}

.modal-context {
    flex: 0 0 auto;
    align-self: stretch;
    margin-right: auto;
    display: flex;
    align-items: center;
    gap: 16px
}

.modal-context strong {
    height: 100%;
    padding: 0 3px;
    display: flex;
    align-items: center;
    color: #0e5bbd;
    border-bottom: 2px solid #1769e0;
    font-size: 12px
}

.modal-context span {
    color: #7c8da0;
    font-size: 10px
}

.document-form-tabs {
    display: flex;
    align-items: center;
    gap: 4px
}

.document-form-tabs button {
    min-height: 34px;
    padding: 6px 12px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 7px 7px 0 0;
    background: transparent;
    color: #71849a;
    font-weight: 700
}

.document-form-tabs button.active {
    border-bottom-color: #1769e0;
    color: #0c58c7;
    background: #eef5ff
}

.document-form-tabs button:disabled {
    opacity: .58
}

.document-form-tabs i {
    margin-left: 5px;
    padding: 2px 6px;
    border-radius: 999px;
    background: #dfe8f3;
    font-style: normal;
    font-size: 9px
}

[data-document-panel][data-tab-hidden] {
    display: none !important
}

.tax-summary-fields {
    grid-template-columns: repeat(6, minmax(0, 1fr))
}

.tax-summary-fields input[readonly] {
    background: #f7f9fc;
    color: #294763
}

.tax-completion-status {
    margin-left: auto;
    padding: 3px 9px;
    border-radius: 999px;
    background: #e8edf3;
    color: #65778a;
    font-weight: 800
}

.tax-completion-status.is-pending {
    background: #fff1cf;
    color: #9a6500
}

.tax-completion-status.is-complete {
    background: #dff5e9;
    color: #177447
}

.tax-guidance {
    margin: 0 10px 10px;
    padding: 9px 11px;
    border-left: 3px solid #76aeea;
    border-radius: 5px;
    background: #f3f8fe;
    color: #526b84;
    font-size: 11px
}

.tax-guidance.is-warning {
    border-left-color: #e5a52a;
    background: #fff7e4;
    color: #865b08
}

.invoice-record-modal {
    width: min(1630px, calc(100vw - 32px));
    height: min(919px, calc(100dvh - 24px));
    transform: none
}

@media(max-height:800px) and (min-width:761px) {
    .invoice-record-modal>header {
        min-height: 56px;
        padding: 7px 20px
    }

    .invoice-record-modal>header h2 {
        margin: 3px 0 2px;
        font-size: 18px
    }

    .modal-actionbar {
        min-height: 48px;
        padding-top: 3px
    }

    .modal-tool {
        padding-top: 4px;
        padding-bottom: 4px
    }

    .invoice-form-scroll {
        padding: 10px
    }

    .sales-doc-block {
        margin-bottom: 8px
    }

    .sales-doc-fields {
        padding: 8px 10px;
        gap: 6px 8px
    }

    .invoice-record-modal .sales-doc-fields input,
    .invoice-record-modal .sales-doc-fields select,
    .invoice-record-modal .note-fields input,
    .invoice-record-modal .note-fields select {
        height: 31px;
        min-height: 31px;
        padding-top: 5px;
        padding-bottom: 5px
    }
}

.invoice-record-modal button {
    font-size: 12px
}

.invoice-record-modal>header>.close-modal {
    font-size: 20px
}

/* Cotizaciones y pedidos comparten la densidad visual del emisor electrónico. */
.commercial-full-editor[data-commercial-editor="quote"],
.commercial-full-editor[data-commercial-editor="order"],
.commercial-full-editor[data-commercial-editor="guide"] {
    border: 1px solid #d7e2ed;
    box-shadow: 0 30px 85px #071d345c
}

.commercial-full-editor[data-commercial-editor="quote"] .invoice-form-scroll,
.commercial-full-editor[data-commercial-editor="order"] .invoice-form-scroll,
.commercial-full-editor[data-commercial-editor="guide"] .invoice-form-scroll {
    gap: 2px;
    padding: 4px 14px 14px;
    background: #f4f7fb
}

.commercial-full-editor[data-commercial-editor="quote"] .sales-doc-block,
.commercial-full-editor[data-commercial-editor="order"] .sales-doc-block,
.commercial-full-editor[data-commercial-editor="guide"] .sales-doc-block {
    border-color: #d6e2ee;
    box-shadow: 0 2px 7px #1737600a
}

.commercial-full-editor[data-commercial-editor="quote"] .sales-doc-fields-main,
.commercial-full-editor[data-commercial-editor="order"] .sales-doc-fields-main,
.commercial-full-editor[data-commercial-editor="guide"] .sales-doc-fields-main {
    display: grid;
    grid-template-columns: repeat(24, minmax(0, 1fr));
    gap: 8px 10px;
    align-items: end
}

.commercial-full-editor .commercial-field-operation {
    grid-column: span 6
}

.commercial-full-editor .commercial-field-document {
    grid-column: span 4
}

.commercial-full-editor .commercial-field-series {
    grid-column: span 2
}

.commercial-full-editor .commercial-field-number {
    grid-column: span 3
}

.commercial-full-editor .commercial-field-issued {
    grid-column: span 5
}

.commercial-full-editor .commercial-field-date {
    grid-column: span 4
}

.commercial-full-editor .commercial-field-currency {
    grid-column: span 3
}

.commercial-full-editor .commercial-field-payment {
    grid-column: span 4
}

.commercial-full-editor .commercial-field-warehouse {
    grid-column: span 4
}

.commercial-full-editor .commercial-field-delivery {
    grid-column: span 6
}

.commercial-full-editor .commercial-field-payment-system {
    grid-column: span 5
}

.commercial-full-editor .commercial-field-isc {
    grid-column: span 4
}

.commercial-full-editor .commercial-field-rate {
    grid-column: span 2
}

/* Cotización: dos líneas compactas y equilibradas en escritorio. */
.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-operation {
    grid-column: 1 / span 3;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-quote-code {
    grid-column: 4 / span 3;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-document {
    grid-column: 5 / span 4
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-series {
    grid-column: 9 / span 2
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-number {
    grid-column: 11 / span 3
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-issued {
    grid-column: 7 / span 3;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-date {
    grid-column: 10 / span 2;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-delivery {
    grid-column: 12 / span 3;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-currency {
    grid-column: 15 / span 2;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-rate {
    grid-column: 17 / span 2;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-payment {
    grid-column: 19 / span 3;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-warehouse {
    grid-column: 22 / span 3;
    grid-row: 1
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-payment-system {
    grid-column: 1 / span 3;
    grid-row: 2
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-isc {
    grid-column: 4 / span 3;
    grid-row: 2
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-field-quote-code input {
    color: #21557f;
    background: #f2f7fc;
    font-weight: 800;
    letter-spacing: .03em
}

.commercial-full-editor[data-commercial-editor="quote"] .sales-doc-fields-client {
    grid-template-columns: 13ch .75fr 1.6fr 2.6fr 1fr 13ch 1.35fr
}

.commercial-full-editor[data-commercial-editor="order"] .client-orders-layout .sales-doc-fields-client {
    grid-template-columns: 13ch .75fr 1.6fr 2.6fr 1fr 13ch 1.35fr
}

.commercial-full-editor[data-commercial-editor="order"] .client-orders-layout .sales-doc-fields-client>label {
    grid-column: auto
}

/* Orden de Venta: dos filas completas y estables en escritorio. */
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-operation { grid-column: 1 / span 3; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-document { grid-column: 4 / span 4; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-series { grid-column: 8 / span 2; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-number { grid-column: 10 / span 3; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-issued { grid-column: 13 / span 6; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-date { grid-column: 19 / span 4; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-currency { grid-column: 23 / span 2; grid-row: 1 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-payment { grid-column: 1 / span 3; grid-row: 2 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-warehouse { grid-column: 4 / span 4; grid-row: 2 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-delivery { grid-column: 8 / span 6; grid-row: 2 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-payment-system { grid-column: 14 / span 5; grid-row: 2 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-isc { grid-column: 19 / span 3; grid-row: 2 }
.commercial-full-editor[data-commercial-editor="order"] .commercial-field-rate { grid-column: 22 / span 3; grid-row: 2 }

/* La guía directa usa el mismo marco visual, sin campos monetarios de venta. */
.invoice-record-modal.direct-gre-editor {
    height: auto;
    max-height: calc(100dvh - 24px)
}

.direct-gre-editor .invoice-form-scroll {
    flex: 0 1 auto;
    padding-bottom: 30px
}

.direct-gre-editor .invoice-form-scroll>.sales-doc-block {
    order: 0
}

.direct-gre-editor .client-block-title {
    height: 32px;
    min-height: 32px
}

.direct-gre-title-controls {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0
}

.direct-gre-title-document-type {
    margin-left: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #285071;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap
}

.direct-gre-title-document-type select {
    width: 200px;
    height: 30px;
    min-height: 30px;
    padding: 0 20px 0 7px;
    border-radius: 5px;
    font-size: 12px
}

.direct-gre-title-foreign-trade {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #285071;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap
}

.direct-gre-title-foreign-trade select {
    width: 70px;
    height: 30px;
    min-height: 30px;
    padding: 0 20px 0 7px;
    border-radius: 5px;
    font-size: 12px
}

.direct-gre-title-reason {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #285071;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap
}

.direct-gre-title-reason select {
    field-sizing: content;
    width: auto;
    min-width: 112px;
    max-width: 360px;
    height: 30px;
    min-height: 30px;
    padding: 0 20px 0 7px;
    border-radius: 5px;
    font-size: 12px
}

.direct-gre-editor .sales-doc-fields-client {
    grid-template-columns: max-content minmax(260px, 1.45fr) minmax(180px, .85fr) minmax(360px, 2.8fr);
    padding-top: 4px
}

.direct-gre-editor .sales-doc-fields-client .client-name {
    min-width: 260px
}

.direct-gre-editor .direct-gre-destination-point {
    min-width: 0
}

.direct-gre-editor .direct-gre-destination-point select {
    width: 100%
}

.direct-gre-editor .direct-gre-document-type,
.direct-gre-editor .direct-gre-document-type select,
.direct-gre-editor .direct-gre-recipient-reason,
.direct-gre-editor .direct-gre-recipient-reason select,
.direct-gre-editor .direct-gre-customer-document-type,
.direct-gre-editor .direct-gre-customer-document-type select {
    width: max-content;
    max-width: 100%
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 8px 10px;
    align-items: flex-end;
    margin-top: 0
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > label {
    min-width: 0;
    white-space: nowrap
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > label > input,
.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > label > select,
.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields .issue-datetime-control {
    width: 100%;
    max-width: 100%
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .direct-gre-recipient-reason {
    flex: 0 0 auto;
    width: auto
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .direct-gre-recipient-reason > select {
    field-sizing: content;
    width: auto;
    min-width: 112px;
    max-width: 360px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .commercial-field-series {
    flex: 0 0 58px;
    width: 58px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .commercial-field-number {
    flex: 0 0 142px;
    width: 142px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .commercial-field-issued {
    flex: 0 0 190px;
    width: 190px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .commercial-field-transfer-date {
    flex: 0 0 145px;
    width: 145px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .commercial-field-related-document {
    flex: 0 0 128px;
    width: 128px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .commercial-field-warehouse {
    flex: 0 0 118px;
    width: 118px
}

.commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > .direct-gre-origin-point {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: none
}

.direct-gre-editor .customer-block > .client-block-title + div {
    display: flex;
    flex-direction: column
}

.direct-gre-editor .direct-gre-header-orders-layout { order: 1 }
.direct-gre-editor .direct-gre-subsection-title { order: 3 }
.direct-gre-editor .sales-doc-fields-client { order: 4 }
.direct-gre-editor [data-direct-gre-warehouse-catalog] { order: 5 }
.direct-gre-editor .natural-person-fields { order: 6 }

.direct-gre-header-orders-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 10px;
    align-items: stretch
}

.direct-gre-header-details {
    min-width: 0;
    display: flex;
    flex-direction: column
}

.direct-gre-header-details .direct-gre-origin-inline {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.direct-gre-header-details .direct-gre-origin-inline.manual-origin-visible {
    grid-template-columns: repeat(5, minmax(0, 1fr))
}

.direct-gre-header-orders-layout .available-orders-panel {
    margin-bottom: -10px;
    padding: 0 10px 0 0
}

.direct-gre-header-orders-layout .available-orders-table-wrap {
    min-height: 0
}

.commercial-full-editor.direct-gre-editor .direct-gre-header-orders-layout .available-orders-table tr.empty>td:first-child {
    display: table-cell;
    width: auto;
    height: 76px;
    padding: 10px 18px;
    border-bottom: 0;
    vertical-align: middle;
    text-align: center
}

.direct-gre-header-orders-layout .available-orders-table th:last-child,
.direct-gre-header-orders-layout .available-orders-table td:last-child {
    width: 78px;
    text-align: right
}

.direct-gre-origin-inline {
    margin: 0;
    padding: 0px 10px 0px;
    display: grid;
    grid-template-columns: minmax(300px, 1.15fr) minmax(360px, 1.4fr) minmax(320px, 1.6fr) minmax(175px, .65fr);
    gap: 8px 12px;
    align-items: end;
    border: 0;
    border-radius: 0;
    background: #fff
}

.direct-gre-origin-inline.manual-origin-visible {
    grid-template-columns: 185px minmax(135px, 155px) 220px 220px minmax(260px, 1fr);
    gap: 8px 10px
}

.direct-gre-origin-inline .direct-gre-origin-manual-address {
    grid-column: auto;
    min-width: 0
}

.direct-gre-origin-inline > [hidden],
.direct-gre-origin-inline [hidden] {
    display: none !important
}

.direct-gre-origin-inline > label {
    min-width: 0;
    display: grid;
    gap: 4px;
    align-self: end;
    color: #4f687f;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.15
}

.direct-gre-origin-inline > label > input,
.direct-gre-origin-inline > label > select {
    width: 100%;
    height: 33px;
    min-height: 33px;
    padding: 3px 2px;
    border: 1px solid #c8d8e8;
    border-radius: 6px;
    color: #173f66;
    background: #fff;
    font-size: 12px;
    font-weight: 600
}

.direct-gre-origin-inline > label > input:focus,
.direct-gre-origin-inline > label > select:focus,
.direct-gre-ruc-lookup input:focus {
    border-color: #2d7fc4;
    box-shadow: 0 0 0 2px rgba(45, 127, 196, .12);
    outline: 0
}

.direct-gre-origin-inline > label:last-of-type {
    white-space: nowrap
}

.direct-gre-origin-inline .direct-gre-origin-name {
    position: relative
}

.direct-gre-origin-inline .direct-gre-origin-name small {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1;
    margin-top: 2px;
    color: #2c7b61;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap
}

.direct-gre-origin-inline .direct-gre-origin-name small:empty {
    display: none
}

@media(max-width:1200px) {
    .direct-gre-origin-inline {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .direct-gre-origin-inline.manual-origin-visible {
        grid-template-columns: 185px minmax(125px, 145px) 205px 205px minmax(220px, 1fr)
    }
}

@media(max-width:980px) {
    .direct-gre-origin-inline.manual-origin-visible {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .direct-gre-origin-inline.manual-origin-visible .direct-gre-origin-manual-address {
        grid-column: 1 / -1
    }
}

@media(max-width:760px) {
    .commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields {
        display: grid;
        grid-template-columns: minmax(0, 1fr)
    }

    .commercial-full-editor.direct-gre-editor[data-commercial-editor="guide"] .direct-gre-header-fields > label {
        width: 100%;
        min-width: 0
    }

    .direct-gre-origin-inline {
        grid-template-columns: minmax(0, 1fr)
    }

    .direct-gre-origin-inline.manual-origin-visible {
        grid-template-columns: minmax(0, 1fr)
    }

    .direct-gre-origin-inline.manual-origin-visible .direct-gre-origin-manual-address {
        grid-column: auto
    }
}

.direct-gre-subsection-title {
    margin: 10px 0 7px;
    padding: 6px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #c8d7e4;
    color: #174f83;
    background: #f3f7fa;
    font-size: 12px;
    font-weight: 800
}

.direct-gre-editor .client-block-title>.guide-load-order-button {
    height: 30px;
    min-height: 30px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #126fc3;
    border-radius: 6px;
    color: #fff;
    background: #1678cf;
    font-size: 9px;
    font-weight: 750;
    transform: none
}

.direct-gre-editor .client-block-title>.guide-load-order-button:disabled {
    cursor: not-allowed;
    opacity: .5
}

.direct-gre-editor [hidden] {
    display: none !important
}

.direct-gre-editor .modal-actionbar {
    align-items: center;
    gap: 8px;
    padding: 6px 10px 6px 14px
}

.direct-gre-editor .modal-context {
    min-width: 0;
    flex: 1 1 680px;
    gap: 10px;
    margin-right: 8px
}

.direct-gre-editor .modal-context>[data-editor-context] {
    max-width: 170px;
    padding: 6px 10px;
    flex: 0 0 auto;
    overflow: hidden;
    border: 1px solid #d9e4ef;
    border-radius: 999px;
    color: #61758a;
    background: #f7f9fc;
    font-size: 10px;
    font-weight: 750;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap
}

.direct-gre-context-tablist {
    min-width: 0;
    display: flex;
    align-self: stretch;
    align-items: center;
    flex: 1 1 auto;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: thin
}

.direct-gre-context-tab {
    width: max-content;
    min-width: max-content;
    min-height: 42px;
    padding: 5px 9px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #60728a;
    background: transparent;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.15;
    text-align: left;
    cursor: pointer;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease
}

.direct-gre-context-tab>b {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid #cdd9e6;
    border-radius: 50%;
    color: #60758b;
    background: #fff;
    font-size: 10px
}

.direct-gre-context-tab>[data-direct-gre-tab-label] {
    min-width: 0;
    color: inherit;
    font-size: inherit;
    line-height: inherit;
    white-space: nowrap
}

.direct-gre-context-tab:hover {
    color: #1769d8;
    background: #f2f7ff
}

.direct-gre-context-tab.active {
    border-color: #c8dcf8;
    color: #1464cf;
    background: #edf5ff;
    box-shadow: inset 0 -2px #176fe5
}

.direct-gre-context-tab.active>b {
    color: #fff;
    background: #176fe5;
    border-color: #176fe5
}

.direct-gre-context-tab:disabled,
.direct-gre-context-tab:disabled:hover {
    cursor: not-allowed;
    opacity: .48;
    color: #8192a6;
    background: #f3f6f9;
    border-color: #dce4ec;
    box-shadow: none;
}

.direct-gre-context-tab[hidden] {
    display: none;
}

.direct-gre-group-title {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 8px 10px 6px;
    margin: 2px 0 0;
    border-bottom: 1px solid #dbe6f1;
    color: #164e86;
}

.direct-gre-group-title strong {
    font-size: 11px;
    letter-spacing: .035em;
}

.direct-gre-group-title span {
    color: #73889d;
    font-size: 10px;
    font-weight: 600;
}

.direct-gre-tab-panels {
    min-height: 74px;
    background: #fff
}

.direct-gre-detached-tab-panels {
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid #c9d9e8;
    border-radius: 9px;
    box-shadow: 0 2px 8px #183b600a
}

.direct-gre-tab-panel {
    padding: 11px 10px 12px
}

.direct-gre-tab-panel.sales-doc-block {
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none
}

.direct-gre-additional-panel>.sales-doc-block {
    margin: 0 0 9px
}

.direct-gre-additional-panel>.sales-doc-block:last-child {
    margin-bottom: 0
}

.direct-gre-context-tab:focus-visible {
    outline: 2px solid #1769e0;
    outline-offset: 1px
}

.direct-gre-fields {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px 10px;
    align-items: end
}

.direct-gre-fields .direct-gre-address {
    grid-column: span 2
}

.direct-gre-fields .direct-gre-wide {
    grid-column: span 2
}

.direct-gre-carrier-identity-row {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 148px minmax(190px, .85fr) 168px 172px minmax(260px, 1.35fr);
    gap: 10px;
    align-items: end;
    min-width: 0
}

.direct-gre-carrier-identity-row>label {
    min-width: 0
}

.direct-gre-public-carrier-row,
.direct-gre-vehicle-driver-row {
    grid-column: 1 / -1;
    display: grid;
    gap: 10px;
    align-items: end;
    justify-content: start;
    min-width: 0
}

.direct-gre-public-carrier-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%
}

.direct-gre-vehicle-driver-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    width: 100%
}

.direct-gre-public-carrier-row>label,
.direct-gre-vehicle-driver-row>label {
    min-width: 0
}

.direct-gre-public-carrier-row>.checkbox-field {
    grid-column: 1 / -1;
    width: max-content;
    max-width: 100%;
    min-height: 34px;
    margin: 0;
    padding: 7px 11px
}

.direct-gre-asset-fields {
    min-width: 0;
    padding: 10px;
    border: 1px solid #dbe5ef;
    border-radius: 8px;
    background: #fbfdff
}

.direct-gre-asset-fields>strong {
    display: block;
    margin-bottom: 8px;
    color: #3d607e;
    font-size: 10px;
    letter-spacing: .035em
}

.direct-gre-asset-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    align-items: end
}

.direct-gre-extra-assets {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 2px;
    border: 1px solid #dbe5ef;
    border-radius: 8px;
    background: #fbfdff
}

.direct-gre-ruc-lookup {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
    align-items: stretch
}

.direct-gre-ruc-lookup input {
    min-width: 0;
    width: 100%;
    height: 33px;
    min-height: 33px;
    padding: 3px 8px;
    border: 1px solid #c8d8e8;
    border-radius: 6px;
    color: #173f66;
    background: #fff;
    font-size: 12px;
    font-weight: 600
}

.direct-gre-ruc-lookup button {
    flex: 0 0 auto;
    height: 33px;
    min-height: 33px;
    padding: 0 14px;
    border: 1px solid #1769aa;
    border-radius: 6px;
    color: #17609a;
    background: #eef7fd;
    font-size: 11px;
    font-weight: 800
}

[data-direct-gre-origin-ruc-status] {
    min-height: 14px;
    margin-top: 3px;
    display: block;
    color: #16805c;
    font-size: 10px;
    font-weight: 750
}

.direct-gre-editor .checkbox-field {
    min-height: 33px;
    padding: 5px 8px;
    display: flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #d6e0eb;
    border-radius: 7px;
    color: #47617a;
    background: #f8fafc;
    line-height: 1.2
}

.direct-gre-editor .checkbox-field input {
    width: 15px;
    height: 15px;
    min-height: 0;
    margin: 0;
    accent-color: #1769e0
}

.direct-gre-lines {
    min-width: 1080px
}

.direct-gre-editor.carrier-goods-visible .direct-gre-lines {
    min-width: 1380px
}

.direct-gre-line-totals {
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
    align-self: stretch;
    gap: 8px;
    padding: 0
}

.direct-gre-line-totals span {
    min-width: 112px;
    padding: 7px 9px 6px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid #d6e0eb;
    border-radius: 7px;
    color: #60758a;
    background: #f8fafc;
    font-size: 10px
}

.direct-gre-line-totals strong {
    display: block;
    margin-top: auto;
    color: #173f70;
    font-size: 12px;
    text-align: right
}

.sales-doc-detail table.direct-gre-lines th:nth-child(1) { width: 3% }
.sales-doc-detail table.direct-gre-lines th:nth-child(2) { width: 10% }
.sales-doc-detail table.direct-gre-lines th:nth-child(3) { width: 25% }
.sales-doc-detail table.direct-gre-lines th:nth-child(4) { width: 5% }
.sales-doc-detail table.direct-gre-lines th:nth-child(5) { width: 8% }
.sales-doc-detail table.direct-gre-lines th:nth-child(6) { width: 7% }
.sales-doc-detail table.direct-gre-lines th:nth-child(7) { width: 7% }
.sales-doc-detail table.direct-gre-lines th:nth-child(8) { width: 8% }
.sales-doc-detail table.direct-gre-lines th:nth-child(9) { width: 8% }
.sales-doc-detail table.direct-gre-lines th:nth-child(10) { width: 8% }
.sales-doc-detail table.direct-gre-lines th:nth-child(11) { width: 8% }

.direct-gre-origin-document-control {
    display: grid;
    grid-template-columns: minmax(88px, .8fr) minmax(120px, 1.2fr);
    gap: 3px
}

.direct-gre-origin-document-control [data-field="origin_document_issuer_ruc"] {
    grid-column: 1 / -1
}

.sales-doc-detail table.direct-gre-lines th:last-child,
.sales-doc-detail table.direct-gre-lines td:last-child {
    width: 3%;
    min-width: 32px;
    padding-right: 2px;
    padding-left: 2px;
    text-align: center
}

.sales-doc-detail table.direct-gre-lines button[data-commercial-remove-line] {
    width: 24px;
    height: 24px;
    margin: 0 auto;
    padding: 0;
    display: inline-grid;
    place-items: center;
    line-height: 1
}

.direct-gre-summary {
    grid-template-columns: minmax(0, 1fr) auto
}

.direct-gre-summary .invoice-notes {
    grid-column: auto
}

.sales-doc-detail .invoice-summary.direct-gre-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: stretch
}

.sales-doc-detail .invoice-summary.direct-gre-summary .invoice-notes {
    min-width: 0;
    margin-bottom: 0
}

@media(max-width:900px) {
    .sales-doc-detail .invoice-summary.direct-gre-summary {
        grid-template-columns: minmax(0, 1fr)
    }

    .sales-doc-detail .invoice-summary.direct-gre-summary .direct-gre-line-totals {
        flex-wrap: wrap
    }
}

.commercial-full-editor[data-commercial-editor="quote"] [data-commercial-exchange-rate] {
    text-align: right;
    font-variant-numeric: tabular-nums
}

.commercial-full-editor .sales-doc-fields input[readonly] {
    color: #536a82;
    background: #f7f9fc
}

.commercial-full-editor .sales-doc-block-title {
    background: linear-gradient(90deg, #eaf3fc, #f4f8fc)
}

.commercial-full-editor .sales-doc-detail .detail-title {
    min-height: 40px
}

.commercial-full-editor .available-orders-table-wrap {
    min-height: 99px;
    border-color: #cbdbea;
    box-shadow: inset 0 1px 2px #1737600a
}

.commercial-full-editor .available-orders-table td:first-child {
    display: flex;
    flex-wrap: wrap;
    gap: 3px
}

.commercial-full-editor .available-orders-table td:first-child button {
    min-height: 23px;
    padding: 3px 6px;
    border: 1px solid #bfd5ec;
    border-radius: 5px;
    color: #155ea9;
    background: #eff6ff;
    font-size: 8px;
    font-weight: 800
}

@media(max-width:1180px) {

    .direct-gre-editor .modal-actionbar {
        flex-wrap: wrap
    }

    .direct-gre-editor .client-block-title {
        height: auto;
        flex-wrap: wrap
    }

    .direct-gre-title-controls {
        flex: 1 1 auto;
        flex-wrap: wrap;
        justify-content: flex-end
    }

    .direct-gre-editor .modal-context {
        order: -1;
        flex-basis: 100%;
        margin-right: 0
    }

    .commercial-full-editor[data-commercial-editor="quote"] .sales-doc-fields-main,
    .commercial-full-editor[data-commercial-editor="order"] .sales-doc-fields-main,
    .commercial-full-editor[data-commercial-editor="guide"] .sales-doc-fields-main {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .commercial-full-editor .commercial-field-operation,
    .commercial-full-editor .commercial-field-document,
    .commercial-full-editor .commercial-field-payment {
        grid-column: span 4
    }

    .commercial-full-editor .commercial-field-quote-code {
        grid-column: span 5
    }

    .commercial-full-editor .commercial-field-series {
        grid-column: span 2
    }

    .commercial-full-editor .commercial-field-number {
        grid-column: span 3
    }

    .commercial-full-editor .commercial-field-issued,
    .commercial-full-editor .commercial-field-date,
    .commercial-full-editor .commercial-field-warehouse,
    .commercial-full-editor .commercial-field-isc {
        grid-column: span 3
    }

    .commercial-full-editor .commercial-field-currency,
    .commercial-full-editor .commercial-field-rate {
        grid-column: span 2
    }

    .commercial-full-editor .commercial-field-delivery,
    .commercial-full-editor .commercial-field-payment-system {
        grid-column: span 4
    }

    .commercial-full-editor[data-commercial-editor="quote"] .sales-doc-fields-main>label {
        grid-column-start: auto;
        grid-row: auto
    }

    .commercial-full-editor[data-commercial-editor="order"] .sales-doc-fields-main>label {
        grid-column: auto;
        grid-row: auto
    }

    .direct-gre-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .direct-gre-carrier-identity-row {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .direct-gre-public-carrier-row {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .direct-gre-vehicle-driver-row {
        grid-template-columns: minmax(0, 1fr)
    }

    .direct-gre-asset-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .direct-gre-carrier-identity-row>label:last-child {
        grid-column: 1 / -1
    }
}

@media(max-width:760px) {

    .direct-gre-editor .modal-actionbar {
        overflow-x: visible
    }

    .direct-gre-editor .modal-context {
        align-items: stretch
    }

    .direct-gre-editor .modal-context>[data-editor-context] {
        display: none
    }

    .commercial-full-editor[data-commercial-editor="quote"] .sales-doc-fields-main,
    .commercial-full-editor[data-commercial-editor="order"] .sales-doc-fields-main,
    .commercial-full-editor[data-commercial-editor="guide"] .sales-doc-fields-main,
    .commercial-full-editor[data-commercial-editor="quote"] .sales-doc-fields-client,
    .commercial-full-editor[data-commercial-editor="order"] .client-orders-layout .sales-doc-fields-client,
    .commercial-full-editor[data-commercial-editor="guide"] .sales-doc-fields-client,
    .direct-gre-fields {
        grid-template-columns: minmax(0, 1fr)
    }

    .commercial-full-editor .sales-doc-fields-main>label,
    .commercial-full-editor .sales-doc-fields-client>label {
        grid-column: auto
    }

    .direct-gre-fields .direct-gre-address,
    .direct-gre-fields .direct-gre-wide {
        grid-column: auto
    }

    .direct-gre-carrier-identity-row {
        grid-template-columns: minmax(0, 1fr)
    }

    .direct-gre-public-carrier-row,
    .direct-gre-vehicle-driver-row {
        grid-template-columns: minmax(0, 1fr);
        width: 100%
    }

    .direct-gre-asset-grid {
        grid-template-columns: minmax(0, 1fr)
    }

    .direct-gre-carrier-identity-row>label:last-child {
        grid-column: auto
    }
}

.modal-tool:not(:disabled) {
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, color .16s ease, background-color .16s ease, border-color .16s ease
}

.modal-tool:not(:disabled):hover {
    transform: translateY(-2px);
    box-shadow: 0 7px 16px #17376024
}

.modal-tool:not(:disabled):active {
    transform: translateY(0);
    box-shadow: 0 2px 6px #1737601c
}

.modal-tool:focus-visible {
    outline: 2px solid #1769e0;
    outline-offset: 2px
}

.modal-tool:disabled {
    cursor: not-allowed;
    opacity: .58
}

.modal-tool.tool-cancel.close-modal {
    width: auto;
    height: auto;
    padding: 6px 9px;
    border: 1px solid #fac7cc;
    border-radius: 9px;
    color: #cf3d49;
    background: #fff1f2;
    font-size: 9px
}

.record-modal>header>.close-modal {
    cursor: pointer;
    transition: color .16s ease, background .16s ease, box-shadow .16s ease
}

.record-modal>header>.close-modal:hover {
    color: #cf3d49;
    background: #fff1f2;
    box-shadow: 0 5px 12px #17376018
}

.modal-tool.tool-new:not(:disabled):hover {
    color: #fff;
    background: #7858d7;
    border-color: #7858d7
}

.modal-tool.tool-save:not(:disabled):hover {
    color: #fff;
    background: #238879;
    border-color: #238879
}

.modal-tool.tool-emit:not(:disabled):hover {
    color: #fff;
    background: #248579;
    border-color: #248579
}

.modal-tool.tool-cancel:not(:disabled):hover {
    color: #fff;
    background: #cf3d49;
    border-color: #cf3d49
}

.modal-tool.tool-annul:not(:disabled):hover {
    color: #fff;
    background: #c95062;
    border-color: #c95062
}

.modal-tool.tool-print:not(:disabled):hover {
    color: #fff;
    background: #1775a4;
    border-color: #1775a4
}

.modal-tool.tool-advance:not(:disabled):hover,
.modal-tool.tool-copy:not(:disabled):hover {
    color: #fff;
    background: #a65d18;
    border-color: #a65d18
}

/* Detalle de venta: misma lectura visual y densidad que Contabilidad y Finanzas. */
.sales-doc-detail {
    overflow: hidden;
    border: 1px solid #d7e2ee;
    border-radius: 8px
}

.sales-doc-detail .detail-title {
    min-height: 50px;
    padding: 7px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    background: #fff
}

.sales-doc-detail .detail-title>div {
    display: grid;
    gap: 2px
}

.sales-doc-detail .detail-title>div>strong {
    color: #153d66;
    font-size: 13px
}

.sales-doc-detail .detail-title>div>span {
    color: #8092a6;
    font-size: 10px
}

.sales-doc-detail .sales-detail-tabs {
    margin-left: auto;
    margin-right: 8px
}

.sales-doc-detail .sales-detail-tabs button.active {
    color: #fff;
    background: #147bb4
}

.sales-doc-detail .invoice-table-wrap {
    height: 198px;
    overflow: auto;
    scrollbar-gutter: stable
}

.sales-doc-detail .invoice-lines {
    min-width: calc(1480px - 0.5cm);
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0
}

.sales-doc-detail .invoice-lines thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 8px 7px;
    color: #f7ffff;
    background: #10858b;
    border-right: 1px solid #ffffff70;
    border-bottom: 1px solid #086c71;
    font-size: 10px;
    text-align: left;
    text-transform: uppercase
}

.sales-doc-detail .invoice-lines tbody td {
    height: 33px;
    padding: 2px 5px;
    color: #536c86;
    background: #f8fafc;
    border-right: 1px solid #e0e8f1;
    border-bottom: 1px solid #dce5ef;
    font-size: 11px;
    font-weight: 650
}

.sales-doc-detail .invoice-lines th:first-child,
.sales-doc-detail .invoice-lines td:first-child {
    text-align: left
}

.sales-doc-detail .invoice-lines tbody tr:nth-child(even) td {
    background: #f3f7fa
}

.sales-doc-detail .invoice-lines input,
.sales-doc-detail .invoice-lines select {
    width: 100%;
    min-width: 0;
    height: 26px;
    min-height: 22px;
    padding: 0 2px;
    line-height: 20px;
    color: #3d5875;
    background: #fbfdff;
    border: 1px solid #cbd9e8;
    border-radius: 6px;
    font-size: 11px;
    box-sizing: border-box
}

.sales-doc-detail .invoice-lines input:focus,
.sales-doc-detail .invoice-lines select:focus {
    border-color: #168b91;
    box-shadow: 0 0 0 2px #168b9118;
    outline: 0
}

.sales-doc-detail .invoice-lines input[data-numeric] {
    padding-left: 4px;
    padding-right: 4px;
    text-align: right;
    font-variant-numeric: tabular-nums
}

.sales-doc-detail .invoice-lines input[data-field="product_code"] {
    text-transform: uppercase
}

.sales-doc-detail .invoice-lines input[data-field="product_code"]::placeholder {
    text-transform: none
}

.sales-doc-detail .invoice-lines input[data-field="description"][readonly] {
    color: #3d5875;
    background: #fbfdff
}

.sales-doc-detail .invoice-lines input[data-field="stock"][readonly],
.sales-doc-detail .invoice-lines input[data-field="perception_rate"][readonly] {
    color: #3d5875;
    background: #f4f7fb;
    cursor: default
}

.sales-doc-detail .invoice-lines td:has(>input[data-numeric]) {
    padding-left: 0;
    padding-right: 0
}

.sales-doc-detail .invoice-lines th:nth-child(1) {
    width: 38px
}

.sales-doc-detail .invoice-lines th:nth-child(2) {
    width: calc(120px - 0.5cm)
}

.sales-doc-detail .invoice-lines th:nth-child(3) {
    width: 330px
}

.sales-doc-detail .invoice-lines th:nth-child(4) {
    width: 62px
}

.sales-doc-detail .invoice-lines th:nth-child(5) {
    width: 85px
}

.sales-doc-detail .invoice-lines th:nth-child(6) {
    width: 82px
}

.sales-doc-detail .invoice-lines th:nth-child(7) {
    width: 96px
}

.sales-doc-detail .invoice-lines th:nth-child(8),
.sales-doc-detail .invoice-lines th:nth-child(9) {
    width: 76px
}

.sales-doc-detail .invoice-lines th:nth-child(10) {
    width: 70px
}

.sales-doc-detail .invoice-lines th:nth-child(11),
.sales-doc-detail .invoice-lines th:nth-child(13) {
    width: 105px
}

.sales-doc-detail .invoice-lines th:nth-child(12) {
    width: 75px
}

.sales-doc-detail .invoice-lines th:nth-child(14) {
    width: 94px
}

.sales-doc-detail .invoice-lines th:nth-child(15) {
    width: 94px
}

.sales-column-resizer {
    position: absolute;
    z-index: 4;
    top: 0;
    right: -4px;
    width: 9px;
    height: 100%;
    cursor: col-resize;
    touch-action: none
}

.sales-column-resizer::after {
    content: "";
    position: absolute;
    top: 18%;
    bottom: 18%;
    left: 4px;
    width: 1px;
    background: #ffffff80
}

.sales-column-resizer:hover::after,
.resizing-sales-column .sales-column-resizer::after {
    width: 2px;
    background: #fff
}

.sales-doc-detail #add-line {
    height: 28px;
    min-height: 28px;
    padding: 0 10px
}

.resizing-sales-column {
    cursor: col-resize;
    user-select: none
}

.sales-doc-detail .invoice-lines td[data-line-subtotal],
.sales-doc-detail .invoice-lines td[data-line-tax],
.sales-doc-detail .invoice-lines td[data-line-total] {
    color: #294a6d;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
    overflow: hidden
}

.sales-doc-detail .invoice-lines button[data-remove-line] {
    width: 24px;
    height: 24px;
    padding: 0;
    color: #d63f52;
    background: #fff0f2;
    border: 1px solid #ffcbd2;
    border-radius: 7px
}

.sales-doc-detail .invoice-lines button[data-remove-line] svg {
    width: 14px;
    height: 14px;
    margin: auto;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round
}

.sales-doc-detail .invoice-summary {
    padding: 4px 10px 6px;
    display: block;
    background: #f7f9fc;
    border-top: 1px solid #cbd8e8;
    box-shadow: 0 -6px 16px #1737600d
}

.sales-doc-detail .invoice-notes {
    margin-bottom: 3px;
    display: grid;
    grid-template-columns: 100px 1fr;
    align-items: center;
    font-size: 11px;
    font-weight: 700
}

.sales-doc-detail .invoice-notes textarea {
    height: calc(38px + 0.5cm);
    min-height: calc(38px + 0.5cm);
    resize: vertical
}

.sales-doc-detail .invoice-totals {
    display: grid;
    grid-template-columns: repeat(6, minmax(155px, 1fr));
    gap: 0
}

.sales-doc-detail .invoice-totals p,
.sales-doc-detail .invoice-totals p.total {
    min-height: 24px;
    margin: 0;
    padding: 0;
    display: grid;
    grid-column: auto;
    grid-template-columns: 1fr 1fr;
    color: #53677e;
    background: #fff;
    border: 1px solid #d9e2ed;
    border-radius: 0;
    font-size: 11px
}

.sales-doc-detail .invoice-totals span,
.sales-doc-detail .invoice-totals strong {
    padding: 3px 7px;
    display: flex;
    align-items: center
}

.sales-doc-detail .invoice-totals span {
    background: #eef3f8;
    border-right: 1px solid #d9e2ed
}

.sales-doc-detail .invoice-totals strong {
    justify-content: flex-end;
    color: #183653;
    font-variant-numeric: tabular-nums
}

.sales-doc-detail .invoice-totals p.total {
    color: #0865e8;
    border-color: #8bb6f3
}

.sales-doc-detail .invoice-totals p.total strong {
    color: #0865e8
}

.product-search-results {
    position: fixed;
    z-index: 520;
    max-width: calc(100vw - 16px);
    max-height: 280px;
    padding: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    color: #314d69;
    background: #fff;
    border: 1px solid #cbd8e7;
    border-radius: 9px;
    box-shadow: 0 12px 32px #102a4460
}

.product-search-results[hidden] {
    display: none
}

.product-search-results .product-search-header,
.product-search-results button {
    width: 100%;
    display: grid;
    grid-template-columns: 90px minmax(150px, 1fr) 56px 76px 76px 86px;
    gap: 6px;
    align-items: center
}

.product-search-results .product-search-header {
    position: sticky;
    top: -5px;
    z-index: 1;
    padding: 8px 9px 7px;
    color: #405b76;
    background: #eef3f8;
    border-bottom: 1px solid #cbd8e7;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .025em;
    text-transform: uppercase
}

.product-search-results .product-search-header span:nth-child(3) {
    text-align: center
}

.product-search-results .product-search-header span:nth-child(n+4) {
    text-align: right
}

.product-search-results .product-search-header span:last-child,
.product-search-results .product-stock {
    padding-right: 4px
}

.product-search-results button {
    padding: 7px 9px;
    color: #314d69;
    background: #fff;
    border: 0;
    border-radius: 6px;
    text-align: left;
    cursor: pointer
}

.product-search-results button:hover,
.product-search-results button:focus,
.product-search-results button.active {
    background: #edf6ff;
    outline: 0
}

.product-search-results strong {
    color: #1764ad;
    font-size: 11px
}

.product-search-results span {
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.product-search-results .product-unit,
.product-search-results .product-price,
.product-search-results .product-reserved,
.product-search-results .product-stock {
    color: #526c86;
    font-variant-numeric: tabular-nums;
    text-align: right
}

.product-search-results .product-unit {
    text-align: center
}

.product-search-results .product-search-empty {
    display: block;
    padding: 10px;
    color: #76879a;
    font-size: 11px
}

@media(max-width:1100px) {
    .tax-summary-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .hydrobiological-fields,
    .passenger-transport-fields,
    .cargo-transport-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .client-orders-layout .sales-doc-fields-client {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .sales-doc-detail .invoice-totals {
        grid-template-columns: repeat(3, minmax(145px, 1fr))
    }
}

@media(max-width:760px) {
    .document-form-tabs {
        align-items: stretch;
        flex-direction: column
    }

    .document-form-tabs button {
        text-align: left
    }

    .tax-summary-fields {
        grid-template-columns: minmax(0, 1fr)
    }

    .hydrobiological-fields,
    .passenger-transport-fields,
    .cargo-transport-fields {
        grid-template-columns: minmax(0, 1fr)
    }

    .client-orders-layout .sales-doc-fields-client {
        grid-template-columns: minmax(0, 1fr)
    }

    .client-orders-layout .sales-doc-fields-client .client-name,
    .client-orders-layout .sales-doc-fields-client .client-address {
        grid-column: auto
    }

    .sales-doc-detail .detail-title {
        align-items: stretch
    }

    .sales-doc-detail .detail-title>div {
        flex: 1 0 100%
    }

    .sales-doc-detail .sales-detail-tabs {
        margin-left: 0;
        margin-right: auto
    }

    .sales-doc-detail .invoice-totals {
        grid-template-columns: minmax(0, 1fr)
    }
}

.notice-banner {
    margin: 12px 24px 0;
    padding: 11px 14px;
    border: 1px solid #bfd8ff;
    border-radius: 10px;
    background: #eff6ff;
    color: #174a86;
    font-size: 13px
}

.notice-banner strong {
    margin-right: 4px
}

/* Encabezados finales: neutralidad visual de Contabilidad y Finanzas. */
.sales-doc-detail .invoice-lines thead th,
.sales-doc-detail .installment-table thead th,
.available-orders-table thead th {
    color: #17202b;
    background: #d9dee5;
    border-right-color: #bcc5cf;
    border-bottom-color: #aeb8c3;
}

.sales-doc-detail .invoice-lines thead th .sales-column-resizer::after {
    background: #64748b80
}

.workflow-path {
    padding: 7px 10px;
    color: #1769e0;
    background: #eaf2ff;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 750
}

.order-workflow-heading-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap
}

.order-workflow-heading-actions .primary {
    white-space: nowrap
}

.quote-control>header>.primary:not(:disabled),
.order-workflow-heading-actions .primary:not(:disabled) {
    cursor: pointer;
    transition: transform .16s ease, background .16s ease, box-shadow .16s ease
}

.quote-control>header>.primary:not(:disabled):hover,
.order-workflow-heading-actions .primary:not(:disabled):hover {
    color: #fff;
    background: #105fc8;
    box-shadow: 0 7px 16px rgba(16, 95, 200, .28);
    transform: translateY(-1px)
}

.note-command-bar {
    border-color: #d8d0f6;
    background: linear-gradient(135deg, #fff 0%, #faf8ff 100%)
}

.note-command-bar>div:first-child>span {
    color: #6842c2
}

@media (max-width: 980px) {
    .order-workflow-heading-actions {
        width: 100%;
        justify-content: flex-start
    }
}

.sales-flow-hub {
    margin-bottom: 16px;
    padding: 18px;
    border: 1px solid #d8e3f0;
    border-radius: 14px;
    background: linear-gradient(135deg, #fff 0%, #f6f9fe 100%);
    box-shadow: 0 8px 24px #17385e0a
}

.sales-flow-hub>header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px
}

.sales-flow-hub h2 { margin: 2px 0 3px; font-size: 18px }
.sales-flow-hub p { margin: 0; color: #697b91; font-size: 13px }
.sales-flow-eyebrow { color: #1769e0; font-size: 10px; font-weight: 800; letter-spacing: .12em }
.sales-flow-integrity { padding: 7px 10px; border-radius: 999px; background: #e7f8f0; color: #08774d; font-size: 11px; font-weight: 750; white-space: nowrap }
.sales-flow-tools { display: flex; flex-direction: column; align-items: flex-end; gap: 8px }

.sales-route-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px }
.sales-route { display: grid; gap: 4px; min-height: 108px; padding: 13px; border: 1px solid #dce5ef; border-radius: 11px; color: #18324f; background: #fff; text-decoration: none; transition: border-color .16s, transform .16s, box-shadow .16s }
.sales-route:hover { transform: translateY(-1px); border-color: #8ab9f8; box-shadow: 0 8px 18px #1d65c312 }
.sales-route.active { border-color: #1769e0; box-shadow: inset 0 0 0 1px #1769e0 }
.sales-route-size { color: #1769e0; font-size: 9px; font-weight: 850; letter-spacing: .1em }
.sales-route strong { font-size: 14px }
.sales-route small { color: #6f8094; line-height: 1.35 }
.sales-route b { align-self: end; color: #1769e0; font-size: 11px }

.sales-flow-steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 8px; margin-top: 12px }
.sales-flow-steps a { display: flex; align-items: center; gap: 9px; padding: 9px 11px; border-radius: 10px; color: #263e59; text-decoration: none }
.sales-flow-steps a[aria-current="step"] { background: #eaf2ff; color: #105fc8 }
.sales-flow-steps i { display: grid; flex: 0 0 25px; height: 25px; place-items: center; border-radius: 50%; background: #e7edf5; font-style: normal; font-size: 11px; font-weight: 800 }
.sales-flow-steps a[aria-current="step"] i { color: #fff; background: #1769e0 }
.sales-flow-steps span span { display: grid }
.sales-flow-steps strong { font-size: 12px }
.sales-flow-steps small { color: #75869a; font-size: 10px }
.sales-flow-arrow { color: #9cabbc }
.commercial-next-action { margin-bottom: 5px }
.commercial-next-action span { display: inline-block; padding: 3px 7px; border-radius: 999px; color: #155e9d; background: #eaf4ff; font-size: 10px; font-weight: 750; white-space: nowrap }

.quote-control {
    margin-bottom: 18px
}

.quote-control>header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px
}

.quote-control-eyebrow { display: block; margin-bottom: 3px; color: #1769e0; font-size: 9px; font-weight: 850; letter-spacing: .13em }
.quote-control h2 { margin: 0 0 3px; color: #173757; font-size: 19px; letter-spacing: -.01em }
.quote-control p { margin: 0; color: #697b91; font-size: 12px }
.quote-control-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px }
.quote-control-card {
    --quote-accent: #1769e0;
    position: relative;
    display: grid;
    align-content: center;
    gap: 6px;
    min-width: 0;
    min-height: 106px;
    padding: 18px 18px 16px;
    overflow: hidden;
    border: 1px solid #d8e2ed;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(23, 56, 94, .055)
}
.quote-control-card::before { position: absolute; inset: 0 18px auto; height: 3px; border-radius: 0 0 4px 4px; background: var(--quote-accent); content: "" }
.quote-control-card::after { content: none }
.quote-control-card small { color: #526a82; font-size: 9px; font-weight: 850; letter-spacing: .1em; line-height: 1.25 }
.quote-control-card strong { color: #173757; font-size: 29px; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: -.025em; line-height: 1 }
.quote-control-card span { overflow: hidden; color: #708298; font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap }
.quote-control-draft { --quote-accent: #718198 }
.quote-control-sent { --quote-accent: #d88a13 }
.quote-control-approved { --quote-accent: #11946a }
.quote-control-generated { --quote-accent: #1769e0 }
.quote-control-expired { --quote-accent: #d84f5f }
.order-control-total { --quote-accent: #1769e0 }
.order-control-pending { --quote-accent: #d88a13 }
.order-control-progress { --quote-accent: #7c5ce5 }
.order-control-attended { --quote-accent: #138a72 }
.order-control-ready { --quote-accent: #1684c5 }
.order-control-billed { --quote-accent: #11946a }

@media (max-width: 900px) {
    .sales-route-grid { grid-template-columns: 1fr }
    .sales-flow-steps { grid-template-columns: 1fr }
    .sales-flow-arrow { display: none }
    .sales-flow-hub>header { display: grid }
    .sales-flow-tools { align-items: flex-start }
    .quote-control-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) }
}

@media (max-width: 520px) {
    .quote-control>header { display: grid }
    .quote-control-grid { grid-template-columns: 1fr }
}

.inventory-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px
}

.inventory-kpis article {
    display: grid;
    gap: 4px;
    padding: 15px 17px;
    border: 1px solid #dce5ef;
    border-radius: 12px;
    background: #fff
}

.inventory-kpis small { color: #6c7f95; font-size: 10px; font-weight: 800; letter-spacing: .08em }
.inventory-kpis strong { color: #123b68; font-size: 23px }
.inventory-kpis span { color: #7c8da0; font-size: 11px }
.inventory-layout { display: grid; gap: 16px }
.inventory-stock-card header input { width: min(280px, 100%); padding: 9px 11px; border: 1px solid #d5dfeb; border-radius: 8px }
.inventory-stock-table { min-width: 720px }
.inventory-ledger-card table { min-width: 1120px }
.inventory-ledger-card td small { display: block; margin-top: 2px; color: #7a8b9e }
.inventory-movement { display: inline-block; padding: 4px 7px; border-radius: 999px; color: #12623f; background: #e7f8ef; font-size: 10px; font-weight: 750; white-space: nowrap }
.inventory-movement-sale, .inventory-movement-adjustment_out { color: #9b3b26; background: #fff0eb }
.inventory-modal { width: min(760px, calc(100vw - 30px)) }
.compact-record-modal { width: min(520px, calc(100vw - 30px)) }
.inventory-form-body { padding: 18px 22px }
.inventory-form-help { margin: 0 0 15px; padding: 10px 12px; border-radius: 8px; color: #315f8e; background: #eef6ff; font-size: 12px }
.inventory-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px }
.inventory-form-grid label { display: grid; gap: 6px; color: #42566c; font-size: 11px; font-weight: 700 }
.inventory-form-grid label.wide { grid-column: 1 / -1 }
.inventory-form-grid input, .inventory-form-grid select, .inventory-form-grid textarea { width: 100%; padding: 10px; border: 1px solid #ccd8e6; border-radius: 8px; color: #1c3048; background: #fff }
.inventory-modal footer, .compact-record-modal footer { display: flex; justify-content: flex-end; gap: 9px; padding: 13px 22px; border-top: 1px solid #e3e9f0 }

@media (max-width: 900px) {
    .inventory-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) }
}

@media (max-width: 560px) {
    .inventory-kpis, .inventory-form-grid { grid-template-columns: 1fr }
    .inventory-form-grid label.wide { grid-column: auto }
}

.kardex-filter-card { margin-bottom: 14px; border: 1px solid #d9e4ef; border-radius: 13px; background: #fff; box-shadow: 0 3px 12px rgba(26, 58, 92, .055) }
.kardex-filter-form { padding: 17px 19px }
.kardex-filter-heading { display: flex; justify-content: space-between; gap: 18px; align-items: end; margin-bottom: 15px; padding-bottom: 12px; border-bottom: 1px solid #e7edf4 }
.kardex-filter-heading span { color: #1769df; font-size: 9px; font-weight: 850; letter-spacing: .12em }
.kardex-filter-heading h2 { margin: 3px 0 0; color: #173a60; font-size: 17px }
.kardex-filter-grid { display: grid; grid-template-columns: minmax(270px, 2fr) minmax(190px, 1.25fr) repeat(2, minmax(135px, .8fr)) minmax(190px, 1.2fr) minmax(190px, 1.2fr); gap: 11px }
.kardex-filter-grid label { display: grid; gap: 6px; color: #496078; font-size: 10px; font-weight: 800 }
.kardex-filter-grid select, .kardex-filter-grid input { min-width: 0; width: 100%; height: 38px; padding: 0 10px; border: 1px solid #ccd9e7; border-radius: 8px; color: #1f3c5c; background: #fff; font: inherit; font-size: 11px; font-weight: 650 }
.kardex-filter-grid select:focus, .kardex-filter-grid input:focus { outline: 2px solid rgba(23, 105, 223, .15); border-color: #4d91ed }
.kardex-product-combobox { position: relative }
.kardex-product-options { position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; right: 0; overflow-y: auto; max-height: 260px; padding: 5px; border: 1px solid #cbd9e8; border-radius: 9px; background: #fff; box-shadow: 0 12px 28px rgba(21, 55, 91, .18) }
.kardex-product-options[hidden] { display: none }
.kardex-product-options button { display: grid; grid-template-columns: minmax(90px, .35fr) minmax(0, 1fr); gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 6px; color: #24435f; background: transparent; text-align: left; cursor: pointer }
.kardex-product-options button:hover, .kardex-product-options button.active { color: #0b5fc9; background: #edf5ff }
.kardex-product-options strong { font-size: 11px }
.kardex-product-options span { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap }
.kardex-product-empty { display: block; padding: 10px; color: #788b9f; font-size: 11px; text-align: center }
.kardex-filter-actions { display: flex; justify-content: flex-end; align-items: center; gap: 15px }
.kardex-filter-actions a { color: #66809b; font-size: 11px; font-weight: 750; text-decoration: none }
.kardex-limit-note { margin: 0 16px 10px; padding: 8px 10px; border-radius: 7px; color: #815b19; background: #fff6df; font-size: 11px }
.kardex-table { min-width: 1580px; font-size: 11px }
.kardex-table th { white-space: nowrap }
.kardex-table td { vertical-align: middle }
.kardex-table td small { display: block; margin-top: 2px; color: #8495a7; font-size: 9px }
.kardex-datetime { white-space: nowrap }
.kardex-datetime span { margin-left: 6px; color: #71869b; font-size: 10px; font-variant-numeric: tabular-nums }
.kardex-opening-row td { color: #456481; background: #eef5fc }
.kardex-document-link { color: #1769d5; font-weight: 750; text-decoration: none }
.kardex-document-link:hover { text-decoration: underline }
.kardex-in { color: #12815d; font-weight: 800 }
.kardex-out { color: #bf4a3d; font-weight: 800 }
.kardex-balance { color: #173e68; background: #f6f9fc }
.kardex-empty-state { padding: 55px 20px; text-align: center }

@media (max-width: 1250px) {
    .kardex-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) }
}
@media (max-width: 720px) {
    .kardex-filter-heading { display: grid }
    .kardex-filter-grid { grid-template-columns: 1fr }
}
@media print {
    body[data-page="kardex"] .sidebar, body[data-page="kardex"] .topbar, body[data-page="kardex"] .page-heading, body[data-page="kardex"] .kardex-filter-card { display: none !important }
    body[data-page="kardex"] .workspace, body[data-page="kardex"] .content { margin: 0; padding: 0; width: 100% }
    body[data-page="kardex"] .kardex-table { min-width: 0; font-size: 7px }
}

.commercial-workflow-card td small {
    display: block;
    margin-top: 3px;
    color: #8291a3
}

.guide-page-actions {
    flex: 0 0 auto;
    margin-bottom: 0
}

.guide-management-table {
    min-width: 1400px;
    table-layout: fixed
}

.guide-management-table thead th,
.guide-management-table tbody td {
    white-space: nowrap
}

.guide-management-table thead th {
    padding-right: 8px;
    padding-left: 8px
}

.guide-management-table tbody td {
    padding: 6px 8px;
    overflow: hidden;
    vertical-align: middle;
    text-overflow: ellipsis
}

.guide-management-table th:nth-child(1),
.guide-management-table td:nth-child(1) { width: 118px }
.guide-management-table th:nth-child(2),
.guide-management-table td:nth-child(2) { width: 108px }
.guide-management-table th:nth-child(3),
.guide-management-table td:nth-child(3) { width: 78px }
.guide-management-table th:nth-child(4),
.guide-management-table td:nth-child(4) { width: 104px }
.guide-management-table th:nth-child(5),
.guide-management-table td:nth-child(5) { width: 190px }
.guide-management-table th:nth-child(7),
.guide-management-table td:nth-child(7) { width: 110px }
.guide-management-table th:nth-child(8),
.guide-management-table td:nth-child(8) { width: 130px }
.guide-management-table th:nth-child(9),
.guide-management-table td:nth-child(9) { width: 130px }
.guide-management-table th:nth-child(10),
.guide-management-table td:nth-child(10) { width: 122px }

.guide-management-table .guide-status-column {
    text-align: left
}

.guide-management-table .guide-status-column .status {
    justify-content: flex-start
}

.guide-selectable-row {
    cursor: pointer;
    transition: background-color .14s ease, box-shadow .14s ease
}

.guide-selectable-row:hover>td {
    background: #f7faff
}

.guide-selectable-row[aria-selected="true"]>td {
    background: #edf5ff
}

.guide-selectable-row[aria-selected="true"]>td:first-child {
    box-shadow: inset 3px 0 #1769e0
}

.guide-selectable-row:focus-visible {
    outline: 2px solid #78aef0;
    outline-offset: -2px
}

.guide-pdf-link,
.guide-invoice-reference {
    color: #1769e0;
    font-weight: 700;
    text-decoration: none
}

.guide-detail-list {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

@media (max-width: 720px) {
    .guide-page-actions,
    .guide-page-actions .invoice-list-commands {
        width: 100%
    }

    .guide-page-actions {
        justify-content: flex-start
    }

    .guide-page-actions .invoice-list-command {
        flex: 1 1 104px
    }
}

.quote-management-table {
    min-width: calc(1480px + 1cm);
    table-layout: fixed
}

.quote-management-table thead th,
.quote-management-table thead th.numeric {
    text-align: left !important;
    white-space: nowrap
}

.quote-management-table tbody td {
    padding: 6px 10px;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.quote-management-table th:nth-child(1),
.quote-management-table td:nth-child(1),
.quote-management-table th:nth-child(2),
.quote-management-table td:nth-child(2) {
    width: 120px
}

.quote-management-table th:nth-child(3),
.quote-management-table td:nth-child(3),
.quote-management-table th:nth-child(4),
.quote-management-table td:nth-child(4) {
    width: 92px
}

.quote-management-table th:nth-child(5),
.quote-management-table td:nth-child(5) {
    width: 112px
}

.quote-management-table th:nth-child(6),
.quote-management-table td:nth-child(6) {
    width: calc(210px + 1cm)
}

.quote-management-table th:nth-child(7),
.quote-management-table td:nth-child(7) {
    width: 72px
}

.quote-management-table th:nth-child(7) {
    padding-left: calc(12px + .5cm)
}

.quote-management-table td:nth-child(7) {
    padding-left: calc(10px + .5cm)
}

.quote-management-table th:nth-child(8),
.quote-management-table td:nth-child(8),
.quote-management-table th:nth-child(9),
.quote-management-table td:nth-child(9),
.quote-management-table th:nth-child(10),
.quote-management-table td:nth-child(10) {
    width: 108px
}

.quote-management-table th:nth-child(11),
.quote-management-table td:nth-child(11) {
    width: 112px;
    padding-right: 18px
}

.quote-management-table th:nth-child(11) {
    padding-left: calc(12px + .5cm)
}

.quote-management-table td:nth-child(11) {
    padding-left: calc(10px + .5cm)
}

.quote-management-table th:nth-child(8),
.quote-management-table td:nth-child(8),
.quote-management-table th:nth-child(9),
.quote-management-table td:nth-child(9),
.quote-management-table th:nth-child(10),
.quote-management-table td:nth-child(10) {
    text-align: right !important
}

.quote-list-generate-menu,
.guide-list-invoice-menu {
    position: relative
}

.guide-list-invoice-menu {
    width: 80px;
    min-width: 80px
}

.quote-list-generate-options,
.guide-list-invoice-options {
    position: absolute;
    top: calc(100% + 6px);
    left: 50%;
    z-index: 1250;
    width: 178px;
    padding: 4px;
    background: #fff;
    border: 1px solid #d7e1ec;
    border-radius: 10px;
    box-shadow: 0 12px 30px rgba(22, 43, 67, .18);
    transform: translateX(-50%)
}

.quote-list-generate-options[hidden],
.guide-list-invoice-options[hidden] {
    display: none
}

.quote-list-generate-options button,
.guide-list-invoice-options button {
    display: block;
    width: 100%;
    min-height: 28px;
    padding: 6px 8px;
    color: #294966;
    background: transparent;
    border: 0;
    border-radius: 7px;
    font: inherit;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    white-space: nowrap
}

.quote-list-generate-options button[hidden],
.guide-list-invoice-options button[hidden] {
    display: none
}

.quote-list-generate-options button:disabled,
.quote-list-generate-options button:disabled:hover,
.quote-list-generate-options button:disabled:focus-visible,
.guide-list-invoice-options button:disabled,
.guide-list-invoice-options button:disabled:hover,
.guide-list-invoice-options button:disabled:focus-visible {
    color: #8a99aa;
    background: transparent;
    cursor: not-allowed;
    opacity: 1;
    outline: 0
}

.quote-list-generate-options button:hover,
.quote-list-generate-options button:focus-visible,
.guide-list-invoice-options button:hover,
.guide-list-invoice-options button:focus-visible {
    color: #fff;
    background: #1769e0;
    outline: 0
}

.quote-list-generate-options .danger {
    color: #b42318
}

.quote-list-generate-options .danger:hover,
.quote-list-generate-options .danger:focus-visible {
    color: #fff
}

.quote-list-generate-options .danger:disabled,
.quote-list-generate-options .danger:disabled:hover,
.quote-list-generate-options .danger:disabled:focus-visible {
    color: #b42318;
    background: transparent;
    cursor: not-allowed;
    opacity: .55
}

.quote-management-table .quote-status {
    color: #087c61;
    background: transparent !important;
    font-weight: 750;
    white-space: nowrap
}

.quote-management-table .quote-status.status-rejected,
.quote-management-table .quote-status.status-cancelled {
    color: #b42318
}

.quote-code-link {
    padding: 0;
    color: #145fae;
    background: transparent;
    border: 0;
    font: inherit;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer
}

.quote-code-link:hover {
    color: #0750a0;
    text-decoration: underline
}

.quote-order-code {
    color: #087c61;
    font-weight: 800
}

.quote-order-empty {
    color: #8a99aa;
    font-size: 11px
}

.quote-actions-cell {
    position: relative
}

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

.quote-actions-toggle {
    width: 34px;
    min-width: 34px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #405b78;
    background: #f5f8fb;
    border: 1px solid #cbd8e5;
    border-radius: 8px;
    font-size: 17px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 1px
}

.quote-actions-dots {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

.quote-actions-dots i {
    width: 3px;
    height: 3px;
    display: block;
    border-radius: 50%;
    background: currentColor
}

.quote-actions-toggle:hover,
.quote-actions-toggle[aria-expanded="true"] {
    color: #075fc8;
    background: #edf5ff;
    border-color: #9fc8f7
}

.quote-actions-list {
    position: fixed;
    z-index: 1200;
    width: 205px;
    padding: 5px;
    background: #fff;
    border: 1px solid #d7e1ec;
    border-radius: 10px;
    box-shadow: 0 12px 30px rgba(22, 43, 67, .18)
}

.quote-actions-list[hidden] {
    display: none
}

.quote-actions-list button,
.quote-actions-list a {
    display: block;
    width: 100%;
    min-height: 32px;
    padding: 8px 10px;
    color: #294966;
    background: transparent;
    border: 0;
    border-radius: 7px;
    font: inherit;
    font-weight: 650;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    white-space: nowrap
}

.quote-actions-list button:hover,
.quote-actions-list a:hover {
    color: #fff;
    background: #1769e0
}

.quote-actions-list button:disabled,
.quote-actions-list button:disabled:hover {
    color: #7d8997;
    background: transparent;
    cursor: not-allowed;
    opacity: 1
}

.quote-actions-list .quote-generate-order:not(:disabled) {
    color: #294966;
    background: transparent;
    box-shadow: none
}

.quote-actions-list .quote-generate-order:not(:disabled):hover {
    color: #fff;
    background: #1769e0;
    box-shadow: none
}

.quote-actions-list .danger {
    color: #b42318
}

.quote-actions-list .danger:hover {
    color: #fff;
    background: #1769e0
}

.quote-actions-list .order-revert-action {
    margin-top: 5px;
    border-top: 1px solid #f1c7c3;
    border-radius: 0 0 7px 7px
}

.order-management-table {
    width: 100%;
    min-width: 1480px;
    table-layout: fixed
}

.order-management-table thead th,
.order-management-table thead th.numeric {
    text-align: left !important;
    white-space: nowrap
}

.order-management-table tbody td {
    padding: 6px 10px;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.order-management-table th:nth-child(1),
.order-management-table td:nth-child(1),
.order-management-table th:nth-child(2),
.order-management-table td:nth-child(2) {
    width: 130px
}

.order-management-table th:nth-child(3),
.order-management-table td:nth-child(3) {
    width: 100px
}

.order-management-table th:nth-child(4),
.order-management-table td:nth-child(4) {
    width: 125px
}

.order-management-table td:nth-child(-n + 4) {
    text-overflow: clip
}

.order-management-table th:nth-child(5),
.order-management-table td:nth-child(5) {
    width: 270px;
    max-width: 32ch
}

.order-management-table th:nth-child(6),
.order-management-table td:nth-child(6) {
    width: 160px
}

.order-management-table th:nth-child(7),
.order-management-table td:nth-child(7) {
    width: 62px
}

.order-management-table th:nth-child(8),
.order-management-table td:nth-child(8) {
    width: 125px;
    text-align: right !important
}

.order-management-table th:nth-child(9),
.order-management-table td:nth-child(9),
.order-management-table th:nth-child(10),
.order-management-table td:nth-child(10) {
    width: 130px
}

.order-management-table th:last-child,
.order-management-table td:last-child {
    width: 190px;
    overflow: visible
}

.order-management-table th:last-child {
    padding-left: 18px;
    text-align: left !important
}

.order-management-table td:last-child {
    padding-right: 18px;
    padding-left: 18px;
    text-align: center !important
}

.order-management-table td:nth-child(9) .status,
.order-management-table td:nth-child(10) .status {
    min-width: 0;
    padding: 0;
    justify-content: flex-start;
    border-radius: 0;
    background: transparent
}

.order-management-table .order-attention-partial {
    color: #c66a00
}

.order-management-table .order-attention-attended {
    color: #087852
}

.order-management-table .order-attention-pending {
    color: #c62828
}

.order-management-table .order-attention-cancelled {
    color: #111111
}

.order-billing-references {
    display: inline;
    overflow: hidden;
    color: #145fae;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap
}

.available-orders-table .linked-order-selected input[type="checkbox"] {
    accent-color: #1478e5;
    opacity: 1
}

.available-orders-table .linked-order-selected input[type="checkbox"]:disabled {
    filter: none;
    opacity: 1
}

.order-management-table td:last-child .quote-actions,
.order-management-table td:last-child .order-row-actions {
    width: 169px;
    display: grid;
    grid-template-columns: repeat(5, 29px);
    column-gap: 6px;
    align-items: center;
    justify-content: start
}

.order-management-table .order-row-actions>.quote-action-pdf {
    grid-column: 1
}

.order-management-table .order-row-actions>.quote-action-edit {
    grid-column: 2
}

.order-management-table .order-row-actions>.order-generate-menu {
    grid-column: 3
}

.order-management-table .order-row-actions>.quote-action-guide {
    grid-column: 4
}

.order-management-table .order-row-actions>.quote-action-invoice {
    grid-column: 5
}

.order-management-table td:last-child .commercial-next-action {
    text-align: center
}

.order-generate-menu {
    position: relative
}

.order-generate-toggle {
    color: #075fc8;
    background: #eef6ff;
    border: 1px solid #9fc8f7;
    border-radius: 8px
}

.order-generate-toggle:hover,
.order-generate-toggle[aria-expanded="true"] {
    background: #dceeff;
    border-color: #68a9f1
}

.order-management-table .order-customer strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.order-source-link {
    color: #145fae;
    font-weight: 750;
    text-decoration: none
}

.order-source-link:hover {
    text-decoration: underline
}

.legacy-direct-order {
    color: #8a99aa;
    font-size: 11px
}

.quote-ruc {
    color: #405b78;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: .015em
}

.quote-actions {
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px
}

.row-actions .quote-action {
    width: 29px;
    height: 29px;
    min-height: 29px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 8px;
    line-height: 1;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease
}

.row-actions .quote-action:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(31, 65, 104, .12)
}

.quote-action svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round
}

.row-actions .quote-action-view {
    color: #405b78;
    border-color: #cbd8e5;
    background: #f5f8fb
}

.row-actions .quote-action-edit {
    color: #135db6;
    border-color: #bfd8f7;
    background: #edf6ff
}

.row-actions .quote-action-send {
    color: #1769e0;
    border-color: #c9dcfb;
    background: #f1f6ff
}

.row-actions .quote-action-approve {
    color: #087c61;
    border-color: #bce7da;
    background: #eaf9f4
}

.row-actions .quote-action-reject {
    color: #b54708;
    border-color: #fed7aa;
    background: #fff7ed
}

.row-actions .quote-action-order {
    color: #5b3ac4;
    border-color: #d8ccff;
    background: #f4f0ff
}

.row-actions .quote-action-pickup {
    color: #087c61;
    border-color: #bce7da;
    background: #eaf9f4
}

.row-actions .quote-action-cancel {
    color: #b42318;
    border-color: #fecaca;
    background: #fff1f1
}

.row-actions .quote-action-reactivate {
    color: #067647;
    border-color: #a6f4c5;
    background: #ecfdf3
}

.row-actions .quote-action-pdf {
    color: #175cd3;
    border-color: #b2ccff;
    background: #eff4ff;
    text-decoration: none
}

.row-actions .quote-action-invoice {
    color: #087c61;
    border-color: #bce7da;
    background: #eaf9f4;
    text-decoration: none
}

.row-actions .quote-action-guide {
    color: #1769e0;
    border-color: #c9dcfb;
    background: #f1f6ff;
    text-decoration: none
}

.commercial-full-editor.editor-locked .invoice-form-scroll input:disabled,
.commercial-full-editor.editor-locked .invoice-form-scroll select:disabled,
.commercial-full-editor.editor-locked .invoice-form-scroll textarea:disabled {
    color: #405a78;
    background: #f3f6fa;
    border-color: #d6e0eb;
    opacity: 1;
    cursor: not-allowed
}

.commercial-full-editor.order-purchase-order-mode .client-purchase-order {
    color: #175cd3
}

.commercial-full-editor.order-purchase-order-mode .client-purchase-order input:not(:disabled) {
    color: #173d66;
    background: #fff;
    border-color: #6da6e8;
    box-shadow: 0 0 0 3px #1769d214;
    cursor: text
}

.order-source-editor .sales-doc-detail.order-detail-readonly { background: #f8fafc }
.order-source-editor .sales-doc-detail.order-detail-readonly input:disabled,
.order-source-editor .sales-doc-detail.order-detail-readonly select:disabled,
.order-source-editor .sales-doc-detail.order-detail-readonly textarea:disabled {
    color: #405a78;
    background: #f1f5f9;
    border-color: #d6e0eb;
    opacity: 1;
    cursor: not-allowed
}
.commercial-record-modal {
    width: min(1050px, 96vw);
    max-height: 94vh
}

.commercial-form-body {
    padding: 14px;
    overflow: auto;
    background: #f5f8fb
}

.commercial-fields {
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px
}

.commercial-fields label {
    position: relative;
    display: grid;
    gap: 5px;
    color: #526b84;
    font-size: 10px;
    font-weight: 700
}

.commercial-fields label.wide {
    grid-column: span 2
}

.commercial-fields input,
.commercial-fields select,
.commercial-lines input,
.commercial-lines select,
.commercial-notes textarea {
    min-height: 34px;
    padding: 6px 8px;
    border: 1px solid #ccd9e6;
    border-radius: 7px;
    background: #fff;
    color: #294763
}

.commercial-lines {
    min-width: 850px
}

.commercial-lines thead th {
    color: #17202b;
    background: #d9dee5
}

.commercial-lines td {
    padding: 5px
}

.commercial-lines input,
.commercial-lines select {
    width: 100%
}

.commercial-full-editor[data-commercial-editor="quote"] .sales-doc-detail.commercial-detail-blocked {
    opacity: .58;
}

.commercial-full-editor[data-commercial-editor="quote"] .sales-doc-detail.commercial-detail-blocked .detail-title span::after {
    content: " · Selecciona un cliente para habilitar el detalle";
    color: #a64b2a;
    font-weight: 700;
}

/* Cotización: barra de comandos compacta y de ancho uniforme. */
.commercial-full-editor[data-commercial-editor="quote"] .modal-tool {
    width: 62px;
    min-width: 62px;
    max-width: 62px;
    padding-left: 3px;
    padding-right: 3px
}

.commercial-full-editor[data-commercial-editor="quote"] .modal-tool.tool-save {
    width: 70px;
    min-width: 70px;
    max-width: 70px
}

/* Detalle de cotización: más espacio para cantidad/precio y menos para I.S.C. */
.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines {
    min-width: 1320px
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:nth-child(7) {
    width: 84px
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:nth-child(8) {
    width: 92px
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:nth-child(10) {
    width: 72px
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:nth-child(11) {
    width: 86px
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:nth-child(15) {
    width: 78px
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:nth-child(15),
.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines td:nth-child(15),
.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines td:nth-child(15) input {
    text-align: right
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines th:last-child,
.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines td:last-child {
    width: 38px;
    padding-left: 2px;
    padding-right: 2px;
    text-align: center
}

.commercial-full-editor[data-commercial-editor="quote"] .commercial-invoice-lines button[data-commercial-remove-line] {
    width: 24px;
    height: 24px;
    margin: 0 auto;
    padding: 0;
    display: grid;
    place-items: center;
    color: #d63f52;
    background: #fff0f2;
    border: 1px solid #ffcbd2;
    border-radius: 7px;
    line-height: 1
}

/* Cotizaciones y órdenes: lectura contable de columnas numéricas. */
.commercial-invoice-lines th:nth-child(n + 5):nth-child(-n + 14),
.commercial-invoice-lines td:nth-child(n + 5):nth-child(-n + 14),
.commercial-invoice-lines td:nth-child(n + 5):nth-child(-n + 14) input {
    text-align: right
}

.commercial-invoice-lines td:nth-child(n + 5):nth-child(-n + 14) input {
    font-variant-numeric: tabular-nums
}

/* Guía directa: cabecera izquierda y datos generales de ancho contenido. */
.direct-gre-editor .direct-gre-lines thead th.direct-gre-heading-left {
    text-align: left !important
}

@media(min-width:761px) {
    .direct-gre-editor .voucher-block .sales-doc-fields-main {
        grid-template-columns: 88px 128px 185px 138px 120px;
        justify-content: start
    }

    .direct-gre-editor .voucher-block .sales-doc-fields-main>label {
        grid-column: auto;
        grid-row: auto
    }

    .direct-gre-editor .commercial-field-issued {
        width: 185px
    }

    .direct-gre-editor .commercial-field-transfer-date {
        width: 138px
    }
}

/* Cotizaciones y órdenes: los importes se editan sin controles nativos de incremento. */
.commercial-invoice-lines input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield
}

.commercial-invoice-lines input[type="number"]::-webkit-inner-spin-button,
.commercial-invoice-lines input[type="number"]::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none
}

.commercial-notes {
    margin: 12px 0 0;
    display: grid;
    gap: 5px;
    color: #526b84;
    font-size: 11px;
    font-weight: 700
}

.commercial-record-modal>footer {
    padding: 10px 14px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #dce5ef
}

@media(max-width:760px) {
    .commercial-fields {
        grid-template-columns: 1fr
    }

    .commercial-fields label.wide {
        grid-column: auto
    }
}

/* Navegación lateral ASFYRA: identidad visual unificada con Control SaaS. */
.sidebar {
  background:
    radial-gradient(circle at 0 0, rgba(23, 105, 224, .055), transparent 27%),
    linear-gradient(180deg, #fbfdff 0%, #f4f8fc 100%);
  box-shadow: 8px 0 28px rgba(23, 55, 96, .055);
}

.brand,
.topbar {
  height: 68px;
}

.sidebar nav {
  padding-right: 8px;
  scrollbar-color: #c5d4e4 transparent;
  scrollbar-width: thin;
}

.sidebar nav::-webkit-scrollbar { width: 7px; }
.sidebar nav::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #c5d4e4;
  background-clip: padding-box;
}

.nav-parent {
  position: relative;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease;
}

.nav-group.open>.nav-parent {
  box-shadow: inset 3px 0 var(--blue), 0 6px 16px rgba(23, 55, 96, .07);
}

.nav-group.open>.nav-parent .menu-icon {
  color: #fff;
  background: linear-gradient(135deg, #1769e0, #0d83ea);
  box-shadow: 0 7px 16px rgba(23, 105, 224, .22);
}

.submenu a { transition: color .14s ease, background-color .14s ease, border-color .14s ease; }
.submenu a.active {
  background: linear-gradient(90deg, #e5f0ff, #eef6ff);
  box-shadow: inset 2px 0 #1769e0;
}

.user-card { box-shadow: 0 7px 20px rgba(23, 55, 96, .045); }

.sidebar-collapsed .nav-group.open>.nav-parent {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.nav-parent:focus-visible,
.submenu a:focus-visible,
.brand button:focus-visible,
.user-card a:focus-visible {
  outline: 3px solid rgba(23, 105, 224, .18);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .sidebar *, .sidebar *::before, .sidebar *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}

/* Cotización y cabecera de pedidos: densidad uniforme para los controles editables. */
.commercial-full-editor[data-commercial-editor="quote"] :is(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
    select
),
.commercial-full-editor[data-commercial-editor="order"] :is(.customer-block, .voucher-block) :is(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
    select
) {
    height: 30px;
    min-height: 30px;
    font-size: 11px
}