@font-face {
    font-family: "samscommerce";
    src: url("/fonts/sams/samscommerce.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "samspro";
    src: url("/fonts/sams/samscommerce.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "samsdecorative";
    src: url("/fonts/sams/samsdecorative.woff2") format("woff2");
    font-display: swap;
}

:root {
    --sams-font-commerce: "samscommerce", "samspro", "Avenir Next", "Segoe UI", Arial, sans-serif;
    --sams-font-decorative: "samsdecorative", "samscommerce", "Avenir Next", Arial, sans-serif;
}

body {
    margin: 0;
    font-family: var(--sams-font-commerce);
    background: #f4f6f8;
    color: #17202a;
    font-size: 15px;
    letter-spacing: 0;
}

.app-shell,
.app-shell button,
.app-shell input,
.app-shell select,
.app-shell textarea,
.dxbl {
    font-family: var(--sams-font-commerce) !important;
}

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

.shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 260px 1fr;
}

.sidebar {
    background: #101828;
    color: #fff;
    padding: 24px 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.brand {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 24px;
}

.brand-logo {
    display: block;
    width: 156px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.brand-subtitle {
    color: #98a2b3;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.side-tree {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.side-group {
    border-radius: 12px;
}

.side-group summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    color: #f2f4f7;
    cursor: pointer;
    user-select: none;
}

.side-group summary::-webkit-details-marker {
    display: none;
}

.side-group summary::after {
    content: "▸";
    color: #98a2b3;
    font-size: .82rem;
    transition: transform .15s ease;
}

.side-group[open] > summary::after {
    transform: rotate(90deg);
}

.side-group summary:hover,
.side-link:hover,
.side-link.active {
    background: #1d2939;
    color: #fff;
}

.side-children {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 4px 0 8px 10px;
    padding-left: 12px;
    border-left: 1px solid rgba(208, 213, 221, .18);
}

.side-group.nested summary {
    color: #d0d5dd;
    font-size: .94rem;
}

.side-link {
    color: #d0d5dd;
    text-decoration: none;
    padding: 9px 12px;
    border-radius: 10px;
}

.side-link.disabled {
    color: #667085;
    cursor: not-allowed;
}

.content {
    padding: 30px;
}

.panel-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 18px;
}

.panel,
.data-table {
    background: #fff;
    border-radius: 18px;
    border: 1px solid rgba(208, 213, 221, .72);
    box-shadow: 0 10px 30px rgba(16, 24, 40, .08);
}

.panel {
    padding: 22px;
}

.toolbar {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}

.toolbar input {
    min-width: 320px;
    padding: 10px 12px;
    border: 1px solid #d0d5dd;
    border-radius: 10px;
}

.toolbar button {
    padding: 10px 16px;
    border: 0;
    border-radius: 10px;
    background: linear-gradient(135deg, #101828, #344054);
    color: #fff;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
}

.data-table th,
.data-table td {
    text-align: left;
    padding: 12px 14px;
    border-bottom: 1px solid #eaecf0;
}

.data-table th {
    font-size: .82rem;
    text-transform: uppercase;
    color: #667085;
}

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

    .sidebar {
        position: static;
    }
}

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

.page-header h1 {
    margin: 0;
}

.eyebrow {
    margin: 0 0 4px;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #667085;
    font-weight: 700;
}

.subhead {
    margin-top: 6px;
    color: #667085;
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.badge,
.status,
.tag {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: .78rem;
    font-weight: 700;
}

.badge {
    background: #eef4ff;
    color: #3538cd;
}

.status-success {
    background: #ecfdf3;
    color: #027a48;
}

.status-danger {
    background: #fef3f2;
    color: #b42318;
}

.status-muted {
    background: #f2f4f7;
    color: #475467;
}

.form-control {
    width: 100%;
    box-sizing: border-box;
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    background: #fff;
    color: #101828;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.form-control:focus {
    border-color: #344054;
    box-shadow: 0 0 0 4px rgba(52, 64, 84, .12);
}

.form-control:disabled {
    background: #f9fafb;
    color: #667085;
    cursor: not-allowed;
}

.form-control[type="color"] {
    width: 72px;
    min-height: 42px;
    padding: 5px;
}

.filter-grid {
    display: grid;
    grid-template-columns: minmax(260px, 2fr) 120px repeat(3, minmax(150px, auto)) auto;
    gap: 12px;
    align-items: end;
}

.filter-grid label {
    display: block;
    font-size: .82rem;
    font-weight: 700;
    color: #475467;
}

.check-line {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    margin: 0;
    white-space: nowrap;
}

.filter-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 14px;
    border-radius: 12px;
    border: 1px solid transparent;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}

.btn:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(16, 24, 40, .12);
}

.btn-primary {
    background: #101828;
    color: #fff;
}

.btn-secondary {
    background: #fff;
    color: #344054;
    border-color: #d0d5dd;
}

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

.table-wrap {
    overflow-x: auto;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(16, 24, 40, .08);
}

.clickable-table tbody tr {
    cursor: pointer;
}

.clickable-table tbody tr:hover td {
    background: #f9fafb;
}

.strong {
    font-weight: 800;
}

.number-cell {
    text-align: right !important;
    font-variant-numeric: tabular-nums;
}

.muted-panel,
.danger-panel {
    margin-top: 16px;
}

.muted-panel,
.muted-text {
    color: #667085;
}

.danger-panel {
    color: #b42318;
    background: #fff4f2;
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.kpi-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.kpi-card span,
.definition-grid span {
    color: #667085;
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.kpi-card strong {
    font-size: 1.2rem;
}

.detail-section {
    margin-bottom: 16px;
}

.detail-section h2 {
    margin: 0 0 14px;
    font-size: 1.1rem;
}

.definition-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    gap: 14px;
}

.definition-grid.single {
    grid-template-columns: 1fr;
}

.definition-grid div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.long-text {
    margin-top: 16px;
    padding: 14px;
    background: #f9fafb;
    border-radius: 12px;
    color: #475467;
}

.two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tag {
    background: #f2f4f7;
    color: #344054;
}

.tag-primary {
    background: #eef4ff;
    color: #3538cd;
}

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

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

.photo-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px;
    border: 1px solid #eaecf0;
    border-radius: 14px;
    background: #fcfcfd;
}

.photo-card span,
.photo-card small {
    color: #667085;
    overflow-wrap: anywhere;
}

.photo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    border-radius: 12px;
    background: linear-gradient(135deg, #eef4ff, #f9fafb);
    color: #3538cd;
    font-size: 1.5rem;
    font-weight: 800;
}

@media (max-width: 1100px) {
    .filter-grid,
    .detail-grid,
    .definition-grid,
    .two-columns {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 700px) {
    .page-header,
    .header-actions,
    .filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .filter-grid,
    .detail-grid,
    .definition-grid,
    .two-columns {
        grid-template-columns: 1fr;
    }
}

.master-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 18px;
    align-items: start;
}

.master-nav {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.master-nav a {
    color: #344054;
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 10px;
}

.master-nav a.active,
.master-nav a:hover {
    background: #eef4ff;
    color: #3538cd;
}

.master-toolbar {
    margin-bottom: 0;
}

.master-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(180px, 1fr));
    gap: 16px 18px;
}

.form-panel {
    background: linear-gradient(180deg, #fff, #fcfcfd);
}

.form-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.form-field span {
    color: #475467;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.master-form-grid textarea {
    min-height: 110px;
    resize: vertical;
}

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

.section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.section-title-row h2 {
    margin: 0;
}

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

.btn-small {
    min-height: 34px;
    padding: 6px 10px;
    font-size: .85rem;
}

.btn-danger {
    background: #fff;
    color: #b42318;
    border-color: #fecdca;
}

@media (max-width: 1000px) {
    .master-layout,
    .master-form-grid {
        grid-template-columns: 1fr;
    }

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

.master-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #101828;
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease;
}

.master-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(16, 24, 40, .12);
}

.master-card span {
    font-size: 1.05rem;
    font-weight: 800;
}

.master-card small {
    color: #667085;
    line-height: 1.45;
}

.success-panel {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #067647;
}

.confirm-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.confirm-panel p {
    margin: 6px 0 0;
}

.data-table .btn + .btn {
    margin-left: 6px;
}

.search-panel {
    margin-bottom: 16px;
}

.form-panel .section-title-row {
    padding-bottom: 14px;
    border-bottom: 1px solid #eaecf0;
}

.form-panel .section-title-row h2 {
    font-size: 1.25rem;
}

.form-field:has(.form-control:required) span::after {
    content: " *";
    color: #b42318;
}


.dx-search-panel,
.grid-panel {
    padding: 18px;
}

.search-form-layout .dxflGroupCell,
.master-dx-form .dxflGroupCell {
    padding-bottom: 12px;
}

.search-button-item .dxbl-fl-cpt,
.search-button-item label {
    visibility: hidden;
}

.erp-grid {
    border-radius: 14px;
    overflow: hidden;
}

.erp-grid .dxbl-grid-header-row {
    background: #f8fafc;
}

.grid-actions,
.popup-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.editor-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #f8fafc;
    color: #475467;
}

.editor-summary strong {
    color: #101828;
    font-variant-numeric: tabular-nums;
}

.master-dx-form {
    --dxbl-fl-item-caption-font-size: .82rem;
}

.dx-field-control,
.dx-check-line {
    width: 100%;
}

.dx-check-line {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #344054;
}

.color-input {
    max-width: 82px;
}

.confirm-popup p {
    margin: 0 0 8px;
    color: #475467;
}

.confirm-popup strong {
    color: #101828;
}


.grid-hint {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    color: #667085;
    font-size: .84rem;
}

.grid-hint::before {
    content: "↵";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: #eef4ff;
    color: #3538cd;
}

.erp-grid .dxbl-grid-table > tbody > tr {
    cursor: pointer;
}

.erp-grid .dxbl-grid-table > tbody > tr:hover > td {
    background: #f8fafc;
}

.master-editor-shell {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.pro-editor-summary {
    min-height: 74px;
    margin-bottom: 0;
    padding: 18px 20px;
    border: 1px solid rgba(53, 56, 205, .14);
    background:
        radial-gradient(circle at top left, rgba(53, 56, 205, .14), transparent 34%),
        linear-gradient(135deg, #ffffff, #f8fafc);
}

.editor-summary-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.editor-summary-main strong {
    font-size: 1.15rem;
}

.editor-kicker {
    color: #667085;
    font-size: .76rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.editor-code {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #101828;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.form-section-card {
    padding: 18px;
    border: 1px solid #eaecf0;
    border-radius: 18px;
    background: linear-gradient(180deg, #fff, #fcfcfd);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.form-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eaecf0;
}

.form-section-heading span {
    display: block;
    color: #101828;
    font-size: 1rem;
}

.form-section-heading p {
    margin: 4px 0 0;
    color: #667085;
    font-size: .86rem;
}

.form-section-heading small {
    white-space: nowrap;
    color: #b42318;
    font-size: .78rem;
}

.pro-master-form .dxbl-fl-cpt {
    color: #475467;
    font-size: .78rem;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.pro-master-form .required-field .dxbl-fl-cpt {
    color: #101828;
}

.pro-master-form .readonly-field .dxbl-fl-cpt {
    color: #98a2b3;
}

.pro-native-input {
    border: 1px solid #d0d5dd;
    background: #fff;
}

.pro-native-input:disabled {
    background: #f9fafb;
    color: #667085;
}

.dx-check-line {
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid #eaecf0;
    border-radius: 12px;
    background: #fcfcfd;
}

.side-group summary,
.side-group.nested summary,
.side-link {
    font-weight: 400 !important;
}

.master-editor-shell {
    gap: 10px;
}

.erp-record-strip {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 7px 10px;
    border: 1px solid #d9dee7;
    border-radius: 8px;
    background: #f7f9fb;
}

.erp-record-title {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.erp-record-title span {
    color: #667085;
    font-size: .72rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.erp-record-title strong {
    min-width: 0;
    color: #101828;
    font-size: .94rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.erp-record-code {
    display: inline-flex;
    align-items: center;
    max-width: 260px;
    min-height: 26px;
    padding: 3px 8px;
    border: 1px solid #cfd6e1;
    border-radius: 5px;
    background: #fff;
    color: #1d2939;
    font-size: .78rem;
    font-variant-numeric: tabular-nums;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.erp-form-card {
    padding: 10px 12px 12px;
    border-radius: 8px;
    box-shadow: none;
    background: #fff;
}

.erp-form-note {
    margin: 0 0 8px;
    padding-bottom: 7px;
    border-bottom: 1px solid #eaecf0;
    color: #667085;
    font-size: .76rem;
}

.erp-compact-form {
    width: 100%;
    min-width: 0;
}

.erp-compact-form .dxbl-fl .dxbl-row {
    --bs-gutter-x: .75rem;
    --bs-gutter-y: .35rem;
}

.erp-compact-form .dxbl-fl-ctrl,
.erp-compact-form .dxbl-fl-item,
.erp-compact-form .dxbl-fl-cpt {
    min-width: 0;
}

.pro-master-form .dxbl-fl-cpt,
.erp-compact-form .dxbl-fl-cpt {
    margin-bottom: 2px;
    color: #475467;
    font-size: .72rem;
    line-height: 1.15;
    letter-spacing: 0;
    text-transform: none;
}

.dx-check-line {
    min-height: 30px !important;
    height: 30px;
    padding: 0 8px;
    border-radius: 5px;
    font-size: .84rem;
    box-sizing: border-box;
}

.color-input {
    width: 54px;
    max-width: 54px;
    height: 30px;
    min-height: 30px !important;
    padding: 2px;
}

.popup-actions {
    gap: 6px;
}

.grid-actions {
    gap: 5px;
}

.erp-grid .dxbl-grid-table > tbody > tr > td,
.erp-grid .dxbl-grid-table > thead > tr > th {
    padding-top: 6px;
    padding-bottom: 6px;
}

@media (max-width: 900px) {
    .erp-record-strip {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .erp-record-code {
        max-width: 100%;
    }
}

.product-layout {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.product-main-panel {
    min-width: 0;
}

.product-side-panel {
    position: sticky;
    top: 12px;
    padding: 12px;
}

.product-image-box {
    display: grid;
    gap: 8px;
}

.product-image-empty {
    height: 190px;
    border: 1px dashed var(--border);
    border-radius: 10px;
    display: grid;
    place-items: center;
    color: var(--muted);
    background: rgba(255, 255, 255, .55);
    font-size: .8rem;
}

.product-flags {
    margin-top: 12px;
    display: grid;
    gap: 5px;
    font-size: .78rem;
}

.product-form-panel {
    padding: 10px 12px;
}

.erp-product-form .dxfl-groupbox-caption {
    font-size: .72rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--muted);
}

.erp-product-form .dxfl-caption {
    font-size: .74rem;
    color: var(--muted);
    margin-bottom: 2px;
}

.erp-product-form input,
.erp-product-form textarea,
.product-tabs input,
.product-tabs textarea {
    box-sizing: border-box;
}

.html-editor-shell {
    margin-top: 10px;
}

.erp-field-label {
    display: block;
    margin: 0 0 5px;
    color: var(--muted);
    font-size: .74rem;
}

.product-html-editor {
    min-height: 360px;
    max-width: 100%;
}

.inline-checks {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    min-height: 30px;
}

.left-actions {
    justify-content: flex-start;
}

.product-grid .dxbl-grid-table > tbody > tr {
    cursor: pointer;
}

@media (max-width: 980px) {
    .product-layout {
        grid-template-columns: 1fr;
    }

    .product-side-panel {
        position: static;
    }
}

.product-main-panel-full {
    width: 100%;
    min-width: 0;
}

.product-main-panel-full .product-tabs {
    width: 100%;
}

.form-note {
    margin-top: 10px;
    font-size: .78rem;
    color: var(--muted);
}

:root {
    --eliseo-blue: #1f5eff;
    --eliseo-blue-dark: #1647c7;
    --eliseo-blue-soft: #eef4ff;
    --eliseo-blue-border: #b8c9ff;
    --eliseo-border: #cfd7e6;
    --eliseo-text: #172033;
    --eliseo-muted: #667085;
}

body {
    font-family: Roboto, Inter, Aptos, "Helvetica Neue", Arial, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--eliseo-text);
}

.brand-title {
    font-weight: 650;
}

.badge {
    background: var(--eliseo-blue-soft);
    color: var(--eliseo-blue-dark);
    border: 1px solid var(--eliseo-blue-border);
}

.btn-primary,
.toolbar button {
    background: var(--eliseo-blue);
    color: #fff;
}

.btn-primary:hover:not(:disabled),
.toolbar button:hover:not(:disabled) {
    background: var(--eliseo-blue-dark);
}

.btn-secondary,
.btn-danger,
.form-control,
.panel,
.data-table,
.erp-form-card,
.form-section-card,
.erp-record-strip {
    border-color: var(--eliseo-border);
}

.side-group summary:hover,
.side-link:hover,
.side-link.active {
    background: rgba(31, 94, 255, .16);
    color: #fff;
}

.master-nav a.active,
.master-nav a:hover,
.grid-hint::before,
.tag-primary {
    background: var(--eliseo-blue-soft);
    color: var(--eliseo-blue-dark);
}

.article-filter-panel {
    padding: 14px 16px 12px;
    margin-bottom: 14px;
    border-top: 3px solid var(--eliseo-blue);
}

.article-filter-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e4e9f2;
}

.article-filter-head strong {
    display: block;
    color: #111827;
    font-size: .95rem;
    font-weight: 650;
}

.article-filter-head span {
    display: block;
    margin-top: 2px;
    color: var(--eliseo-muted);
    font-size: .78rem;
}

.article-filter-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.article-filter-form .dxbl-fl-cpt {
    color: #344054;
    font-size: .72rem;
}

.erp-filter-checks {
    min-height: 29px;
    padding-top: 2px;
    gap: 12px;
}

.erp-grid .dxbl-grid-filter-row td,
.erp-grid .dxbl-grid-header-row th {
    background: #f5f8ff;
}

.erp-grid .dxbl-grid-header-row th {
    color: #344054;
    border-bottom-color: var(--eliseo-blue-border);
}

.product-grid {
    border: 1px solid var(--eliseo-border);
}

.product-grid .dxbl-grid-table > tbody > tr:hover > td {
    background: #f7faff;
}

.status-success {
    background: #eaf4ff;
    color: #155eef;
}

@media (max-width: 800px) {
    .article-filter-head {
        flex-direction: column;
    }

    .article-filter-actions {
        width: 100%;
        justify-content: stretch;
    }
}

.seo-product-panel .dxbl-fl-cpt {
    color: var(--blue-700, #1d4ed8);
}

.report-viewer-panel {
    padding: 0;
    overflow: hidden;
    min-height: calc(100vh - 170px);
}

.eliseo-report-viewer {
    height: calc(100vh - 190px);
    min-height: 680px;
    border: 1px solid #c8d8ea;
}


.article-list-page {
    height: calc(100vh - 60px);
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.article-list-page > .page-header,
.article-list-page > .article-filter-panel {
    flex: 0 0 auto;
}

.article-grid-panel {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding: 12px;
    display: flex;
    flex-direction: column;
}

.article-grid-panel .grid-hint {
    flex: 0 0 auto;
}

.product-grid-stable {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.product-grid-stable .dxbl-grid,
.product-grid-stable.dxbl-grid {
    height: 100%;
    max-height: 100%;
}

.product-grid-stable .dxbl-grid-table td,
.product-grid-stable .dxbl-grid-table th,
.product-grid-stable td,
.product-grid-stable th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-grid-stable .dxbl-grid-filter-row input,
.product-grid-stable .dxbl-grid-filter-row .dxbl-text-edit-input {
    min-width: 0;
}

.product-grid-stable .dxbl-grid-table > tbody > tr > td,
.product-grid-stable .dxbl-grid-table > thead > tr > th {
    padding-top: 5px;
    padding-bottom: 5px;
}

@media (max-width: 1100px) {
    .article-list-page {
        height: auto;
        overflow: visible;
    }

    .article-grid-panel {
        overflow-x: auto;
    }
}

.article-filter-panel-compact {
    padding: 10px 12px;
}

.article-filter-head.compact {
    margin-bottom: 8px;
}

.article-simple-filter {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 105px auto;
    gap: 10px;
    align-items: end;
    min-width: 0;
}

.article-simple-filter label {
    display: block;
    margin: 0 0 3px;
    color: #475467;
    font-size: .72rem;
}

.article-search-box,
.article-limit-box {
    min-width: 0;
}

.article-switches {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    min-height: 30px;
    font-size: .82rem;
}

.article-grid-panel {
    max-width: 100%;
}

.product-grid-stable,
.product-grid-stable .dxbl-grid-table {
    max-width: 100%;
}

.product-grid-stable .dxbl-grid-table td,
.product-grid-stable .dxbl-grid-table th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.category-tabs {
    display: flex;
    gap: 4px;
    margin: 0 0 12px;
    border-bottom: 1px solid #d9e0ea;
}

.category-tabs button {
    min-height: 30px;
    padding: 5px 12px;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: 5px 5px 0 0;
    background: transparent;
    color: #475467;
    cursor: pointer;
}

.category-tabs button.active {
    background: #fff;
    border-color: #b8c0cc;
    color: #1f5eff;
}

.category-media-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 12px;
}

.upload-selector {
    min-width: 0;
    padding: 10px;
    border: 1px solid #d9e0ea;
    border-radius: 8px;
    background: #fff;
}

.upload-current {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 10px;
}

.upload-preview {
    height: 84px;
    border: 1px dashed #b8c0cc;
    border-radius: 6px;
    display: grid;
    place-items: center;
    background: #f8fafc;
    overflow: hidden;
    color: #667085;
    font-size: .78rem;
}

.upload-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.upload-current-info label {
    display: block;
    margin-bottom: 4px;
    font-size: .75rem;
    color: #475467;
}

.upload-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    font-size: .82rem;
}

.upload-actions-row input[type="file"] {
    max-width: 210px;
    font-size: .8rem;
}

.upload-message {
    margin-bottom: 8px;
    color: #475467;
    font-size: .78rem;
}

.upload-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(82px, 1fr));
    gap: 8px;
    max-height: 230px;
    overflow: auto;
}

.upload-thumb {
    padding: 4px;
    border: 1px solid #d9e0ea;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    text-align: left;
}

.upload-thumb.selected {
    border-color: #1f5eff;
    box-shadow: 0 0 0 2px rgba(31, 94, 255, .12);
}

.upload-thumb img {
    display: block;
    width: 100%;
    height: 58px;
    object-fit: cover;
    border-radius: 4px;
    background: #f3f5f8;
}

.upload-thumb span {
    display: block;
    margin-top: 3px;
    color: #475467;
    font-size: .68rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .article-simple-filter,
    .category-media-grid {
        grid-template-columns: 1fr;
    }
}

.media-manager {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.media-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    border: 1px solid #d7dde7;
    background: #f8fafc;
    border-radius: 10px;
    padding: 10px 12px;
}

.media-toolbar strong {
    display: block;
    font-size: .95rem;
    color: #17202a;
}

.media-toolbar span {
    display: block;
    color: #64748b;
    font-size: .78rem;
    margin-top: 2px;
}

.media-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.media-input-file {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.media-upload-button {
    cursor: pointer;
    margin: 0;
}

.media-message {
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    color: #1d4ed8;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: .82rem;
}

.media-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 14px;
    min-height: 420px;
}

.media-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
    gap: 10px;
    align-content: start;
    max-height: 560px;
    overflow: auto;
    padding: 2px;
}

.media-gallery.media-banner-mode {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.media-gallery.media-icon-mode {
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
}

.media-card {
    border: 1px solid #d7dde7;
    background: #fff;
    border-radius: 10px;
    padding: 7px;
    text-align: left;
    cursor: pointer;
    min-width: 0;
    transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}

.media-card:hover,
.media-card.selected {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, .12);
}

.media-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    background: linear-gradient(45deg, #f1f5f9 25%, #e2e8f0 25%, #e2e8f0 50%, #f1f5f9 50%, #f1f5f9 75%, #e2e8f0 75%);
    background-size: 18px 18px;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 6px;
}

.media-banner-mode .media-preview,
.media-picker-banner {
    aspect-ratio: 3.2 / 1;
}

.media-icon-mode .media-preview,
.media-picker-icon {
    aspect-ratio: 1 / 1;
}

.media-preview img,
.media-selected-preview img,
.media-picker-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.media-name,
.media-meta {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.media-name {
    font-size: .78rem;
    color: #1f2937;
}

.media-meta {
    font-size: .72rem;
    color: #64748b;
}

.media-detail {
    border: 1px solid #d7dde7;
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    min-width: 0;
}

.media-selected-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;
}

.media-detail dl {
    margin: 0 0 12px;
    font-size: .78rem;
}

.media-detail dt {
    color: #64748b;
    margin-top: 8px;
}

.media-detail dd {
    margin: 2px 0 0;
    color: #1f2937;
    word-break: break-all;
}

.media-empty,
.media-empty-detail {
    border: 1px dashed #cbd5e1;
    color: #64748b;
    border-radius: 10px;
    padding: 18px;
    background: #f8fafc;
}

.media-picker {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.media-picker-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    border: 1px solid #d7dde7;
    background: #f8fafc;
    border-radius: 10px;
    overflow: hidden;
    color: #64748b;
    font-size: .78rem;
}

.media-picker-info {
    min-width: 0;
}

.media-picker-info label {
    display: block;
    margin-bottom: 4px;
    font-size: .78rem;
    color: #475569;
}

.media-picker-actions {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

.category-media-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.media-page-panel {
    padding: 14px;
}

.product-images-layout {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 18px;
}

.product-media-library {
    min-width: 0;
}

.article-simple-filter {
    grid-template-columns: minmax(260px, 1fr) 110px auto;
    align-items: end;
}

.article-list-page,
.article-grid-panel,
.product-grid,
.erp-grid {
    max-width: 100%;
    min-width: 0;
}

.article-grid-panel {
    overflow: hidden;
}

.product-grid .dxbl-grid-table {
    width: 100%;
}

@media (max-width: 1100px) {
    .media-layout,
    .product-images-layout {
        grid-template-columns: 1fr;
    }

    .media-toolbar {
        flex-direction: column;
    }

    .media-toolbar-actions {
        justify-content: flex-start;
    }

    .article-simple-filter {
        grid-template-columns: 1fr;
    }
}

.category-media-grid {
    align-items: start;
}

.media-picker {
    width: 100%;
    min-width: 0;
}

.media-picker-preview {
    min-height: 120px;
    border: 1px solid #d0d7e2;
    background: linear-gradient(45deg, #f8fafc 25%, #eef2f7 25%, #eef2f7 50%, #f8fafc 50%, #f8fafc 75%, #eef2f7 75%);
    background-size: 18px 18px;
}

.media-picker-banner,
.media-banner-mode .media-preview {
    aspect-ratio: 5 / 1 !important;
    min-height: 96px;
}

.category-banner-picker .media-picker-preview,
.category-banner-picker .media-picker-banner {
    aspect-ratio: 5 / 1 !important;
    min-height: 110px;
}

.product-images-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.product-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 12px;
    align-items: start;
}

.product-photo-card {
    display: grid;
    grid-template-columns: 138px minmax(0, 1fr);
    gap: 10px;
    border: 1px solid #cfd7e6;
    background: #fff;
    border-radius: 8px;
    padding: 10px;
    min-width: 0;
}

.product-photo-card.is-main {
    border-color: #7d8898;
    box-shadow: inset 3px 0 0 #6b7280;
}

.product-photo-preview {
    aspect-ratio: 1 / 1;
    border: 1px solid #d0d7e2;
    background: #f4f6f9;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: #667085;
    font-size: .76rem;
}

.product-photo-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-photo-fields {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.product-photo-fields .media-picker {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
}

.product-photo-fields .media-picker-preview {
    min-height: 72px;
    aspect-ratio: 1 / 1;
}

.product-photo-fields .media-picker-info label {
    display: none;
}

.product-photo-fields .media-picker-actions {
    margin-top: 5px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.product-photo-options {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.product-photo-options .photo-order {
    width: 82px;
}

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

.empty-media-state {
    border: 1px dashed #c9d2df;
    background: #f8fafc;
    color: #667085;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
}

@media (max-width: 820px) {
    .product-photo-grid {
        grid-template-columns: 1fr;
    }

    .product-photo-card {
        grid-template-columns: 1fr;
    }
}

.reference-input-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
}

.category-banner-picker .media-picker {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    align-items: stretch !important;
}

.category-banner-picker .media-picker-preview,
.category-banner-picker .media-picker-banner {
    width: 100% !important;
    min-height: 132px !important;
    aspect-ratio: 6 / 1 !important;
}

.category-banner-picker .media-picker-info {
    width: 100% !important;
    min-width: 0 !important;
}

.category-banner-picker .media-picker-actions {
    justify-content: flex-start;
}

.product-add-photo-panel {
    border: 1px solid #cbd3df;
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.product-add-photo-panel .media-picker {
    grid-template-columns: 120px minmax(0, 1fr);
}

@media (max-width: 900px) {
    .product-add-photo-panel,
    .reference-input-row {
        grid-template-columns: 1fr;
    }
}


.list-toolbar-panel {
    padding: 12px 14px;
}

.list-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto 110px auto;
    gap: 12px;
    align-items: end;
}

.master-list-toolbar {
    grid-template-columns: minmax(260px, 1fr) auto;
}

.list-toolbar label {
    display: block;
    margin: 0 0 4px;
    font-size: .78rem;
    color: var(--muted);
}

.list-toolbar-search,
.list-toolbar-limit,
.list-toolbar-actions,
.list-toolbar-checks {
    min-width: 0;
}

.list-toolbar-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    align-items: center;
    padding-bottom: 6px;
}

.list-toolbar-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.erp-grid {
    max-width: 100%;
}

.erp-grid .dxbl-grid-table {
    width: 100%;
}

.erp-grid .dxbl-grid-header-row .dxbl-grid-header-content {
    min-width: 0;
}

.side-group summary,
.side-link {
    font-weight: 400 !important;
}

@media (max-width: 1180px) {
    .list-toolbar {
        grid-template-columns: 1fr 120px;
    }

    .list-toolbar-checks,
    .list-toolbar-actions {
        grid-column: 1 / -1;
    }

    .list-toolbar-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .list-toolbar,
    .master-list-toolbar {
        grid-template-columns: 1fr;
    }
}

/* DevExpress controls use the official Office White theme.
   Keep only outer layout spacing here; do not override internal buttons, inputs or paddings. */
.erp-air-form {
    --erp-field-height: 40px;
}

.erp-air-form .dxbl-fl .dxbl-row {
    row-gap: 18px !important;
}

.erp-air-form .dxbl-fl-cpt,
.erp-air-form .dxfl-caption,
.erp-field-label {
    display: block;
    width: 100%;
    padding-bottom: 6px;
    white-space: normal;
    line-height: 1.25;
    color: #334155;
    font-weight: 500;
}

.erp-air-form .dxbl-fl-ctrl {
    width: 100%;
    min-width: 0;
}

.erp-air-form .pro-native-input,
.erp-air-form .numeric-text-input {
    width: 100%;
    min-height: var(--erp-field-height);
    padding: 7px 12px;
    font-size: 14px;
    box-sizing: border-box;
}

.erp-form-card,
.product-form-panel {
    padding: 18px 20px 20px !important;
}

.product-main-panel-full {
    max-width: 100% !important;
}

.grid-panel,
.article-grid-panel {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.erp-grid-fluid,
.erp-grid-fluid .dxbl-grid,
.erp-grid-fluid .dxbl-grid-table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
}

.erp-grid-fluid .dxbl-grid-table th,
.erp-grid-fluid .dxbl-grid-table td {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
}

.erp-grid-fluid .dxbl-grid-cell,
.erp-grid-fluid .dxbl-grid-header-content {
    min-width: 0 !important;
    max-width: 100% !important;
}

@media (max-width: 1100px) {
    .erp-air-form .dxbl-fl .dxbl-row {
        row-gap: 14px !important;
    }

    .page-header.product-page-header,
    .page-header {
        gap: 16px;
        align-items: flex-start;
    }
}

.erp-air-form {
    --erp-field-height: 40px;
}

.erp-air-form .dxbl-fl .dxbl-row {
    row-gap: 18px !important;
}

.erp-air-form .dxbl-fl-cpt,
.erp-air-form .dxfl-caption,
.erp-field-label {
    display: block;
    width: 100%;
    padding-bottom: 6px;
    white-space: normal;
    line-height: 1.25;
    color: #334155;
    font-weight: 500;
}

.erp-air-form .dxbl-fl-ctrl {
    width: 100%;
    min-width: 0;
}

.erp-air-form .dxbl-text-edit,
.erp-air-form .dxbl-combobox,
.erp-air-form .dxbl-spin-edit,
.erp-air-form .dxbl-date-edit,
.erp-air-form .dxbl-memo {
    width: 100%;
    max-width: 100%;
}

.erp-air-form .pro-native-input,
.erp-air-form .numeric-text-input {
    width: 100%;
    min-height: var(--erp-field-height);
    padding: 7px 12px;
    font-size: 14px;
    box-sizing: border-box;
}

.erp-air-form .dxbl-memo {
    min-height: 96px;
}

.erp-grid-fluid,
.erp-grid-fluid .dxbl-grid {
    width: 100%;
    max-width: 100%;
}

.erp-grid-fluid .dxbl-grid-table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
}

.erp-grid-fluid .dxbl-grid-table th,
.erp-grid-fluid .dxbl-grid-table td {
    white-space: normal;
    overflow-wrap: anywhere;
}


.product-html-editor {
    min-height: 520px;
}

.reference-input-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.product-tabs .dxbl-tabs-item,
.product-tabs .dxbl-tabs-tab {
    min-width: fit-content;
}

.product-photo-options .photo-order {
    width: 120px;
}
.erp-air-form .dxbl-text-edit,
.erp-air-form .dxbl-combobox,
.erp-air-form .dxbl-date-edit,
.erp-air-form .dxbl-memo,
.erp-native-input {
    border-radius: 6px !important;
    min-height: 38px;
}

.erp-native-input {
    display: block;
    width: 100%;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #0f172a;
    padding: 7px 11px;
    font: inherit;
    box-sizing: border-box;
    outline: none;
}

.erp-native-input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.erp-number-input {
    text-align: right;
}

.erp-air-form .dxbl-checkbox,
.erp-air-form .dxbl-check-edit,
.list-toolbar-checks .dxbl-checkbox,
.list-toolbar-checks .dxbl-check-edit {
    align-items: center;
    min-height: 38px;
}

.product-form-panel .dxbl-fl-gd > .dxbl-fl-gd-header,
.product-form-panel .dxbl-fl-group-header {
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.product-html-editor {
    min-height: 620px !important;
}

.product-html-source .dxbl-memo-input,
.product-html-source textarea {
    min-height: 620px !important;
    font-family: Consolas, Monaco, monospace;
    line-height: 1.45;
}

.html-detail-tabs .dxbl-tabs-content-panel {
    padding-top: 14px;
}

.grid-panel,
.article-grid-panel {
    overflow: hidden !important;
}

.erp-grid,
.erp-grid .dxbl-grid,
.erp-grid .dxbl-grid-container,
.erp-grid .dxbl-grid-table {
    width: 100% !important;
    max-width: 100% !important;
}

.erp-grid .dxbl-grid-table {
    table-layout: fixed !important;
}

.erp-grid .dxbl-grid-table th,
.erp-grid .dxbl-grid-table td,
.erp-grid .dxbl-grid-cell,
.erp-grid .dxbl-grid-header-content {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.erp-grid .dxbl-grid-table > tbody > tr > td {
    height: 44px;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.erp-grid .dxbl-grid-filter-row td {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

@media (max-width: 1200px) {
    .erp-air-form .dxbl-fl .dxbl-col-md-3,
    .erp-air-form .dxbl-fl .dxbl-col-md-4,
    .erp-air-form .dxbl-fl .dxbl-col-md-5,
    .erp-air-form .dxbl-fl .dxbl-col-md-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

.product-main-panel,
.product-main-panel-full,
.product-tabs,
.product-tabs .dxbl-tabs,
.product-tabs .dxbl-tabs-content,
.product-tabs .dxbl-tabs-content-panel,
.html-editor-shell,
.html-detail-tabs,
.html-detail-tabs .dxbl-tabs,
.html-detail-tabs .dxbl-tabs-content,
.html-detail-tabs .dxbl-tabs-content-panel,
.product-html-editor,
.product-html-source,
.product-html-source .dxbl-memo-input,
.product-html-source textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.product-html-source textarea,
.product-html-source .dxbl-memo-input {
    resize: vertical;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.header-actions .dxbl-btn,
.list-toolbar-actions .dxbl-btn,
.product-photo-actions .dxbl-btn {
    max-width: 100%;
    min-width: 0;
    white-space: nowrap;
}

.header-actions .dxbl-btn .dxbl-btn-caption,
.list-toolbar-actions .dxbl-btn .dxbl-btn-caption,
.product-photo-actions .dxbl-btn .dxbl-btn-caption {
    overflow: hidden;
    text-overflow: ellipsis;
}

.erp-native-input[type=number]::-webkit-outer-spin-button,
.erp-native-input[type=number]::-webkit-inner-spin-button,
.product-tabs input[type=number]::-webkit-outer-spin-button,
.product-tabs input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.erp-native-input[type=number],
.product-tabs input[type=number] {
    -moz-appearance: textfield;
}

.process-loader-overlay {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(16, 24, 40, .28);
    backdrop-filter: blur(2px);
}

.process-loader-card {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 260px;
    padding: 18px 22px;
    border-radius: 18px;
    background: #fff;
    color: #17202a;
    font-weight: 700;
    box-shadow: 0 22px 60px rgba(16, 24, 40, .22);
}

.process-loader-spinner {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 3px solid #d0d5dd;
    border-top-color: #101828;
    animation: process-loader-spin .75s linear infinite;
}

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

.client-modern-page {
    max-width: 1180px;
    overflow: hidden;
}

.client-tabs,
.client-tabs .dxbl-tabs-content,
.client-tabs .dxbl-tabs-tabpane,
.client-tabs .dxbl-tabs-content-panel {
    max-width: 100%;
    overflow-x: hidden;
}

.client-linear-card {
    max-width: 860px;
}

.client-address-card {
    max-width: 960px;
}

.client-linear-form .dxbl-fl-gd,
.client-linear-form .dxbl-fl-group-content {
    max-width: 100%;
}

.client-linear-form .dxbl-fl-cpt {
    white-space: normal;
}

.client-address-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.client-address-item {
    padding: 18px;
    border: 1px solid #eaecf0;
    border-radius: 18px;
    background: #fcfcfd;
    margin-bottom: 18px;
}

.client-address-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.condition-grid-vertical {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

.dxbl-btn,
.dx-button,
.header-actions .dxbl-btn,
.list-toolbar-actions .dxbl-btn {
    max-width: 100%;
}

.dxbl-btn .dxbl-btn-caption,
.dx-button .dx-button-content,
.header-actions .dxbl-btn .dxbl-btn-caption,
.list-toolbar-actions .dxbl-btn .dxbl-btn-caption {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .client-address-header,
    .client-address-title {
        flex-direction: column;
        align-items: stretch;
    }

    .client-linear-card,
    .client-address-card {
        max-width: 100%;
    }
}

.client-page-header,
.client-modern-page,
.client-form-card,
.client-address-card {
    width: 100%;
    max-width: none;
}

.client-modern-page {
    overflow: visible;
}

.client-tabs,
.client-tabs .dxbl-tabs-content,
.client-tabs .dxbl-tabs-tabpane,
.client-tabs .dxbl-tabs-content-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
}

.client-form-card,
.client-address-card {
    margin-left: 0;
    margin-right: 0;
}

.client-smart-form .dxbl-fl-i {
    align-items: flex-start;
}

.field-xs,
.field-serie {
    width: 72px;
    max-width: 100%;
}

.field-code {
    width: 120px;
    max-width: 100%;
}

.field-cp {
    width: 140px;
    max-width: 100%;
}

.field-phone,
.field-nif {
    width: 190px;
    max-width: 100%;
}

.field-sm {
    width: 220px;
    max-width: 100%;
}

.field-md {
    width: 320px;
    max-width: 100%;
}

.field-money {
    width: 170px;
    max-width: 100%;
}

.field-lg {
    width: 520px;
    max-width: 100%;
}

.field-xl {
    width: min(860px, 100%);
    max-width: 100%;
}

.client-smart-form input,
.client-smart-form .dxbl-text-edit,
.client-smart-form .dxbl-combobox,
.client-smart-form .dxbl-memo,
.client-smart-form textarea {
    max-width: 100%;
}

.client-address-list {
    display: grid;
    gap: 12px;
}

.client-address-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    border: 1px solid #eaecf0;
    border-radius: 16px;
    background: #fcfcfd;
}

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

.address-title-line {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.address-text,
.address-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #667085;
    font-size: .92rem;
}

.address-meta {
    margin-top: 3px;
}

.default-pill {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 9px;
    border-radius: 999px;
    background: #eef4ff;
    color: #3538cd;
    font-size: .78rem;
    font-weight: 700;
}

.address-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.empty-list-card {
    padding: 18px;
    border: 1px dashed #d0d5dd;
    border-radius: 16px;
    color: #667085;
    background: #f9fafb;
}

.condition-grid-wrap {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px 24px;
}

.compact-options-card {
    margin-top: 18px;
}

.address-popup .dxbl-popup-body {
    overflow-x: hidden;
}

@media (max-width: 900px) {
    .client-address-row {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .address-actions {
        justify-content: flex-start;
    }

    .address-text,
    .address-meta {
        white-space: normal;
    }
}

.content {
    overflow-x: hidden;
}

.erp-page {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    box-sizing: border-box;
}

.erp-page > .page-header,
.erp-page > .product-main-panel,
.erp-page > .product-main-panel-full,
.erp-page > .panel,
.erp-page > .grid-panel,
.erp-page > .article-grid-panel,
.erp-page > section {
    max-width: 100%;
    box-sizing: border-box;
}

.erp-form-card,
.form-section-card,
.product-form-panel,
.panel {
    max-width: 100%;
    box-sizing: border-box;
}

.erp-air-form .dxbl-fl-ctrl,
.erp-air-form .dxbl-fl-item,
.erp-air-form .dxbl-fl-cpt {
    min-width: 0 !important;
}

.field-xs,
.field-serie {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 100% !important;
}

.field-code {
    width: 140px !important;
    min-width: 140px !important;
    max-width: 100% !important;
}

.field-cp {
    width: 125px !important;
    min-width: 125px !important;
    max-width: 100% !important;
}

.field-phone,
.field-nif {
    width: 210px !important;
    min-width: 180px !important;
    max-width: 100% !important;
}

.field-sm {
    width: 220px !important;
    min-width: 180px !important;
    max-width: 100% !important;
}

.field-md {
    width: 330px !important;
    min-width: 240px !important;
    max-width: 100% !important;
}

.field-money {
    width: 180px !important;
    min-width: 150px !important;
    max-width: 100% !important;
}

.field-lg {
    width: 520px !important;
    min-width: 280px !important;
    max-width: 100% !important;
}

.field-xl,
.field-full {
    width: 100% !important;
    min-width: 320px !important;
    max-width: 900px !important;
}

.field-xs .dxbl-text-edit,
.field-xs .dxbl-combobox,
.field-serie .dxbl-text-edit,
.field-serie .dxbl-combobox,
.field-code .dxbl-text-edit,
.field-code .dxbl-combobox,
.field-cp .dxbl-text-edit,
.field-cp .dxbl-combobox,
.field-phone .dxbl-text-edit,
.field-phone .dxbl-combobox,
.field-nif .dxbl-text-edit,
.field-nif .dxbl-combobox,
.field-sm .dxbl-text-edit,
.field-sm .dxbl-combobox,
.field-md .dxbl-text-edit,
.field-md .dxbl-combobox,
.field-money .dxbl-text-edit,
.field-money .dxbl-combobox,
.field-lg .dxbl-text-edit,
.field-lg .dxbl-combobox,
.field-xl .dxbl-text-edit,
.field-xl .dxbl-combobox,
.field-full .dxbl-text-edit,
.field-full .dxbl-combobox {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.client-modern-page {
    max-width: 1180px !important;
    width: 100% !important;
    overflow: visible !important;
}

.client-page-header {
    max-width: 1180px !important;
}

.client-form-card,
.client-address-card {
    width: 100% !important;
    max-width: 1180px !important;
}

.client-tabs,
.client-tabs .dxbl-tabs,
.client-tabs .dxbl-tabs-content,
.client-tabs .dxbl-tabs-content-panel,
.client-tabs .dxbl-tabs-tabpane {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.address-popup .dxbl-popup,
.address-popup .dxbl-popup-content {
    max-width: 96vw !important;
}

.erp-grid,
.erp-grid-fluid,
.grid-panel,
.article-grid-panel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.grid-panel,
.article-grid-panel,
.erp-grid-wrap {
    overflow-x: auto !important;
    overflow-y: visible;
}

.erp-grid .dxbl-grid,
.erp-grid-fluid .dxbl-grid,
.erp-grid .dxbl-grid-container,
.erp-grid-fluid .dxbl-grid-container {
    max-width: 100% !important;
    min-width: 0 !important;
}

.erp-grid .dxbl-grid-table,
.erp-grid-fluid .dxbl-grid-table {
    width: 100% !important;
    table-layout: fixed !important;
}

.erp-grid .dxbl-grid-table th,
.erp-grid .dxbl-grid-table td,
.erp-grid-fluid .dxbl-grid-table th,
.erp-grid-fluid .dxbl-grid-table td {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.erp-grid .dxbl-grid-filter-row input,
.erp-grid-fluid .dxbl-grid-filter-row input,
.erp-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.erp-grid-fluid .dxbl-grid-filter-row .dxbl-text-edit-input {
    min-width: 0 !important;
}

.header-actions,
.list-toolbar-actions,
.popup-actions,
.address-actions {
    min-width: 0;
}

.header-actions .dxbl-btn,
.list-toolbar-actions .dxbl-btn,
.popup-actions .dxbl-btn,
.address-actions .dxbl-btn {
    min-width: 76px;
    max-width: 150px;
}

.header-actions .dxbl-btn .dxbl-btn-caption,
.list-toolbar-actions .dxbl-btn .dxbl-btn-caption,
.popup-actions .dxbl-btn .dxbl-btn-caption,
.address-actions .dxbl-btn .dxbl-btn-caption {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 1500px) {
    .erp-page {
        max-width: 1360px;
    }
}

@media (max-width: 1200px) {
    .erp-page {
        max-width: 100%;
    }

    .field-xs,
    .field-serie,
    .field-code,
    .field-cp,
    .field-phone,
    .field-nif,
    .field-sm,
    .field-md,
    .field-money,
    .field-lg,
    .field-xl,
    .field-full {
        min-width: 0 !important;
    }
}

.sap-page-header,
.sap-master-card {
    width: min(100%, 1240px) !important;
    max-width: 1240px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

.sap-page-header {
    align-items: flex-start;
}

.sap-master-card {
    background: #fff;
    border: 1px solid #d0d7e2;
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(16, 24, 40, .06);
    padding: 22px;
    overflow: hidden;
}

.sap-card-title,
.sap-section-title {
    color: #10233f;
    font-weight: 700;
}

.sap-card-title {
    font-size: 1.05rem;
    margin-bottom: 18px;
}

.sap-section-title {
    font-size: .95rem;
    margin-bottom: 14px;
}

.sap-section {
    border-top: 1px solid #e4e9f0;
    padding: 20px 0 4px;
    margin-top: 4px;
    max-width: 100%;
    overflow: hidden;
}

.sap-section:first-child {
    border-top: 0;
}

.sap-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.sap-tabs {
    display: block;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-top: 22px;
}

.sap-tabs .dxbl-tabs,
.sap-tabs .dxbl-tabs-tablist,
.sap-tabs .dxbl-tabs-content,
.sap-tabs .dxbl-tabs-content-panel,
.sap-tabs .dxbl-tabs-tabpane {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.sap-form {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 16px 24px;
    align-items: end;
    max-width: 100%;
}

.sap-popup-form {
    padding: 4px 2px 12px;
}

.sap-form-master {
    padding-bottom: 8px;
}

.sap-form-numbers {
    grid-template-columns: repeat(12, minmax(72px, 1fr));
}

.sap-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    box-sizing: border-box;
}

.sap-field > label {
    color: #344054;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.15;
    min-height: 15px;
}

.sap-field-xs { grid-column: span 1; min-width: 82px; max-width: 110px; }
.sap-field-day { grid-column: span 1; min-width: 90px; max-width: 110px; }
.sap-field-percent { grid-column: span 2; min-width: 126px; max-width: 160px; }
.sap-field-code { grid-column: span 2; min-width: 140px; max-width: 180px; }
.sap-field-cp { grid-column: span 2; min-width: 130px; max-width: 160px; }
.sap-field-ref { grid-column: span 5; min-width: 280px; max-width: 520px; }
.sap-field-short { grid-column: span 3; min-width: 180px; max-width: 260px; }
.sap-field-phone { grid-column: span 2; min-width: 160px; max-width: 210px; }
.sap-field-date { grid-column: span 2; min-width: 170px; max-width: 210px; }
.sap-field-money { grid-column: span 2; min-width: 150px; max-width: 190px; }
.sap-field-medium { grid-column: span 4; min-width: 250px; max-width: 360px; }
.sap-field-long { grid-column: span 6; min-width: 360px; max-width: 560px; }
.sap-field-full { grid-column: 1 / -1; min-width: 0; max-width: 940px; }
.sap-field-check { grid-column: span 3; min-width: 180px; max-width: 280px; }
.sap-field-button { grid-column: span 2; min-width: 120px; max-width: 150px; }

.sap-field .dxbl-text-edit,
.sap-field .dxbl-combobox,
.sap-field .dxbl-date-edit,
.sap-field .dxbl-memo,
.sap-field .form-control,
.sap-field .erp-native-input,
.sap-field input,
.sap-field textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.sap-field .dxbl-text-edit,
.sap-field .dxbl-combobox,
.sap-field .dxbl-date-edit,
.sap-field .form-control,
.sap-field .erp-native-input {
    min-height: 38px !important;
    border-radius: 8px !important;
}

.sap-field .dxbl-memo textarea,
.sap-field textarea {
    resize: vertical;
}

.sap-inline-control {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.sap-inline-control > .dxbl-text-edit,
.sap-inline-control > .dxbl-combobox,
.sap-inline-control > input {
    flex: 1 1 auto;
    min-width: 0 !important;
}

.sap-inline-control > .dxbl-btn {
    flex: 0 0 auto;
}

.sap-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px 24px;
    align-items: center;
    max-width: 920px;
}

.sap-html-section,
.html-editor-shell {
    max-width: 100% !important;
    overflow: hidden !important;
}

.sap-inner-tabs,
.html-detail-tabs,
.html-detail-tabs .dxbl-tabs,
.html-detail-tabs .dxbl-tabs-content,
.html-detail-tabs .dxbl-tabs-content-panel,
.html-detail-tabs .dxbl-tabs-tabpane {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.product-html-editor,
.product-html-source,
.product-html-source .dxbl-memo,
.product-html-source textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.product-html-editor {
    min-height: 460px !important;
}

.product-html-source textarea {
    min-height: 460px !important;
    font-family: Consolas, "Courier New", monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.sap-address-list {
    display: grid;
    gap: 10px;
}

.client-address-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    max-width: 100%;
}

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

.address-text,
.address-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.address-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.sap-actions .dxbl-btn,
.sap-field-button .dxbl-btn,
.product-images-toolbar .dxbl-btn,
.address-actions .dxbl-btn,
.popup-actions .dxbl-btn {
    min-width: 76px !important;
    max-width: 140px !important;
    overflow: hidden !important;
}

.sap-actions .dxbl-btn-caption,
.sap-field-button .dxbl-btn-caption,
.product-images-toolbar .dxbl-btn-caption,
.address-actions .dxbl-btn-caption,
.popup-actions .dxbl-btn-caption {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.erp-page {
    max-width: 1320px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

.content {
    overflow-x: hidden !important;
}

.grid-panel,
.article-grid-panel,
.erp-grid-wrap,
.sap-master-card .dxbl-grid,
.sap-master-card .dxbl-grid-container {
    max-width: 100% !important;
    overflow-x: auto !important;
    box-sizing: border-box !important;
}

.sap-order-input {
    width: 90px !important;
}

@media (max-width: 1180px) {
    .sap-page-header,
    .sap-master-card {
        width: 100% !important;
        max-width: 100% !important;
    }

    .sap-form {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .sap-field-xs,
    .sap-field-day,
    .sap-field-percent,
    .sap-field-code,
    .sap-field-cp,
    .sap-field-ref,
    .sap-field-short,
    .sap-field-phone,
    .sap-field-date,
    .sap-field-money,
    .sap-field-medium,
    .sap-field-long,
    .sap-field-full,
    .sap-field-check,
    .sap-field-button {
        grid-column: span 3;
        max-width: none;
        min-width: 0;
    }

    .sap-field-full {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    .sap-form {
        grid-template-columns: 1fr;
    }

    .sap-field-xs,
    .sap-field-day,
    .sap-field-percent,
    .sap-field-code,
    .sap-field-cp,
    .sap-field-ref,
    .sap-field-short,
    .sap-field-phone,
    .sap-field-date,
    .sap-field-money,
    .sap-field-medium,
    .sap-field-long,
    .sap-field-full,
    .sap-field-check,
    .sap-field-button {
        grid-column: 1 / -1;
        max-width: none;
        min-width: 0;
    }

    .client-address-row {
        grid-template-columns: 1fr;
    }
}

.content {
    padding: 18px 22px;
    overflow-x: hidden;
}

.erp-page {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    min-width: 0;
}

.erp-topline {
    max-width: 1240px;
    margin: 0 auto 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 30px;
}

.user-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 4px 8px;
    border: 1px solid #cfd7e6;
    border-radius: 4px;
    background: #fff;
    color: #344054;
    font-size: .78rem;
}

.user-chip a {
    color: #1f5eff;
    text-decoration: none;
    font-weight: 600;
}

.sap-page-header,
.page-header {
    margin-bottom: 10px;
}

.sap-master-card,
.erp-form-card,
.form-section-card,
.panel,
.data-table {
    border-radius: 4px !important;
    box-shadow: none !important;
}

.sap-master-card {
    padding: 10px 12px !important;
}

.permissions-card {
    overflow: hidden;
}

.permissions-toolbar {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 10px 12px;
    border-bottom: 1px solid #d9e2ef;
    color: #52657f;
    font-size: 12px;
}

.permissions-matrix-wrap {
    max-width: 100%;
    overflow: auto;
}

.permissions-matrix {
    min-width: 980px;
}

.permissions-matrix th,
.permissions-matrix td {
    vertical-align: middle;
}

.permissions-matrix .permission-module {
    width: 120px;
}

.permissions-matrix .permission-action {
    width: 130px;
}

.permissions-matrix .permission-description {
    min-width: 360px;
}

.permissions-matrix .permission-role {
    min-width: 94px;
    text-align: center;
    white-space: nowrap;
}

.permissions-matrix .permission-check {
    text-align: center;
}

.permission-group-row td {
    background: #edf3f9;
    color: #0b2545;
    font-weight: 600;
    letter-spacing: 0;
}

.sap-card-title,
.sap-section-title {
    margin-bottom: 7px !important;
    font-size: .92rem !important;
    font-weight: 650;
}

.sap-form {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 7px 10px !important;
    align-items: end;
}

.sap-field {
    min-width: 0;
}

.sap-field label {
    display: block;
    margin: 0 0 2px !important;
    color: #475467;
    font-size: .72rem !important;
    line-height: 1.1;
    font-weight: 600;
}

.sap-field .dxbl-text-edit,
.sap-field .dxbl-combobox,
.sap-field .dxbl-spin-edit,
.sap-field .dxbl-memo,
.sap-field .form-control,
.pro-native-input,
.form-control {
    min-height: 31px !important;
    height: 31px;
    border-radius: 3px !important;
    font-size: .86rem;
}

.sap-field textarea,
.sap-field .dxbl-memo,
.sap-field .dxbl-memo textarea {
    height: auto !important;
    min-height: 76px !important;
}

.sap-field-code,
.sap-field-xs,
.sap-field-cp,
.sap-field-day,
.sap-field-money,
.sap-field-phone,
.sap-field-short,
.sap-field-medium,
.sap-field-long,
.sap-field-full,
.sap-field-check {
    grid-column: span 2;
}

.sap-field-xs,
.sap-field-day {
    grid-column: span 1;
    min-width: 74px;
}

.sap-field-code,
.sap-field-cp,
.sap-field-phone,
.sap-field-money,
.sap-field-short {
    grid-column: span 2;
    min-width: 120px;
}

.sap-field-medium {
    grid-column: span 3;
    min-width: 170px;
}

.sap-field-long {
    grid-column: span 4;
    min-width: 240px;
}

.sap-field-full {
    grid-column: span 8;
    min-width: 320px;
}

.sap-field-check {
    grid-column: span 2;
    min-width: 110px;
}

.sap-tabs {
    margin-top: 10px;
}

.sap-section {
    padding: 9px 0 0;
}

.sap-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, max-content));
    gap: 5px 14px;
    align-items: center;
}

.sap-check-grid .dxbl-check,
.dx-check-line {
    border-radius: 3px !important;
    min-height: 27px !important;
    height: 27px !important;
    padding: 0 6px !important;
}

.btn,
.dxbl-btn {
    border-radius: 3px !important;
    min-height: 31px !important;
    padding: 5px 10px !important;
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn-small,
.btn-small.dxbl-btn {
    min-height: 27px !important;
    padding: 3px 7px !important;
    font-size: .78rem !important;
}

.table-wrap,
.erp-grid-wrap {
    max-width: 100%;
    overflow-x: auto;
    border-radius: 4px !important;
}

.data-table th,
.data-table td {
    padding: 6px 8px !important;
    font-size: .84rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.client-address-row {
    border-radius: 4px !important;
    padding: 8px 10px !important;
}

.login-body {
    min-height: 100vh;
    margin: 0;
    background: #eef3f8;
    color: #111827;
    font-family: Inter, Segoe UI, system-ui, -apple-system, sans-serif;
}

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

.login-card {
    width: min(326px, 100%);
    overflow: hidden;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 18px 38px rgba(15, 23, 42, .13);
}

.login-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 22px 22px 7px;
    background: transparent;
}

.login-brand img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    display: block;
}

.login-wordmark {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    color: #111827;
    font-size: 1.38rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1;
}

.login-wordmark strong {
    color: #1f5eff;
    font-style: italic;
    font-weight: 800;
}

.login-card h1 {
    margin: 12px 24px 0;
    color: #101828;
    font-size: 1.05rem;
    font-weight: 700;
    text-align: center;
}

.login-card p {
    margin: 8px 26px 0;
    color: #667085;
    text-align: center;
}

.login-form {
    display: grid;
    gap: 10px;
    padding: 16px 24px 24px;
}

.login-field {
    display: grid;
    gap: 4px;
    color: #475467;
    font-size: .76rem;
    font-weight: 600;
}

.login-field input {
    min-height: 34px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 6px 9px;
    color: #101828;
    background: #fff;
    font-size: .9rem;
}

.login-field input:focus {
    border-color: #1f5eff;
    outline: 2px solid rgba(31, 94, 255, .16);
}

.login-secondary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 24px;
    margin-top: 2px;
}

.login-remember {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #475467;
    font-size: .74rem;
    font-weight: 600;
    line-height: 1;
}

.login-remember input {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: #1f5eff;
}

.login-secondary a {
    color: #1f5eff;
    font-size: .74rem;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}

.login-secondary a:hover {
    color: #164bd8;
    text-decoration: underline;
}

.login-form button,
.login-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 7px 14px;
    border: 0;
    border-radius: 4px;
    background: #1f5eff;
    color: #fff;
    text-decoration: none;
    font-weight: 650;
}

.login-form button:hover,
.login-link:hover {
    background: #164bd8;
}

.login-error {
    margin: 14px 24px 0;
    padding: 8px 10px;
    border: 1px solid #fecdca;
    border-radius: 4px;
    background: #fef3f2;
    color: #b42318;
    font-size: .84rem;
}

.store-login-body {
    background: linear-gradient(135deg, #eef8fc, #fff7ec);
}

.store-login-body .login-card {
    border-color: #d8e4ea;
    box-shadow: 0 18px 38px rgba(7, 85, 123, .14);
}

.store-login-body .login-brand img {
    width: 142px;
    height: auto;
}

.store-login-body .login-wordmark {
    display: none;
}

.store-login-body .login-card h1 {
    color: #07557b;
    font-size: 1.22rem;
}

.store-login-body .login-field input:focus {
    border-color: #008fca;
    outline-color: rgba(0, 143, 202, .18);
}

.store-login-body .login-remember input {
    accent-color: #008fca;
}

.store-login-body .login-secondary a {
    color: #07557b;
}

.store-login-body .login-form button {
    background: #f28c1b;
}

.store-login-body .login-form button:hover {
    background: #d36f00;
}

.role-check-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    padding: 6px 8px;
    border: 1px solid #cfd7e6;
    border-radius: 3px;
    min-height: 31px;
    background: #fff;
}

.role-check-list label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0 !important;
    font-size: .84rem !important;
    color: #344054;
    text-transform: none;
}

.inline-help-box {
    min-height: 31px;
    display: flex;
    align-items: center;
    padding: 5px 8px;
    border: 1px solid #cfd7e6;
    border-radius: 3px;
    background: #f8fafc;
    color: #475467;
    font-size: .82rem;
}

@media (max-width: 980px) {
    .sap-form {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .sap-field-full,
    .sap-field-long {
        grid-column: span 6;
    }
}

@media (max-width: 640px) {
    .content {
        padding: 12px;
    }

    .sap-form {
        grid-template-columns: 1fr;
    }

    .sap-field-code,
    .sap-field-xs,
    .sap-field-cp,
    .sap-field-day,
    .sap-field-money,
    .sap-field-phone,
    .sap-field-short,
    .sap-field-medium,
    .sap-field-long,
    .sap-field-full,
    .sap-field-check {
        grid-column: auto;
        min-width: 0;
    }
}

.sap-page-header,
.sap-master-card,
.erp-page,
.erp-topline {
    width: min(100%, 1080px) !important;
    max-width: 1080px !important;
}

.sap-master-card {
    padding: 10px 12px !important;
}

.sap-form {
    gap: 6px 9px !important;
}

.sap-field > label,
.sap-field label {
    margin-bottom: 1px !important;
}

.sap-field-line {
    grid-column: 1 / -1;
    max-width: 560px;
    min-width: 280px;
}

.sap-field .dxbl-spin-edit,
.sap-field .dxbl-spin-edit .dxbl-text-edit,
.sap-field .dxbl-spin-edit input,
.sap-field input[type="number"],
.sap-field .numeric-text-input,
.numeric-text-input {
    border-radius: 3px !important;
}

.sap-field .dxbl-spin-edit .dxbl-spin-btn,
.sap-field .dxbl-spin-edit .dxbl-edit-btn,
.sap-field .dxbl-spin-edit button {
    border-radius: 0 !important;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield;
}

@media (max-width: 720px) {
    .sap-field-line {
        grid-column: 1 / -1;
        max-width: none;
        min-width: 0;
    }
}


.list-page,
.article-list-page {
    width: 100% !important;
    max-width: none !important;
}

.list-page > .page-header,
.article-list-page > .page-header,
.list-page > .panel,
.article-list-page > .panel,
.list-page .grid-panel,
.article-list-page .grid-panel,
.list-page .list-toolbar-panel,
.article-list-page .list-toolbar-panel {
    width: 100% !important;
    max-width: none !important;
}

.erp-grid-fluid,
.erp-grid-fluid .dxbl-grid,
.erp-grid-fluid .dxbl-grid-table,
.grid-panel .dxbl-grid,
.article-grid-panel .dxbl-grid {
    width: 100% !important;
    max-width: 100% !important;
}

.grid-panel {
    overflow-x: auto !important;
}

.sap-field .numeric-text-input,
.sap-field input.numeric-text-input,
.sap-field .pro-native-input.numeric-text-input,
.numeric-text-input.form-control,
input.numeric-text-input,
.sap-field input[inputmode="decimal"],
.sap-field input[inputmode="numeric"] {
    border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
    appearance: textfield;
    min-height: 31px !important;
    height: 31px !important;
}

.sap-field .dxbl-spin-edit,
.sap-field .dxbl-spin-edit *,
.sap-field .dxbl-spin-edit input,
.sap-field .dxbl-spin-edit .dxbl-text-edit,
.sap-field .dxbl-spin-edit .dxbl-edit,
.sap-field .dxbl-spin-edit .dxbl-input-group,
.sap-field .dxbl-spin-edit .dxbl-btn,
.sap-field .dxbl-spin-edit button {
    border-radius: 3px !important;
}

.sap-discounts-row {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(118px, 150px));
    gap: 7px 10px;
    align-items: end;
    width: fit-content;
    max-width: 100%;
}

.sap-discounts-row .sap-field-percent {
    grid-column: auto;
    min-width: 118px;
    max-width: 150px;
}

@media (max-width: 720px) {
    .sap-discounts-row {
        width: 100%;
        grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
    }

    .sap-discounts-row .sap-field-percent {
        max-width: none;
    }
}

/* Size profiles by screen type */
.content {
    overflow-x: hidden;
}

.page-header,
.panel,
.sap-page-header,
.sap-master-card {
    box-sizing: border-box !important;
}

.sap-page-header,
.sap-master-card {
    width: min(100%, 1080px) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.client-page-header,
.client-modern-page,
.sap-product-card {
    width: min(100%, 1200px) !important;
    max-width: 1200px !important;
}

.grid-panel,
.article-grid-panel,
.list-page .panel,
.list-page .grid-panel {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.grid-panel .dxbl-grid,
.article-grid-panel .dxbl-grid,
.grid-panel .dxbl-grid-table,
.article-grid-panel .dxbl-grid-table {
    max-width: 100% !important;
}

.dxbl-popup .sap-master-card,
.dxbl-popup .sap-page-header,
.dxbl-popup .panel,
.sap-popup-form {
    width: 100% !important;
    max-width: 760px !important;
}

.sap-form {
    column-gap: 16px !important;
    row-gap: 10px !important;
}

.sap-field {
    min-width: 0 !important;
    gap: 4px !important;
}

.sap-field-xs,
.sap-field-day {
    min-width: 86px !important;
    max-width: 112px !important;
}

.sap-field-percent,
.sap-field-money {
    min-width: 132px !important;
    max-width: 170px !important;
}

.sap-field-code,
.sap-field-cp {
    min-width: 130px !important;
    max-width: 180px !important;
}

.sap-field-phone,
.sap-field-date {
    min-width: 155px !important;
    max-width: 220px !important;
}

.sap-field-short {
    min-width: 180px !important;
    max-width: 280px !important;
}

.sap-field-medium {
    min-width: 240px !important;
    max-width: 420px !important;
}

.sap-field-long {
    min-width: 320px !important;
    max-width: 620px !important;
}

.sap-field-full {
    width: 100% !important;
    max-width: 100% !important;
}

.sap-field input,
.sap-field textarea,
.sap-field .form-control,
.sap-field .erp-native-input,
.sap-field .dxbl-text-edit,
.sap-field .dxbl-spin-edit,
.sap-field .dxbl-combobox,
.sap-field .dxbl-date-edit,
.sap-field .dxbl-memo,
.sap-field .dxbl-edit,
.sap-field .dxbl-input-group,
.sap-field .dxbl-input-group > .dxbl-text-edit {
    border-radius: 3px !important;
}

input[type="number"],
input.numeric-input,
.field-money input,
.field-percent input,
.sap-field-money input,
.sap-field-percent input {
    border-radius: 3px !important;
}

.sap-master-card {
    padding: 16px !important;
    border-radius: 8px !important;
}

.sap-card-title {
    margin-bottom: 12px !important;
}

.sap-section {
    padding-top: 14px !important;
}

@media (max-width: 1240px) {
    .client-page-header,
    .client-modern-page,
    .sap-product-card,
    .sap-page-header,
    .sap-master-card {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 820px) {
    .sap-form {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }

    .sap-field-xs,
    .sap-field-day,
    .sap-field-percent,
    .sap-field-code,
    .sap-field-cp,
    .sap-field-phone,
    .sap-field-date,
    .sap-field-money,
    .sap-field-short,
    .sap-field-medium,
    .sap-field-long,
    .sap-field-full,
    .sap-field-check,
    .sap-field-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

.erp-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

.erp-kpi {
    border: 1px solid var(--border-color, #d9dee8);
    background: #fff;
    padding: 8px 10px;
    min-height: 56px;
}

.erp-kpi span {
    display: block;
    font-size: 11px;
    color: #667085;
    margin-bottom: 4px;
}

.erp-kpi strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
}

.erp-compact-grid {
    margin-top: 8px;
}

.list-page,
.comercial-list-page,
.grid-panel-fluid {
    width: 100%;
    max-width: none;
}

.commercial-ficha-card {
    max-width: 1200px;
}

.commercial-header-form {
    grid-template-columns: repeat(auto-fit, minmax(110px, max-content));
}

.commercial-lines-wrap,
.client-contacts-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
}

.commercial-lines-table,
.client-contacts-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 1120px;
}

.client-contacts-table {
    min-width: 960px;
}

.commercial-lines-table th,
.commercial-lines-table td,
.client-contacts-table th,
.client-contacts-table td {
    border-bottom: 1px solid #e5e7eb;
    padding: 6px 6px;
    vertical-align: middle;
    white-space: nowrap;
}

.commercial-lines-table th,
.client-contacts-table th {
    font-size: 11px;
    text-transform: uppercase;
    color: #64748b;
    font-weight: 700;
    background: #f8fafc;
}

.commercial-lines-table input,
.client-contacts-table input {
    height: 32px;
    min-height: 32px;
    border-radius: 3px;
}

.line-num { width: 42px; }
.line-ref { width: 130px; }
.line-qty { width: 82px; }
.line-money { width: 100px; }
.line-disc { width: 76px; }
.line-date { width: 130px; }
.line-check { width: 64px; }
.line-total { width: 110px; }
.line-actions { width: 52px; }
.line-total-cell { text-align: right; font-weight: 700; }

.commercial-totals {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.commercial-totals div {
    min-width: 130px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 8px 10px;
    background: #f8fafc;
}

.commercial-totals span {
    display: block;
    font-size: 11px;
    color: #64748b;
    text-transform: uppercase;
    font-weight: 700;
}

.commercial-totals strong {
    display: block;
    text-align: right;
    font-size: 16px;
}

.warning-panel {
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #92400e;
}

.status-danger {
    background: #fee2e2;
    color: #991b1b;
}

.status-warning {
    background: #fef3c7;
    color: #92400e;
}

@media (max-width: 900px) {
    .commercial-ficha-card {
        max-width: 100%;
    }

    .commercial-header-form {
        grid-template-columns: 1fr;
    }
}

.comercial-list-page,
.list-page {
    width: 100%;
    max-width: none;
}

.grid-panel-fluid,
.erp-grid-fluid,
.commercial-grid {
    width: 100%;
    max-width: 100%;
}

.commercial-ficha-card {
    max-width: 1200px;
}

.commercial-lines-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
}

.commercial-lines-table input.pro-native-input,
.commercial-lines-table .dxbl-text-edit,
.commercial-header-form input.pro-native-input,
.commercial-header-form .dxbl-text-edit {
    border-radius: 3px !important;
}

.erp-page {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.erp-topline {
    max-width: none !important;
}

.list-page,
.comercial-list-page,
.article-list-page {
    width: 100% !important;
    max-width: none !important;
}

.list-page .grid-panel,
.comercial-list-page .grid-panel,
.article-list-page .grid-panel,
.grid-panel-fluid,
.article-grid-panel {
    width: 100% !important;
    max-width: none !important;
}

.list-page .dxbl-grid,
.comercial-list-page .dxbl-grid,
.article-list-page .dxbl-grid,
.erp-grid-fluid,
.erp-grid-fluid .dxbl-grid,
.erp-grid-fluid .dxbl-grid-table {
    width: 100% !important;
    max-width: 100% !important;
}

.sap-page-header,
.sap-master-card,
.commercial-ficha-card {
    margin-left: auto !important;
    margin-right: auto !important;
}

.product-picker {
    display: grid;
    gap: 12px;
}

.product-picker-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;
}

.product-picker-grid-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid #d9dee8;
    border-radius: 6px;
}

.product-picker-selected {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 8px 12px;
    align-items: end;
    border: 1px solid #d9dee8;
    background: #f8fafc;
    padding: 12px;
    border-radius: 6px;
}

.product-picker-selected .sap-field-code { grid-column: span 2; }
.product-picker-selected .sap-field-long { grid-column: span 5; }
.product-picker-selected .sap-field-money,
.product-picker-selected .sap-field-percent,
.product-picker-selected .sap-field-date { grid-column: span 2; }
.product-picker-selected .sap-field-check { grid-column: span 1; }

.product-picker-message {
    padding: 10px 12px;
    border-radius: 6px;
}

@media (max-width: 900px) {
    .product-picker-search,
    .product-picker-selected {
        grid-template-columns: 1fr;
    }

    .product-picker-selected .sap-field-code,
    .product-picker-selected .sap-field-long,
    .product-picker-selected .sap-field-money,
    .product-picker-selected .sap-field-percent,
    .product-picker-selected .sap-field-date,
    .product-picker-selected .sap-field-check {
        grid-column: 1 / -1;
        max-width: none !important;
        width: 100% !important;
    }
}

/* 2026-05-19: listados full width y popup producto en pedidos */
.master-list-page,
.list-page,
.comercial-list-page,
.article-list-page {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.master-list-page > .page-header,
.master-list-page > .panel,
.master-list-page .list-toolbar-panel,
.master-list-page .grid-panel,
.list-page > .page-header,
.list-page > .panel,
.list-page .list-toolbar-panel,
.list-page .grid-panel,
.comercial-list-page > .page-header,
.comercial-list-page > .panel,
.comercial-list-page .list-toolbar-panel,
.comercial-list-page .grid-panel,
.article-list-page > .page-header,
.article-list-page > .panel,
.article-list-page .list-toolbar-panel,
.article-list-page .grid-panel {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

.master-list-page .dxbl-grid,
.master-list-page .dxbl-grid-container,
.master-list-page .dxbl-grid-table,
.list-page .dxbl-grid,
.list-page .dxbl-grid-container,
.list-page .dxbl-grid-table,
.comercial-list-page .dxbl-grid,
.comercial-list-page .dxbl-grid-container,
.comercial-list-page .dxbl-grid-table,
.article-list-page .dxbl-grid,
.article-list-page .dxbl-grid-container,
.article-list-page .dxbl-grid-table {
    width: 100% !important;
    max-width: none !important;
}

.master-list-page .grid-panel,
.list-page .grid-panel,
.comercial-list-page .grid-panel,
.article-list-page .grid-panel {
    overflow-x: auto !important;
}

.commercial-lines-table {
    width: 100% !important;
    min-width: 1520px;
    table-layout: fixed;
}

.commercial-lines-table .line-detail,
.commercial-lines-table .line-detail-cell {
    width: 360px;
    min-width: 360px;
}

.commercial-lines-table .line-detail-input {
    min-width: 340px !important;
}

.commercial-lines-table .line-disc {
    width: 92px;
    min-width: 92px;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-content,
.product-picker-popup .dxbl-popup-body {
    max-width: 96vw !important;
}

.product-picker-selected .product-picker-detail-field {
    grid-column: span 6 !important;
    max-width: none !important;
}

.product-picker-selected .sap-field-percent {
    min-width: 118px !important;
    max-width: none !important;
}

/* Ajuste final listados full-width y lineas comerciales compactas */
.content {
    min-width: 0 !important;
}

.erp-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.list-page,
.master-list-page,
.comercial-list-page,
.article-list-page {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.list-page > .page-header,
.master-list-page > .page-header,
.comercial-list-page > .page-header,
.article-list-page > .page-header,
.list-page > .panel,
.master-list-page > .panel,
.comercial-list-page > .panel,
.article-list-page > .panel,
.list-page .grid-panel,
.master-list-page .grid-panel,
.comercial-list-page .grid-panel,
.article-list-page .grid-panel,
.list-page .list-toolbar-panel,
.master-list-page .list-toolbar-panel,
.comercial-list-page .list-toolbar-panel,
.article-list-page .list-toolbar-panel {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.list-page .dxbl-grid,
.master-list-page .dxbl-grid,
.comercial-list-page .dxbl-grid,
.article-list-page .dxbl-grid,
.list-page .dxbl-grid-container,
.master-list-page .dxbl-grid-container,
.comercial-list-page .dxbl-grid-container,
.article-list-page .dxbl-grid-container,
.list-page .dxbl-grid-table,
.master-list-page .dxbl-grid-table,
.comercial-list-page .dxbl-grid-table,
.article-list-page .dxbl-grid-table,
.erp-grid-fluid,
.erp-grid-fluid .dxbl-grid,
.erp-grid-fluid .dxbl-grid-container,
.erp-grid-fluid .dxbl-grid-table {
    width: 100% !important;
    max-width: none !important;
    min-width: 100% !important;
}

.list-page .dxbl-grid table,
.master-list-page .dxbl-grid table,
.comercial-list-page .dxbl-grid table,
.article-list-page .dxbl-grid table {
    width: 100% !important;
    min-width: 100% !important;
}

.erp-grid,
.erp-grid .dxbl-grid-table,
.erp-grid .dxbl-grid-header-row,
.erp-grid .dxbl-grid-data-row {
    font-size: 12px !important;
}

.erp-grid .dxbl-grid-header-row > td,
.erp-grid .dxbl-grid-header-row > th,
.erp-grid .dxbl-grid-data-row > td,
.erp-grid .dxbl-grid-data-row > th {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    line-height: 1.25 !important;
}

.commercial-lines-table {
    min-width: 1260px !important;
    table-layout: fixed !important;
    font-size: 12px !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    padding: 3px 4px !important;
    height: 30px !important;
    line-height: 1.2 !important;
}

.commercial-lines-table input,
.commercial-lines-table .dxbl-text-edit,
.commercial-lines-table .dxbl-edit {
    height: 26px !important;
    min-height: 26px !important;
    font-size: 12px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.commercial-lines-table .line-detail,
.commercial-lines-table .line-detail-cell {
    width: 460px !important;
    min-width: 460px !important;
}

.commercial-lines-table .line-detail-input {
    width: 100% !important;
    min-width: 440px !important;
}

.commercial-lines-table .line-ref { width: 118px !important; }
.commercial-lines-table .line-qty { width: 74px !important; }
.commercial-lines-table .line-money { width: 86px !important; }
.commercial-lines-table .line-disc { width: 74px !important; }
.commercial-lines-table .line-date { width: 116px !important; }
.commercial-lines-table .line-check { width: 52px !important; }
.commercial-lines-table .line-total { width: 92px !important; }
.commercial-lines-table .line-actions { width: 42px !important; }

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 96vw !important;
}

.product-picker {
    gap: 8px !important;
    font-size: 12px !important;
}

.product-picker-selected {
    padding: 8px !important;
    gap: 6px 8px !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

.product-picker-selected .product-picker-detail-field {
    grid-column: span 7 !important;
}

.product-picker-grid .dxbl-grid,
.product-picker-grid .dxbl-grid-table,
.product-picker-grid .dxbl-grid-header-row,
.product-picker-grid .dxbl-grid-data-row {
    font-size: 12px !important;
}

.product-picker-grid .dxbl-grid-header-row > td,
.product-picker-grid .dxbl-grid-header-row > th,
.product-picker-grid .dxbl-grid-data-row > td,
.product-picker-grid .dxbl-grid-data-row > th {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    line-height: 1.25 !important;
}

/* 2026-05-19: correcciones listados, popup producto y lineas pedido */
.content:has(.list-page),
.content:has(.master-list-page),
.content:has(.comercial-list-page),
.content:has(.article-list-page) {
    padding: 14px 16px !important;
    overflow-x: hidden !important;
}

.content:has(.list-page) .erp-page,
.content:has(.master-list-page) .erp-page,
.content:has(.comercial-list-page) .erp-page,
.content:has(.article-list-page) .erp-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.list-page,
.master-list-page,
.comercial-list-page,
.article-list-page,
.list-page > .panel,
.master-list-page > .panel,
.comercial-list-page > .panel,
.article-list-page > .panel,
.grid-panel-fluid {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.grid-panel-fluid,
.list-page .grid-panel,
.comercial-list-page .grid-panel,
.article-list-page .grid-panel,
.master-list-page .grid-panel {
    padding: 10px !important;
    overflow: hidden !important;
}

.erp-grid-fluid,
.erp-grid-fluid > *,
.erp-grid-fluid .dxbl-grid,
.erp-grid-fluid .dxbl-grid-container,
.erp-grid-fluid .dxbl-grid-table,
.commercial-grid,
.commercial-grid > *,
.commercial-grid .dxbl-grid,
.commercial-grid .dxbl-grid-container,
.commercial-grid .dxbl-grid-table {
    width: 100% !important;
    max-width: none !important;
    min-width: 100% !important;
}

.commercial-grid,
.commercial-grid .dxbl-grid-table,
.commercial-grid .dxbl-grid-header-row,
.commercial-grid .dxbl-grid-data-row,
.product-picker-grid,
.product-picker-grid .dxbl-grid-table,
.product-picker-grid .dxbl-grid-header-row,
.product-picker-grid .dxbl-grid-data-row {
    font-size: 11.5px !important;
}

.commercial-grid .dxbl-grid-table th,
.commercial-grid .dxbl-grid-table td,
.product-picker-grid .dxbl-grid-table th,
.product-picker-grid .dxbl-grid-table td {
    padding: 3px 5px !important;
    line-height: 1.15 !important;
}

.commercial-lines-wrap {
    overflow-x: hidden !important;
}

.commercial-lines-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
    font-size: 11.5px !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    padding: 2px 3px !important;
    height: 28px !important;
    line-height: 1.15 !important;
}

.commercial-lines-table input,
.commercial-lines-table .dxbl-text-edit,
.commercial-lines-table .dxbl-edit {
    height: 24px !important;
    min-height: 24px !important;
    font-size: 11.5px !important;
    padding: 1px 4px !important;
}

.commercial-lines-table .line-ref { width: 8.5% !important; }
.commercial-lines-table .line-detail,
.commercial-lines-table .line-detail-cell { width: 32% !important; min-width: 0 !important; }
.commercial-lines-table .line-detail-input { width: 100% !important; min-width: 0 !important; }
.commercial-lines-table .line-qty { width: 5.5% !important; }
.commercial-lines-table .line-money { width: 7% !important; }
.commercial-lines-table .line-disc { width: 5.5% !important; }
.commercial-lines-table .line-date { width: 8.5% !important; }
.commercial-lines-table .line-check { width: 4% !important; }
.commercial-lines-table .line-total { width: 7% !important; }
.commercial-lines-table .line-actions { width: 3.5% !important; }

.product-picker-grid .dxbl-grid-filter-row {
    display: none !important;
}

.product-picker-selected {
    grid-template-columns: 110px minmax(280px, 1fr) 86px 86px 74px 64px 112px 72px 56px auto !important;
    align-items: end !important;
}

.product-picker-selected .sap-field,
.product-picker-selected .product-picker-detail-field,
.product-picker-selected .sap-field-code,
.product-picker-selected .sap-field-long,
.product-picker-selected .sap-field-money,
.product-picker-selected .sap-field-percent,
.product-picker-selected .sap-field-date,
.product-picker-selected .sap-field-check {
    grid-column: auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.product-picker-add-inline {
    display: flex;
    align-items: end;
    justify-content: flex-end;
    min-width: 116px;
}

.product-picker-add-inline .dxbl-btn {
    white-space: nowrap !important;
}

@media (max-width: 1100px) {
    .commercial-lines-wrap {
        overflow-x: auto !important;
    }

    .commercial-lines-table {
        min-width: 980px !important;
    }

    .product-picker-selected {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* 2026-05-19: ajuste final grids full width, filtro compacto y popup producto */
.erp-page {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.sap-page-header,
.sap-master-card,
.commercial-ficha-card,
.product-main-panel,
.product-main-panel-full,
.form-section-card,
.erp-form-card {
    margin-left: auto !important;
    margin-right: auto !important;
}

.list-page,
.master-list-page,
.comercial-list-page,
.article-list-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.list-page > .page-header,
.master-list-page > .page-header,
.comercial-list-page > .page-header,
.article-list-page > .page-header,
.list-page > .panel,
.master-list-page > .panel,
.comercial-list-page > .panel,
.article-list-page > .panel,
.list-page .grid-panel,
.master-list-page .grid-panel,
.comercial-list-page .grid-panel,
.article-list-page .grid-panel,
.list-page .list-toolbar-panel,
.master-list-page .list-toolbar-panel,
.comercial-list-page .list-toolbar-panel,
.article-list-page .list-toolbar-panel {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.list-page .dxbl-grid,
.master-list-page .dxbl-grid,
.comercial-list-page .dxbl-grid,
.article-list-page .dxbl-grid,
.list-page .dxbl-grid-container,
.master-list-page .dxbl-grid-container,
.comercial-list-page .dxbl-grid-container,
.article-list-page .dxbl-grid-container,
.list-page .dxbl-grid-table,
.master-list-page .dxbl-grid-table,
.comercial-list-page .dxbl-grid-table,
.article-list-page .dxbl-grid-table {
    width: 100% !important;
    max-width: none !important;
    min-width: 100% !important;
}

.erp-grid .dxbl-grid-filter-row td,
.erp-grid-fluid .dxbl-grid-filter-row td,
.commercial-grid .dxbl-grid-filter-row td,
.product-grid-stable .dxbl-grid-filter-row td {
    background: #f1f5f9 !important;
    border-bottom: 1px solid #cbd5e1 !important;
    padding: 1px 4px !important;
    height: 24px !important;
    min-height: 24px !important;
}

.erp-grid .dxbl-grid-filter-row input,
.erp-grid-fluid .dxbl-grid-filter-row input,
.commercial-grid .dxbl-grid-filter-row input,
.product-grid-stable .dxbl-grid-filter-row input,
.erp-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.erp-grid-fluid .dxbl-grid-filter-row .dxbl-text-edit-input,
.commercial-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.product-grid-stable .dxbl-grid-filter-row .dxbl-text-edit-input {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 4px !important;
    font-size: 11px !important;
    line-height: 18px !important;
}

.erp-grid .dxbl-grid-filter-row .dxbl-text-edit,
.erp-grid-fluid .dxbl-grid-filter-row .dxbl-text-edit,
.commercial-grid .dxbl-grid-filter-row .dxbl-text-edit,
.product-grid-stable .dxbl-grid-filter-row .dxbl-text-edit {
    min-height: 20px !important;
    height: 20px !important;
    border-radius: 2px !important;
    background: #fff !important;
}

.product-picker-grid .dxbl-grid-filter-row {
    display: table-row !important;
}

.product-picker-grid .dxbl-grid-table,
.product-picker-grid .dxbl-grid-header-row,
.product-picker-grid .dxbl-grid-data-row,
.product-picker-grid .dxbl-grid-filter-row {
    font-size: 11px !important;
}

.product-picker-grid .dxbl-grid-table th,
.product-picker-grid .dxbl-grid-table td {
    padding: 2px 4px !important;
    line-height: 1.12 !important;
}

.product-picker-selected {
    display: grid !important;
    grid-template-columns: 118px minmax(360px, 1fr) 80px 92px 74px 64px 116px 82px 60px 122px !important;
    gap: 6px 8px !important;
    padding: 8px !important;
    align-items: end !important;
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

.product-picker-selected.is-empty {
    background: #f9fafb !important;
}

.product-picker-selected .sap-field,
.product-picker-selected .product-picker-ref-field,
.product-picker-selected .product-picker-detail-field,
.product-picker-selected .sap-field-code,
.product-picker-selected .sap-field-money,
.product-picker-selected .sap-field-percent,
.product-picker-selected .sap-field-date,
.product-picker-selected .sap-field-check {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

.product-picker-selected label {
    font-size: 10.5px !important;
    margin-bottom: 2px !important;
}

.product-picker-selected input,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-edit {
    height: 26px !important;
    min-height: 26px !important;
    font-size: 11.5px !important;
    border-radius: 2px !important;
}

.product-picker-add-inline .dxbl-btn,
.product-picker-popup .popup-actions .dxbl-btn,
.commercial-lines-table .dxbl-btn {
    min-height: 24px !important;
    height: 24px !important;
    padding: 1px 8px !important;
    font-size: 11px !important;
    line-height: 20px !important;
    white-space: nowrap !important;
}

.commercial-lines-table,
.commercial-lines-table input,
.commercial-lines-table .dxbl-text-edit,
.commercial-lines-table .dxbl-edit,
.commercial-lines-table .dxbl-btn {
    font-size: 11px !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    height: 26px !important;
    min-height: 26px !important;
    padding: 1px 3px !important;
    vertical-align: middle !important;
}

.commercial-lines-table input,
.commercial-lines-table .dxbl-text-edit,
.commercial-lines-table .dxbl-edit {
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    box-sizing: border-box !important;
    border-radius: 2px !important;
}

.commercial-lines-table .dxbl-check {
    min-height: 24px !important;
    height: 24px !important;
}

.commercial-lines-table .line-detail,
.commercial-lines-table .line-detail-cell {
    width: 38% !important;
}

.commercial-lines-table .line-ref { width: 9% !important; }
.commercial-lines-table .line-qty { width: 5.2% !important; }
.commercial-lines-table .line-money { width: 6.8% !important; }
.commercial-lines-table .line-disc { width: 5.2% !important; }
.commercial-lines-table .line-date { width: 8% !important; }
.commercial-lines-table .line-check { width: 3.8% !important; }
.commercial-lines-table .line-total { width: 6.5% !important; }
.commercial-lines-table .line-actions { width: 3.2% !important; }

@media (max-width: 1260px) {
    .product-picker-selected {
        grid-template-columns: 118px minmax(320px, 1fr) 80px 92px 74px !important;
    }

    .product-picker-reserve-field,
    .product-picker-add-inline {
        align-self: end !important;
    }
}

@media (max-width: 900px) {
    .product-picker-selected {
        grid-template-columns: 1fr 1fr !important;
    }

    .product-picker-selected .product-picker-detail-field {
        grid-column: 1 / -1 !important;
    }
}

/* 2026-05-19: rows 35px, listados full-width real y popup producto en 2 lineas */
.app-shell .content > .erp-page {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.app-shell .content > .erp-page:has(.sap-master-card),
.app-shell .content > .erp-page:has(.commercial-ficha-card),
.app-shell .content > .erp-page:has(.client-modern-page),
.app-shell .content > .erp-page:has(.sap-product-card) {
    max-width: none !important;
}

.app-shell .content > .erp-page .sap-master-card,
.app-shell .content > .erp-page .commercial-ficha-card,
.app-shell .content > .erp-page .client-modern-page,
.app-shell .content > .erp-page .sap-product-card {
    margin-left: auto !important;
    margin-right: auto !important;
}

.app-shell .content > .erp-page .list-page,
.app-shell .content > .erp-page .master-list-page,
.app-shell .content > .erp-page .comercial-list-page,
.app-shell .content > .erp-page .article-list-page,
.app-shell .content > .erp-page .list-page > .page-header,
.app-shell .content > .erp-page .master-list-page > .page-header,
.app-shell .content > .erp-page .comercial-list-page > .page-header,
.app-shell .content > .erp-page .article-list-page > .page-header,
.app-shell .content > .erp-page .list-page > .panel,
.app-shell .content > .erp-page .master-list-page > .panel,
.app-shell .content > .erp-page .comercial-list-page > .panel,
.app-shell .content > .erp-page .article-list-page > .panel,
.app-shell .content > .erp-page .list-page .grid-panel,
.app-shell .content > .erp-page .master-list-page .grid-panel,
.app-shell .content > .erp-page .comercial-list-page .grid-panel,
.app-shell .content > .erp-page .article-list-page .grid-panel,
.app-shell .content > .erp-page .list-page .list-toolbar-panel,
.app-shell .content > .erp-page .master-list-page .list-toolbar-panel,
.app-shell .content > .erp-page .comercial-list-page .list-toolbar-panel,
.app-shell .content > .erp-page .article-list-page .list-toolbar-panel {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

.app-shell .content > .erp-page .list-page .dxbl-grid,
.app-shell .content > .erp-page .master-list-page .dxbl-grid,
.app-shell .content > .erp-page .comercial-list-page .dxbl-grid,
.app-shell .content > .erp-page .article-list-page .dxbl-grid,
.app-shell .content > .erp-page .list-page .dxbl-grid-container,
.app-shell .content > .erp-page .master-list-page .dxbl-grid-container,
.app-shell .content > .erp-page .comercial-list-page .dxbl-grid-container,
.app-shell .content > .erp-page .article-list-page .dxbl-grid-container,
.app-shell .content > .erp-page .list-page .dxbl-grid-table,
.app-shell .content > .erp-page .master-list-page .dxbl-grid-table,
.app-shell .content > .erp-page .comercial-list-page .dxbl-grid-table,
.app-shell .content > .erp-page .article-list-page .dxbl-grid-table {
    width: 100% !important;
    max-width: none !important;
    min-width: 100% !important;
}

.erp-grid .dxbl-grid-header-row,
.erp-grid .dxbl-grid-data-row,
.erp-grid .dxbl-grid-filter-row,
.erp-grid-fluid .dxbl-grid-header-row,
.erp-grid-fluid .dxbl-grid-data-row,
.erp-grid-fluid .dxbl-grid-filter-row,
.commercial-grid .dxbl-grid-header-row,
.commercial-grid .dxbl-grid-data-row,
.commercial-grid .dxbl-grid-filter-row,
.product-picker-grid .dxbl-grid-header-row,
.product-picker-grid .dxbl-grid-data-row,
.product-picker-grid .dxbl-grid-filter-row {
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
}

.erp-grid .dxbl-grid-header-row > td,
.erp-grid .dxbl-grid-header-row > th,
.erp-grid .dxbl-grid-data-row > td,
.erp-grid .dxbl-grid-data-row > th,
.erp-grid .dxbl-grid-filter-row > td,
.erp-grid .dxbl-grid-filter-row > th,
.erp-grid-fluid .dxbl-grid-header-row > td,
.erp-grid-fluid .dxbl-grid-header-row > th,
.erp-grid-fluid .dxbl-grid-data-row > td,
.erp-grid-fluid .dxbl-grid-data-row > th,
.erp-grid-fluid .dxbl-grid-filter-row > td,
.erp-grid-fluid .dxbl-grid-filter-row > th,
.commercial-grid .dxbl-grid-header-row > td,
.commercial-grid .dxbl-grid-header-row > th,
.commercial-grid .dxbl-grid-data-row > td,
.commercial-grid .dxbl-grid-data-row > th,
.commercial-grid .dxbl-grid-filter-row > td,
.commercial-grid .dxbl-grid-filter-row > th,
.product-picker-grid .dxbl-grid-header-row > td,
.product-picker-grid .dxbl-grid-header-row > th,
.product-picker-grid .dxbl-grid-data-row > td,
.product-picker-grid .dxbl-grid-data-row > th,
.product-picker-grid .dxbl-grid-filter-row > td,
.product-picker-grid .dxbl-grid-filter-row > th {
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
    padding: 3px 6px !important;
    line-height: 1.15 !important;
    vertical-align: middle !important;
    font-size: 11.5px !important;
}

.erp-grid .dxbl-grid-filter-row > td,
.erp-grid .dxbl-grid-filter-row > th,
.erp-grid-fluid .dxbl-grid-filter-row > td,
.erp-grid-fluid .dxbl-grid-filter-row > th,
.commercial-grid .dxbl-grid-filter-row > td,
.commercial-grid .dxbl-grid-filter-row > th,
.product-picker-grid .dxbl-grid-filter-row > td,
.product-picker-grid .dxbl-grid-filter-row > th {
    background: #eaf2ff !important;
    border-bottom: 1px solid #b9cbe7 !important;
}

.erp-grid .dxbl-grid-filter-row input,
.erp-grid-fluid .dxbl-grid-filter-row input,
.commercial-grid .dxbl-grid-filter-row input,
.product-picker-grid .dxbl-grid-filter-row input,
.erp-grid .dxbl-grid-filter-row .dxbl-text-edit,
.erp-grid-fluid .dxbl-grid-filter-row .dxbl-text-edit,
.commercial-grid .dxbl-grid-filter-row .dxbl-text-edit,
.product-picker-grid .dxbl-grid-filter-row .dxbl-text-edit,
.erp-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.erp-grid-fluid .dxbl-grid-filter-row .dxbl-text-edit-input,
.commercial-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.product-picker-grid .dxbl-grid-filter-row .dxbl-text-edit-input {
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    font-size: 11px !important;
    line-height: 22px !important;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    width: min(1120px, 96vw) !important;
    max-width: 96vw !important;
}

.product-picker-selected {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 6px 8px !important;
    align-items: end !important;
    overflow: hidden !important;
}

.product-picker-selected .product-picker-ref-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-detail-field {
    grid-column: span 10 !important;
}

.product-picker-selected .product-picker-qty-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-price-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-discount-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-iva-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-date-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-reserve-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-add-inline {
    grid-column: span 2 !important;
    min-width: 0 !important;
}

.product-picker-selected .product-picker-add-inline .dxbl-btn {
    width: 100% !important;
    min-width: 0 !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
}

.product-picker-selected input,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-edit {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 900px) {
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-reserve-field,
    .product-picker-selected .product-picker-add-inline {
        grid-column: span 6 !important;
    }
}

.erp-page.list-page,
.erp-page.master-list-page,
.erp-page.article-list-page,
.erp-page.comercial-list-page,
.list-page,
.master-list-page,
.article-list-page,
.comercial-list-page {
    width: min(100%, 1600px) !important;
    max-width: 1600px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.erp-page.article-list-page,
.erp-page.comercial-list-page,
.article-list-page,
.comercial-list-page {
    width: min(100%, 1700px) !important;
    max-width: 1700px !important;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    width: min(920px, 94vw) !important;
    max-width: 94vw !important;
}

.product-picker-selected {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 6px 8px !important;
    align-items: end !important;
}

.product-picker-selected .product-picker-ref-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-detail-field {
    grid-column: span 8 !important;
}

.product-picker-selected .product-picker-add-inline {
    grid-column: span 2 !important;
    align-self: end !important;
}

.product-picker-selected .product-picker-qty-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-price-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-discount-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-iva-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-date-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-reserve-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-detail-field textarea,
.product-picker-selected .product-picker-detail-field .dxbl-memo-edit,
.product-picker-selected .product-picker-detail-field .dxbl-memo-edit textarea {
    min-height: 58px !important;
    max-height: 72px !important;
    resize: vertical !important;
    line-height: 1.25 !important;
}

.product-picker-selected .product-picker-add-inline .dxbl-btn {
    height: 31px !important;
    min-height: 31px !important;
}

@media (max-width: 980px) {
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-add-inline,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-reserve-field {
        grid-column: span 6 !important;
    }

    .product-picker-selected .product-picker-detail-field {
        grid-column: span 12 !important;
    }
}

.erp-icon {
    display: inline-block;
    flex: 0 0 auto;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: middle;
}

.side-group summary,
.side-link {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
}

.side-group summary > span,
.side-link > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.side-group summary::after {
    margin-left: auto;
}

.side-group summary .erp-icon,
.side-link .erp-icon {
    width: 16px;
    height: 16px;
    opacity: .9;
}

.side-link.active .erp-icon,
.side-link:hover .erp-icon,
.side-group summary:hover .erp-icon {
    opacity: 1;
}

.side-link.disabled .erp-icon {
    opacity: .55;
}

.erp-action-icon {
    width: 15px;
    height: 15px;
    margin-right: 5px;
}

.erp-action-button,
.erp-row-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #0f172a;
    border-radius: 3px;
    height: 28px;
    min-height: 28px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.erp-action-button:disabled,
.erp-row-icon-btn:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.erp-action-primary {
    border-color: #ff7a1a;
    background: #ff7a1a;
    color: #ffffff;
}

.erp-action-secondary {
    border-color: #cbd5e1;
    background: #ffffff;
    color: #0f172a;
}

.erp-icon {
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.erp-row-icon-btn {
    width: 26px;
    min-width: 26px;
    height: 24px;
    min-height: 24px;
    padding: 0;
}

.line-detail-inline,
.product-picker-detail-inline {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 26px;
    gap: 4px;
    align-items: center;
    width: 100%;
}

.commercial-lines-table .line-detail-input {
    width: 100% !important;
    min-width: 0 !important;
}

.line-expanded-detail-row td {
    height: auto !important;
    max-height: none !important;
    padding: 4px 6px !important;
    background: #f8fafc;
    border-bottom: 1px solid #cbd5e1;
}

.line-expanded-detail-textarea {
    width: 100%;
    min-height: 92px;
    height: 92px;
    resize: vertical;
    font-size: 12px;
    line-height: 1.35;
    border-radius: 3px;
}

.line-delete-button {
    color: #b91c1c;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    width: min(960px, 94vw) !important;
    max-width: 94vw !important;
}

.product-picker-selected {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    align-items: end !important;
}

.product-picker-selected .product-picker-ref-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-detail-field {
    grid-column: span 8 !important;
}

.product-picker-selected .product-picker-add-inline {
    grid-column: span 2 !important;
    display: flex;
    align-items: end;
    justify-content: stretch;
}

.product-picker-add-button {
    width: 100%;
}

.product-picker-selected .product-picker-long-detail-field {
    grid-column: 1 / -1 !important;
}

.product-picker-long-detail {
    min-height: 84px;
    height: 84px;
    resize: vertical;
    font-size: 12px;
    line-height: 1.35;
    border-radius: 3px;
}

.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-reserve-field {
    grid-column: span 1 !important;
}

.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-date-field,
.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 2 !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
}

.erp-grid .dxbl-grid-filter-row > td,
.erp-grid-fluid .dxbl-grid-filter-row > td,
.commercial-grid .dxbl-grid-filter-row > td,
.product-picker-grid .dxbl-grid-filter-row > td {
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
    background: #eaf2ff !important;
}

@media (max-width: 900px) {
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-add-inline,
    .product-picker-selected .product-picker-long-detail-field,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-reserve-field {
        grid-column: 1 / -1 !important;
    }
}

.erp-ribbon-panel {
    padding: 8px 10px !important;
    margin-bottom: 8px;
}

.erp-ribbon {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.erp-ribbon-group {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-right: 10px;
    border-right: 1px solid #d9dee8;
}

.erp-ribbon-group:last-of-type {
    border-right: 0;
}

.erp-ribbon-button {
    height: 30px;
    min-height: 30px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1f2937;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 3px;
    cursor: pointer;
    white-space: nowrap;
}

.erp-ribbon-button:hover:not(:disabled) {
    background: #f1f5f9;
    border-color: #94a3b8;
}

.erp-ribbon-button:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.erp-ribbon-danger {
    color: #b42318;
}

.erp-ribbon-info {
    margin-left: auto;
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}

.erp-grid-check {
    width: 15px;
    height: 15px;
    margin: 0;
    vertical-align: middle;
}

.pedido-action-panel {
    margin-bottom: 8px;
}

.pedido-actionbar .erp-ribbon-button {
    font-weight: 500;
}

.order-series-tabs-panel {
    padding: 6px 10px !important;
    margin-bottom: 8px;
}

.order-series-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.order-series-tab {
    height: 30px;
    min-width: 82px;
    border: 1px solid #cbd5e1;
    border-bottom-color: #9fb2ce;
    background: #eef4fb;
    color: #183252;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 3px 3px 0 0;
    cursor: pointer;
    white-space: nowrap;
}

.order-series-tab span {
    min-width: 20px;
    height: 18px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #475569;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    border-radius: 9px;
    font-size: 11px;
}

.order-series-tab.active {
    background: #fff;
    border-color: #94a3b8;
    border-bottom-color: #fff;
    color: #0f172a;
}

.order-state-dot {
    --dot-color: #64748b;
    width: 11px;
    height: 11px;
    display: inline-block;
    position: relative;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.72) 0 14%, var(--dot-color) 48%, rgba(15,23,42,.2) 100%);
    box-shadow: 0 0 0 1px rgba(15, 23, 42, .14), 0 0 5px rgba(100, 116, 139, .18);
    vertical-align: middle;
}

.order-state-dot-ok {
    --dot-color: #2bd608;
    box-shadow: 0 0 0 1px rgba(34, 112, 9, .18), 0 0 5px rgba(234, 179, 8, .28);
}

.order-state-dot-warning {
    --dot-color: #f59e0b;
    box-shadow: 0 0 0 1px rgba(146, 64, 14, .18), 0 0 5px rgba(245, 158, 11, .26);
}

.order-state-dot-danger {
    --dot-color: #b91c1c;
    box-shadow: 0 0 0 1px rgba(127, 29, 29, .22), 0 0 5px rgba(99, 102, 241, .24);
}

.payment-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    white-space: nowrap;
}

.commercial-action-panel {
    margin-top: -2px;
}

.pedidos-grid .dxbl-grid-table th:first-child,
.pedidos-grid .dxbl-grid-table td:first-child,
.pedidos-grid .dxbl-grid-table th:nth-child(2),
.pedidos-grid .dxbl-grid-table td:nth-child(2) {
    text-align: center;
}

.commercial-bottom-actions {
    max-width: 1200px;
    margin: 10px auto 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 0 0 0;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 900px !important;
}

.product-picker-search {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 4px !important;
}

.product-picker-search > label {
    font-size: 11px;
    font-weight: 700;
    color: #344054;
}

.product-picker-search-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px;
    gap: 8px;
    align-items: end;
}

.product-picker-search-button {
    height: 30px !important;
    min-height: 30px !important;
}

.product-picker-selected {
    grid-template-columns: 124px minmax(260px, 1fr) 132px !important;
    grid-template-areas:
        "ref detail add"
        "qty price discount"
        "iva date warehouse"
        "reserve reserve reserve" !important;
    max-width: 100% !important;
}

.product-picker-ref-field { grid-area: ref; }
.product-picker-detail-field { grid-area: detail; }
.product-picker-add-inline { grid-area: add; align-self: end; }
.product-picker-qty-field { grid-area: qty; }
.product-picker-price-field { grid-area: price; }
.product-picker-discount-field { grid-area: discount; }
.product-picker-iva-field { grid-area: iva; }
.product-picker-date-field { grid-area: date; }
.product-picker-warehouse-field { grid-area: warehouse; }
.product-picker-reserve-field { grid-area: reserve; max-width: 120px !important; }
.product-picker-long-detail-field {
    grid-column: 1 / -1 !important;
}

.product-picker-add-inline .erp-action-button {
    width: 100%;
    justify-content: center;
}

.erp-grid .dxbl-grid-filter-row td,
.erp-grid-fluid .dxbl-grid-filter-row td,
.commercial-grid .dxbl-grid-filter-row td,
.product-picker-grid .dxbl-grid-filter-row td,
.product-grid-stable .dxbl-grid-filter-row td {
    height: 35px !important;
    min-height: 35px !important;
    background: #eaf3ff !important;
    border-bottom: 1px solid #bdd7f5 !important;
    padding: 3px 5px !important;
}

.erp-grid .dxbl-grid-table > tbody > tr > td,
.erp-grid-fluid .dxbl-grid-table > tbody > tr > td,
.commercial-grid .dxbl-grid-table > tbody > tr > td,
.product-picker-grid .dxbl-grid-table > tbody > tr > td,
.product-grid-stable .dxbl-grid-table > tbody > tr > td {
    height: 35px !important;
    min-height: 35px !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}

.erp-grid .dxbl-grid-filter-row input,
.erp-grid-fluid .dxbl-grid-filter-row input,
.commercial-grid .dxbl-grid-filter-row input,
.product-picker-grid .dxbl-grid-filter-row input,
.product-grid-stable .dxbl-grid-filter-row input,
.erp-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.erp-grid-fluid .dxbl-grid-filter-row .dxbl-text-edit-input,
.commercial-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.product-picker-grid .dxbl-grid-filter-row .dxbl-text-edit-input,
.product-grid-stable .dxbl-grid-filter-row .dxbl-text-edit-input {
    height: 26px !important;
    min-height: 26px !important;
    line-height: 24px !important;
    font-size: 11.5px !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    height: 35px !important;
    min-height: 35px !important;
}

.commercial-lines-table input,
.commercial-lines-table .dxbl-text-edit,
.commercial-lines-table .dxbl-edit,
.commercial-lines-table .dxbl-btn,
.commercial-lines-table .erp-row-icon-btn {
    height: 28px !important;
    min-height: 28px !important;
}

@media (max-width: 820px) {
    .product-picker-search-row,
    .product-picker-selected {
        grid-template-columns: 1fr !important;
        grid-template-areas: none !important;
    }

    .product-picker-selected > * {
        grid-area: auto !important;
        grid-column: 1 / -1 !important;
    }

    .commercial-bottom-actions {
        max-width: 100%;
        flex-wrap: wrap;
    }
}

/* Revisión 2026-05-19: base visual estable */
body {
    font-family: Roboto, Inter, Aptos, "Helvetica Neue", Arial, system-ui, -apple-system, BlinkMacSystemFont, sans-serif !important;
}

.sidebar {
    background: #080d1e !important;
}

.side-group summary:hover,
.side-link:hover,
.side-link.active {
    background: rgba(31, 94, 255, .22) !important;
}

.erp-popup .dxbl-popup-footer,
.erp-popup .dxbl-modal-footer,
.erp-popup .dxbl-popup-footer-content {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    padding: 10px 14px !important;
    border-top: 1px solid #dbe3ef !important;
    background: #f8fafc !important;
}

.master-editor-shell .popup-actions.master-inline-actions {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e4e9f2;
}

.master-sap-form {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
    align-items: end !important;
}

.master-sap-form .sap-field {
    min-width: 0 !important;
    max-width: none !important;
}

.master-sap-form .sap-field-medium,
.master-sap-form .sap-field-long {
    grid-column: span 4 !important;
}

.master-sap-form .sap-field-full {
    grid-column: 1 / -1 !important;
}

.master-sap-form .sap-field-check {
    grid-column: span 3 !important;
    min-width: 0 !important;
}

.master-sap-form .sap-field-xs,
.master-sap-form .sap-field-day,
.master-sap-form .sap-field-money {
    grid-column: span 2 !important;
    min-width: 0 !important;
}

.dx-check-line,
.master-sap-form .dx-check-line {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 180px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.dx-check-line span {
    white-space: nowrap !important;
}

.color-input {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
}

@media (max-width: 900px) {
    .master-sap-form .sap-field,
    .master-sap-form .sap-field-medium,
    .master-sap-form .sap-field-long,
    .master-sap-form .sap-field-check,
    .master-sap-form .sap-field-xs,
    .master-sap-form .sap-field-day,
    .master-sap-form .sap-field-money {
        grid-column: 1 / -1 !important;
        max-width: 100% !important;
    }
}

/* Listados grandes: centrados, sin zona muerta infinita en monitores grandes */
.erp-page.list-page,
.erp-page.master-list-page,
.erp-page.article-list-page,
.erp-page.comercial-list-page,
.list-page,
.master-list-page,
.article-list-page,
.comercial-list-page {
    width: min(100%, 1680px) !important;
    max-width: 1680px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.article-list-page,
.comercial-list-page {
    width: min(100%, 1760px) !important;
    max-width: 1760px !important;
}

/* Grids 35px, filtro distinguible */
.erp-grid .dxbl-grid-header-row,
.erp-grid .dxbl-grid-data-row,
.erp-grid .dxbl-grid-filter-row,
.erp-grid-fluid .dxbl-grid-header-row,
.erp-grid-fluid .dxbl-grid-data-row,
.erp-grid-fluid .dxbl-grid-filter-row,
.commercial-grid .dxbl-grid-header-row,
.commercial-grid .dxbl-grid-data-row,
.commercial-grid .dxbl-grid-filter-row,
.product-picker-grid .dxbl-grid-header-row,
.product-picker-grid .dxbl-grid-data-row,
.product-picker-grid .dxbl-grid-filter-row {
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
}

.erp-grid .dxbl-grid-filter-row > td,
.erp-grid-fluid .dxbl-grid-filter-row > td,
.commercial-grid .dxbl-grid-filter-row > td,
.product-picker-grid .dxbl-grid-filter-row > td {
    background: #eaf2ff !important;
}

.erp-grid .dxbl-grid-table th,
.erp-grid .dxbl-grid-table td,
.product-picker-grid .dxbl-grid-table th,
.product-picker-grid .dxbl-grid-table td,
.commercial-grid .dxbl-grid-table th,
.commercial-grid .dxbl-grid-table td {
    font-size: 11.5px !important;
    line-height: 1.15 !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}

/* Popup producto: 2 lineas compactas, sin desbordar */
.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    width: min(900px, 94vw) !important;
    max-width: 94vw !important;
}

.product-picker-search-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 130px !important;
    gap: 8px !important;
    align-items: end !important;
}

.product-picker-selected {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 6px 8px !important;
    overflow: hidden !important;
}

.product-picker-selected .product-picker-ref-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-detail-field { grid-column: span 8 !important; }
.product-picker-selected .product-picker-add-inline { grid-column: span 2 !important; }
.product-picker-selected .product-picker-long-detail-field { grid-column: 1 / -1 !important; }
.product-picker-selected .product-picker-qty-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-price-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-discount-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-iva-field { grid-column: span 1 !important; }
.product-picker-selected .product-picker-date-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-warehouse-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-reserve-field { grid-column: span 1 !important; }

.product-picker-selected .product-picker-add-inline .erp-action-button {
    width: 100% !important;
    height: 31px !important;
}

.product-picker-detail-inline,
.line-detail-inline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 28px !important;
    gap: 4px !important;
    align-items: center !important;
}

.commercial-lines-table .dxbl-combobox,
.commercial-lines-table .dxbl-text-edit,
.commercial-lines-table input,
.commercial-lines-table button {
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    box-sizing: border-box !important;
}

.commercial-client-field {
    grid-column: span 5 !important;
}

@media (max-width: 980px) {
    .product-picker-search-row,
    .product-picker-selected {
        grid-template-columns: 1fr 1fr !important;
    }
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-add-inline,
    .product-picker-selected .product-picker-long-detail-field,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-reserve-field {
        grid-column: span 2 !important;
    }
}


/* 2026-05-19 revision: ribbon, compact CRUD popups, stable grids/forms */
.side-nav { background: #080d1e !important; }
.side-brand { background: #080d1e !important; }

.master-editor-card-clean {
    max-width: 760px !important;
    margin: 0 auto !important;
    padding: 18px 20px !important;
}

.master-editor-shell .erp-record-strip {
    display: none !important;
}

.dxbl-popup .popup-actions,
.master-inline-actions,
.commercial-bottom-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
}

.commercial-bottom-actions {
    max-width: 1200px !important;
    margin: 12px auto 0 auto !important;
    padding: 12px 0 0 0 !important;
}

.header-actions .dxbl-btn,
.commercial-bottom-actions .dxbl-btn,
.popup-actions .dxbl-btn {
    height: 34px !important;
    min-height: 34px !important;
}

.dx-ribbon-panel {
    padding: 0 !important;
    overflow: hidden !important;
}

.erp-dx-ribbon {
    width: 100% !important;
    border: 0 !important;
    background: #f8fafc !important;
}

.erp-ribbon-selection {
    padding: 6px 12px 8px 12px;
    font-size: 12px;
    color: #64748b;
    border-top: 1px solid #e2e8f0;
    background: #fff;
}

.erp-grid .dxbl-grid-table > tbody > tr,
.erp-grid-fluid .dxbl-grid-table > tbody > tr,
.product-picker-grid .dxbl-grid-table > tbody > tr {
    height: 35px !important;
    min-height: 35px !important;
}

.erp-grid .dxbl-grid-filter-row,
.erp-grid-fluid .dxbl-grid-filter-row,
.product-picker-grid .dxbl-grid-filter-row {
    height: 35px !important;
    min-height: 35px !important;
    background: #eaf2ff !important;
}

.erp-grid .dxbl-grid-filter-row td,
.erp-grid-fluid .dxbl-grid-filter-row td,
.product-picker-grid .dxbl-grid-filter-row td {
    height: 35px !important;
    min-height: 35px !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    background: #eaf2ff !important;
}

.erp-grid .dxbl-grid-table th,
.erp-grid .dxbl-grid-table td,
.erp-grid-fluid .dxbl-grid-table th,
.erp-grid-fluid .dxbl-grid-table td {
    font-size: 12px !important;
}

.product-picker-popup .dxbl-popup-content {
    max-width: 94vw !important;
}

.product-picker-search {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 120px !important;
    gap: 8px !important;
    align-items: end !important;
}

.product-picker-search > label {
    grid-column: 1 / -1 !important;
}

.product-picker-search-button {
    width: 120px !important;
    height: 31px !important;
}

.product-picker-selected {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 7px 8px !important;
    padding: 9px !important;
}

.product-picker-selected .product-picker-ref-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-detail-field { grid-column: span 8 !important; }
.product-picker-selected .product-picker-add-inline { grid-column: span 2 !important; }
.product-picker-selected .product-picker-long-detail-field { grid-column: 1 / -1 !important; }
.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-date-field,
.product-picker-selected .product-picker-warehouse-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-reserve-field { grid-column: span 1 !important; }

.product-picker-selected .product-picker-add-inline .erp-action-button {
    width: 100% !important;
    height: 31px !important;
    min-height: 31px !important;
    padding: 0 8px !important;
}

.commercial-tabs .dxbl-tabs-content,
.commercial-tabs .dxbl-tabs-content-panel,
.commercial-tabs .dxbl-tabs-tabpane {
    overflow: visible !important;
    max-height: none !important;
}

.commercial-lines-table {
    font-size: 12px !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    height: 35px !important;
    min-height: 35px !important;
    padding: 3px 4px !important;
}

.line-action-buttons {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

.line-action-buttons .erp-row-icon-btn,
.commercial-lines-table .erp-row-icon-btn {
    height: 26px !important;
    width: 26px !important;
    min-width: 26px !important;
}

@media (max-width: 980px) {
    .product-picker-search,
    .product-picker-selected {
        grid-template-columns: 1fr 1fr !important;
    }
    .product-picker-selected .sap-field,
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-add-inline,
    .product-picker-selected .product-picker-long-detail-field,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-reserve-field {
        grid-column: span 2 !important;
    }
}


.commercial-tabs .dxbl-tabs-content-panel,
.commercial-tabs .dxbl-tabs-tabpane {
    overflow: visible !important;
    max-height: none !important;
}

.commercial-lines-wrap {
    overflow-x: hidden !important;
}

.commercial-lines-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 0 !important;
    font-size: 11.5px !important;
}

.commercial-lines-table th,
.commercial-lines-table td {
    height: 35px !important;
    padding: 3px 5px !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.commercial-line-row {
    cursor: pointer;
}

.commercial-line-row:hover {
    background: #f8fbff;
}

.line-detail-inline {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.line-detail-text,
.line-ref-cell,
.line-number-cell,
.line-check-cell {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.line-number-cell,
.line-total-cell {
    text-align: right;
}

.line-action-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

.line-expanded-detail-readonly {
    white-space: pre-wrap;
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    border-radius: 4px;
    padding: 8px 10px;
    color: #334155;
    line-height: 1.35;
}

.line-editor-form {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 10px 12px;
    padding: 10px 2px 4px;
}

.line-editor-form .sap-field {
    gap: 4px !important;
}

.line-editor-form .sap-field-full {
    grid-column: 1 / -1 !important;
    max-width: none !important;
}

.line-editor-long-detail {
    min-height: 110px !important;
    resize: vertical;
}

.commercial-bottom-actions {
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: flex-end !important;
    align-items: center !important;
}

.commercial-bottom-actions .dxbl-btn,
.header-actions .dxbl-btn {
    min-height: 34px !important;
    height: 34px !important;
}

@media (max-width: 980px) {
    .commercial-lines-wrap {
        overflow-x: auto !important;
    }
    .commercial-lines-table {
        min-width: 960px !important;
    }
}

/* Ficha pedido: acabado SAP compacto y tabla estable */
.commercial-ficha-header,
.commercial-ficha-card,
.commercial-bottom-actions {
    width: min(100%, 1320px) !important;
    max-width: 1320px !important;
}

.commercial-ficha-header {
    margin-bottom: 10px !important;
}

.commercial-ficha-header h1 {
    font-size: 32px !important;
    line-height: 1.05 !important;
}

.commercial-ficha-card {
    border-radius: 8px !important;
    padding: 16px !important;
}

.commercial-ficha-card .sap-card-title {
    margin-bottom: 12px !important;
}

.commercial-tabs {
    margin-top: 12px !important;
}

.commercial-tabs .sap-section {
    padding-top: 14px !important;
}

.commercial-lines-wrap {
    border: 1px solid #d7dee9 !important;
    border-radius: 6px !important;
    background: #fff !important;
    overflow-x: auto !important;
}

.commercial-lines-table {
    min-width: 900px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.commercial-lines-table th {
    height: 34px !important;
    border-bottom: 1px solid #d7dee9 !important;
    background: #f3f6fa !important;
}

.commercial-lines-table td {
    display: table-cell !important;
    height: 34px !important;
    max-height: 34px !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.commercial-lines-table .line-ref { width: 100px !important; }
.commercial-lines-table .line-detail { width: 210px !important; }
.commercial-lines-table .line-qty { width: 60px !important; }
.commercial-lines-table .line-money { width: 66px !important; }
.commercial-lines-table .line-disc { width: 52px !important; }
.commercial-lines-table .line-date { width: 74px !important; }
.commercial-lines-table .line-warehouse { width: 42px !important; }
.commercial-lines-table .line-check { width: 40px !important; }
.commercial-lines-table .line-total { width: 72px !important; }
.commercial-lines-table .line-actions { width: 58px !important; }

.commercial-lines-table td.line-ref-cell,
.commercial-lines-table td.line-detail-cell,
.commercial-lines-table td.line-number-cell,
.commercial-lines-table td.line-check-cell,
.commercial-lines-table td.line-total-cell {
    display: table-cell !important;
}

.commercial-lines-table .line-detail-text,
.commercial-lines-table .line-ref-cell,
.commercial-lines-table .line-number-cell,
.commercial-lines-table .line-check-cell,
.commercial-lines-table .line-warehouse-cell,
.commercial-lines-table .line-total-cell {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.commercial-lines-table .line-detail-inline {
    width: 100% !important;
}

.commercial-lines-table .line-detail-text {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

.commercial-lines-table .line-number-cell,
.commercial-lines-table .line-total-cell {
    font-variant-numeric: tabular-nums;
    text-align: right !important;
}

.commercial-lines-table .line-action-buttons {
    justify-content: center !important;
}

.commercial-lines-table .line-expanded-detail-row td {
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
}

.commercial-totals {
    margin-top: 10px !important;
}

.commercial-totals div {
    border-radius: 6px !important;
    min-width: 150px !important;
    padding: 7px 10px !important;
}

/* Ajustes de ficha comercial: labels ligeras, envio y popup producto */
.commercial-ficha-card .sap-field > label,
.commercial-ficha-card .sap-field label,
.product-picker-popup .sap-field > label,
.product-picker-popup .sap-field label,
.product-picker-search > label {
    font-weight: 400 !important;
    white-space: nowrap !important;
    min-height: 0 !important;
}

.commercial-shipping-form .sap-field > label {
    text-align: right !important;
    line-height: 1.05 !important;
}

.commercial-shipping-form {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 8px 14px !important;
    align-items: center !important;
}

.commercial-shipping-form .sap-field {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 6px !important;
    align-items: center !important;
    max-width: none !important;
}

.commercial-shipping-form .sap-field-long,
.commercial-shipping-form .sap-field-full {
    grid-column: span 6 !important;
}

.commercial-shipping-form .sap-field-medium {
    grid-column: span 4 !important;
}

.commercial-shipping-form .sap-field-short,
.commercial-shipping-form .sap-field-cp,
.commercial-shipping-form .sap-field-phone,
.commercial-shipping-form .sap-field-money,
.commercial-shipping-form .sap-field-date {
    grid-column: span 3 !important;
}

.commercial-shipping-form .dxbl-text-edit,
.commercial-shipping-form .dxbl-combobox,
.commercial-shipping-form .form-control,
.commercial-shipping-form input {
    min-height: 30px !important;
    height: 30px !important;
    border-radius: 3px !important;
    font-size: 12px !important;
}

.commercial-lines-table th {
    vertical-align: middle !important;
}

.commercial-lines-table .line-ref,
.commercial-lines-table .line-detail,
.commercial-lines-table .line-date,
.commercial-lines-table .line-warehouse,
.commercial-lines-table .line-check,
.commercial-lines-table .line-actions {
    text-align: left !important;
}

.commercial-lines-table .line-qty,
.commercial-lines-table .line-money,
.commercial-lines-table .line-disc,
.commercial-lines-table .line-total {
    text-align: right !important;
}

.commercial-lines-table .line-warehouse,
.commercial-lines-table .line-warehouse-cell,
.commercial-lines-table .line-check,
.commercial-lines-table .line-check-cell {
    text-align: center !important;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 980px !important;
}

.product-picker-selected {
    grid-template-columns: 130px minmax(300px, 1fr) 120px 128px !important;
    grid-template-areas:
        "ref detail detail add"
        "qty price discount iva"
        "date warehouse reserve reserve"
        "long long long long" !important;
    gap: 9px 12px !important;
    align-items: end !important;
}

.product-picker-selected .product-picker-ref-field,
.product-picker-selected .product-picker-detail-field,
.product-picker-selected .product-picker-add-inline,
.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-date-field,
.product-picker-selected .product-picker-warehouse-field,
.product-picker-selected .product-picker-reserve-field,
.product-picker-selected .product-picker-long-detail-field {
    grid-column: auto !important;
    max-width: none !important;
    min-width: 0 !important;
}

.product-picker-long-detail-field {
    grid-area: long !important;
}

.product-picker-detail-inline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    gap: 6px !important;
    align-items: center !important;
}

.product-picker-selected input,
.product-picker-selected textarea,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-combobox,
.product-picker-selected .dxbl-edit {
    min-height: 30px !important;
    height: 30px !important;
    font-size: 12px !important;
}

.product-picker-long-detail {
    min-height: 96px !important;
    height: 96px !important;
    resize: vertical !important;
}

@media (max-width: 980px) {
    .commercial-shipping-form .sap-field {
        grid-template-columns: 1fr !important;
    }

    .commercial-shipping-form .sap-field > label {
        text-align: left !important;
    }

    .product-picker-selected {
        grid-template-columns: 1fr 1fr !important;
        grid-template-areas:
            "ref add"
            "detail detail"
            "qty price"
            "discount iva"
            "date warehouse"
            "reserve reserve"
            "long long" !important;
    }
}

/* Popup producto: reticula uniforme y compacta */
.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 900px !important;
}

.product-picker-popup .dxbl-popup-body {
    padding: 12px 14px 10px !important;
}

.product-picker {
    gap: 10px !important;
}

.product-picker:focus {
    outline: none !important;
}

.product-picker-search-row {
    grid-template-columns: minmax(0, 1fr) 112px !important;
    gap: 8px !important;
}

.product-picker-search-button {
    width: 112px !important;
    min-width: 112px !important;
}

.product-picker-selected {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-areas:
        "ref detail detail add"
        "qty price discount iva"
        "date warehouse warehouse reserve"
        "long long long long" !important;
    column-gap: 10px !important;
    row-gap: 8px !important;
    padding: 10px !important;
    align-items: end !important;
}

.product-picker-selected .product-picker-ref-field { grid-area: ref !important; }
.product-picker-selected .product-picker-detail-field { grid-area: detail !important; }
.product-picker-selected .product-picker-add-inline { grid-area: add !important; }
.product-picker-selected .product-picker-qty-field { grid-area: qty !important; }
.product-picker-selected .product-picker-price-field { grid-area: price !important; }
.product-picker-selected .product-picker-discount-field { grid-area: discount !important; }
.product-picker-selected .product-picker-iva-field { grid-area: iva !important; }
.product-picker-selected .product-picker-date-field { grid-area: date !important; }
.product-picker-selected .product-picker-warehouse-field { grid-area: warehouse !important; }
.product-picker-selected .product-picker-reserve-field { grid-area: reserve !important; }
.product-picker-selected .product-picker-long-detail-field { grid-area: long !important; }

.product-picker-selected > .product-picker-ref-field,
.product-picker-selected > .product-picker-detail-field,
.product-picker-selected > .product-picker-add-inline,
.product-picker-selected > .product-picker-qty-field,
.product-picker-selected > .product-picker-price-field,
.product-picker-selected > .product-picker-discount-field,
.product-picker-selected > .product-picker-iva-field,
.product-picker-selected > .product-picker-date-field,
.product-picker-selected > .product-picker-warehouse-field,
.product-picker-selected > .product-picker-reserve-field,
.product-picker-selected > .product-picker-long-detail-field {
    width: 100% !important;
    max-width: none !important;
}

.product-picker-selected .sap-field {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.product-picker-selected label,
.product-picker-search > label {
    font-size: 11px !important;
    line-height: 1.1 !important;
}

.product-picker-detail-inline {
    grid-template-columns: minmax(0, 1fr) 28px !important;
}

.product-picker-detail-toggle,
.product-picker-selected .erp-row-icon-btn {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
}

.product-picker-selected input,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-combobox,
.product-picker-selected .dxbl-edit {
    height: 28px !important;
    min-height: 28px !important;
}

.product-picker-add-inline .erp-action-button {
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 8px !important;
}

@media (max-width: 780px) {
    .product-picker-selected {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-areas:
            "ref add"
            "detail detail"
            "qty price"
            "discount iva"
            "date warehouse"
            "reserve reserve"
            "long long" !important;
    }
}

/* Popup producto: reticula SAP estable de 12 columnas */
.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 900px !important;
    border-radius: 8px !important;
}

.product-picker-popup .dxbl-popup-header {
    min-height: 42px !important;
    padding: 10px 14px !important;
}

.product-picker-popup .dxbl-popup-body {
    padding: 10px 14px 8px !important;
}

.product-picker-popup .dxbl-popup-footer {
    padding: 8px 14px 10px !important;
}

.product-picker {
    gap: 8px !important;
}

.product-picker-search {
    gap: 4px !important;
}

.product-picker-search-row {
    grid-template-columns: minmax(0, 1fr) 104px !important;
    gap: 8px !important;
}

.product-picker-search-button {
    width: 104px !important;
    min-width: 104px !important;
}

.product-picker-selected {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    grid-template-areas: none !important;
    grid-auto-flow: row !important;
    gap: 8px 10px !important;
    align-items: end !important;
    padding: 10px !important;
    background: #f9fafb !important;
    border: 1px solid #d8dee8 !important;
    border-radius: 6px !important;
}

.product-picker-selected > * {
    grid-area: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    width: 100% !important;
}

.product-picker-selected .product-picker-ref-field,
.product-picker-selected .product-picker-detail-field,
.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-long-detail-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-date-field,
.product-picker-selected .product-picker-warehouse-field,
.product-picker-selected .product-picker-reserve-field,
.product-picker-selected .product-picker-line-actions {
    grid-area: auto !important;
}

.product-picker-selected .product-picker-ref-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-detail-field { grid-column: span 10 !important; }
.product-picker-selected .product-picker-qty-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-price-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-long-detail-field { grid-column: 1 / -1 !important; }
.product-picker-selected .product-picker-discount-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-iva-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-total-field { grid-column: span 4 !important; }
.product-picker-selected .product-picker-date-field { grid-column: span 3 !important; }
.product-picker-selected .product-picker-warehouse-field { grid-column: span 7 !important; }
.product-picker-selected .product-picker-reserve-field { grid-column: span 2 !important; }
.product-picker-selected .product-picker-line-actions { grid-column: 1 / -1 !important; }

.product-picker-selected .sap-field {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
}

.product-picker-selected label,
.product-picker-search > label {
    color: #475467 !important;
    font-size: 10.5px !important;
    line-height: 1.1 !important;
}

.product-picker-selected input,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-combobox,
.product-picker-selected .dxbl-edit,
.product-picker-search .dxbl-text-edit,
.product-picker-search input {
    height: 28px !important;
    min-height: 28px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
}

.product-picker-detail-inline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 28px !important;
    gap: 6px !important;
    align-items: end !important;
}

.product-picker-detail-toggle,
.product-picker-selected .erp-row-icon-btn {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
}

.product-picker-long-detail {
    min-height: 84px !important;
    height: 84px !important;
    border-radius: 4px !important;
}

.product-picker-line-actions {
    display: flex !important;
    justify-content: flex-end !important;
    padding-top: 2px !important;
}

.product-picker-line-actions .product-picker-add-button {
    width: auto !important;
    min-width: 132px !important;
    height: 30px !important;
    min-height: 30px !important;
    justify-content: center !important;
}

.product-picker-message {
    padding: 7px 10px !important;
    font-size: 12px !important;
}

@media (max-width: 900px) {
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-total-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-reserve-field {
        grid-column: span 6 !important;
    }

    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-long-detail-field,
    .product-picker-selected .product-picker-line-actions {
        grid-column: 1 / -1 !important;
    }
}

/* Breathing room between form inputs */
.commercial-shipping-form {
    column-gap: 22px !important;
    row-gap: 10px !important;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 980px !important;
}

.product-picker-search-row {
    gap: 10px !important;
}

.product-picker-selected {
    gap: 10px 18px !important;
    padding: 12px !important;
}

.product-picker-selected .sap-field {
    gap: 5px !important;
}

/* Numeric inputs: fixed compact size app-wide */
:root {
    --erp-numeric-input-width: 76px;
    --erp-numeric-total-width: 104px;
}

.sap-field input.numeric-text-input,
.sap-field .pro-native-input.numeric-text-input,
input.numeric-text-input,
.sap-field input[inputmode="decimal"],
.sap-field input[inputmode="numeric"] {
    width: var(--erp-numeric-input-width) !important;
    min-width: var(--erp-numeric-input-width) !important;
    max-width: var(--erp-numeric-input-width) !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums;
}

.product-picker-selected .product-picker-total-field input.numeric-text-input {
    width: var(--erp-numeric-total-width) !important;
    min-width: var(--erp-numeric-total-width) !important;
    max-width: var(--erp-numeric-total-width) !important;
}

.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-iva-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-total-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-date-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 10 !important;
}

.product-picker-selected .product-picker-reserve-field {
    grid-column: span 2 !important;
}

@media (max-width: 900px) {
    .product-picker-selected .product-picker-ref-field,
    .product-picker-selected .product-picker-qty-field,
    .product-picker-selected .product-picker-price-field,
    .product-picker-selected .product-picker-discount-field,
    .product-picker-selected .product-picker-iva-field,
    .product-picker-selected .product-picker-total-field,
    .product-picker-selected .product-picker-date-field,
    .product-picker-selected .product-picker-reserve-field {
        grid-column: span 6 !important;
    }

    .product-picker-selected .product-picker-detail-field,
    .product-picker-selected .product-picker-warehouse-field,
    .product-picker-selected .product-picker-long-detail-field,
    .product-picker-selected .product-picker-line-actions {
        grid-column: 1 / -1 !important;
    }
}

/* Compact SAP-like product add form */
.commercial-shipping-form {
    column-gap: 14px !important;
    row-gap: 7px !important;
}

.commercial-lines-table table {
    border-spacing: 0 !important;
}

.commercial-lines-table th {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.commercial-lines-table td {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    height: 30px !important;
    min-height: 30px !important;
}

.commercial-lines-table .line-expanded-detail-row td {
    padding-top: 2px !important;
    padding-bottom: 4px !important;
}

.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 820px !important;
}

.product-picker-popup .dxbl-popup-header {
    min-height: 34px !important;
    padding: 7px 12px !important;
}

.product-picker-popup .dxbl-popup-body {
    padding: 8px 12px 6px !important;
}

.product-picker-popup .dxbl-popup-footer {
    padding: 6px 12px 8px !important;
}

.product-picker {
    gap: 6px !important;
}

.product-picker-search {
    gap: 3px !important;
}

.product-picker-search-row {
    grid-template-columns: minmax(0, 1fr) 96px !important;
    gap: 7px !important;
}

.product-picker-search-button {
    width: 96px !important;
    min-width: 96px !important;
}

.product-picker-selected {
    gap: 6px 10px !important;
    padding: 8px !important;
}

.product-picker-selected .sap-field {
    gap: 2px !important;
}

.product-picker-selected label,
.product-picker-search > label {
    font-size: 10px !important;
}

.product-picker-selected input,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-combobox,
.product-picker-selected .dxbl-edit,
.product-picker-search .dxbl-text-edit,
.product-picker-search input {
    height: 25px !important;
    min-height: 25px !important;
    font-size: 11.5px !important;
}

.product-picker-detail-inline {
    grid-template-columns: minmax(0, 1fr) 25px !important;
    gap: 5px !important;
}

.product-picker-detail-toggle,
.product-picker-selected .erp-row-icon-btn {
    width: 25px !important;
    min-width: 25px !important;
    height: 25px !important;
}

.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-total-field,
.product-picker-selected .product-picker-date-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 6 !important;
}

.product-picker-selected .product-picker-reserve-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-line-actions {
    grid-column: span 2 !important;
    align-self: end !important;
    padding-top: 0 !important;
}

.product-picker-line-actions .product-picker-add-button {
    width: 100% !important;
    min-width: 0 !important;
    height: 25px !important;
    min-height: 25px !important;
    padding: 0 8px !important;
}

.product-picker-message {
    padding: 5px 8px !important;
}

/* Width-focused product popup: narrower without crushing height */
.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 720px !important;
}

.product-picker-popup .dxbl-popup-header {
    min-height: 42px !important;
    padding: 10px 14px !important;
}

.product-picker-popup .dxbl-popup-body {
    padding: 10px 14px 8px !important;
}

.product-picker-popup .dxbl-popup-footer {
    padding: 8px 14px 10px !important;
}

.product-picker-selected {
    gap: 8px 10px !important;
    padding: 10px !important;
}

.product-picker-selected .sap-field {
    gap: 3px !important;
}

.product-picker-selected label,
.product-picker-search > label {
    font-size: 10.5px !important;
}

.product-picker-selected input,
.product-picker-selected .dxbl-text-edit,
.product-picker-selected .dxbl-combobox,
.product-picker-selected .dxbl-edit,
.product-picker-search .dxbl-text-edit,
.product-picker-search input {
    height: 28px !important;
    min-height: 28px !important;
    font-size: 12px !important;
}

.product-picker-detail-inline {
    grid-template-columns: minmax(0, 1fr) 28px !important;
    gap: 6px !important;
}

.product-picker-detail-toggle,
.product-picker-selected .erp-row-icon-btn {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 6 !important;
}

.product-picker-selected .product-picker-line-actions {
    grid-column: span 2 !important;
    align-self: end !important;
    padding-top: 0 !important;
}

.product-picker-line-actions .product-picker-add-button {
    width: 100% !important;
    min-width: 0 !important;
    height: 28px !important;
    min-height: 28px !important;
}

/* Narrow product popup */
.product-picker-popup .dxbl-popup,
.product-picker-popup .dxbl-popup-root,
.product-picker-popup .dxbl-popup-content {
    max-width: 640px !important;
}

.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-iva-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-total-field {
    grid-column: span 3 !important;
}

.product-picker-selected .product-picker-date-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 5 !important;
}

.product-picker-selected .product-picker-reserve-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-line-actions {
    grid-column: span 3 !important;
}

/* Edit line popup mirrors product add popup */
.line-editor-popup .dxbl-popup,
.line-editor-popup .dxbl-popup-root,
.line-editor-popup .dxbl-popup-content {
    max-width: 640px !important;
}

.line-editor-form {
    margin: 0 !important;
}

.line-editor-popup .product-picker-long-detail-field {
    grid-column: 1 / -1 !important;
}

.line-editor-popup .line-editor-long-detail {
    min-height: 84px !important;
    height: 84px !important;
}

/* Product popup with line discount */
.product-picker-selected .product-picker-line-discount-field {
    grid-area: auto !important;
    grid-column: span 2 !important;
    max-width: none !important;
    min-width: 0 !important;
    width: 100% !important;
}

.product-picker-selected .product-picker-qty-field,
.product-picker-selected .product-picker-price-field,
.product-picker-selected .product-picker-discount-field,
.product-picker-selected .product-picker-line-discount-field,
.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-total-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-date-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-warehouse-field {
    grid-column: span 5 !important;
}

.product-picker-selected .product-picker-reserve-field {
    grid-column: span 2 !important;
}

.product-picker-selected .product-picker-line-actions {
    grid-column: span 3 !important;
}
.master-linked-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    gap: 6px;
    align-items: center;
}

.master-linked-control .master-link-button {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
}

.master-selector-popup .dxbl-popup-body,
.master-selector-editor-popup .dxbl-popup-body {
    padding: 14px;
}

.master-selector-shell {
    display: grid;
    gap: 12px;
}

.master-selector-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;
}

.master-selector-search label {
    display: block;
    margin-bottom: 4px;
    color: #536176;
    font-size: 12px;
}

.master-selector-actions,
.master-selector-row-actions {
    display: flex;
    gap: 6px;
    align-items: center;
}

.master-selector-message {
    margin: 0;
    padding: 8px 10px;
}

.master-selector-grid {
    max-height: 54vh;
}

.master-selector-editor {
    display: grid;
    gap: 10px;
}

@media (max-width: 720px) {
    .master-selector-toolbar {
        grid-template-columns: 1fr;
    }

    .master-selector-actions {
        justify-content: flex-start;
    }
}

/* Final ERP form grid fixes */
.master-linked-control {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
}

.master-linked-control > .dxbl-text-edit,
.master-linked-control > .dxbl-combobox,
.master-linked-control > .dxbl-edit,
.master-linked-control > input,
.master-linked-control > .form-control {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
}

.master-linked-control .numeric-text-input {
    max-width: none !important;
    width: 100% !important;
}

.master-linked-control .master-link-button {
    flex: 0 0 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.sap-product-card .sap-field:has(.master-linked-control),
.client-modern-page .sap-field:has(.master-linked-control) {
    min-width: 240px !important;
}

.sap-product-card .sap-field-short:has(.master-linked-control),
.sap-product-card .sap-field-xs:has(.master-linked-control),
.client-modern-page .sap-field-short:has(.master-linked-control),
.client-modern-page .sap-field-xs:has(.master-linked-control) {
    grid-column: span 3 !important;
}

.sap-product-card .sap-field-medium:has(.master-linked-control),
.client-modern-page .sap-field-medium:has(.master-linked-control) {
    grid-column: span 4 !important;
}

.product-picker-selected .master-linked-control {
    gap: 4px !important;
}

.product-picker-selected .master-linked-control .master-link-button {
    flex-basis: 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
}

.product-picker-selected .product-picker-iva-field,
.product-picker-selected .product-picker-warehouse-field {
    overflow: visible !important;
}

.product-picker-selected .product-picker-iva-field input,
.product-picker-selected .product-picker-warehouse-field .dxbl-text-edit,
.product-picker-selected .product-picker-warehouse-field .dxbl-combobox {
    min-width: 0 !important;
}

/* Compact master editors and stable commercial header grid */
.master-editor-popup-compact .dxbl-popup-body {
    padding: 12px 14px !important;
}

.master-editor-popup-compact .master-editor-shell {
    max-width: 560px !important;
    margin: 0 auto !important;
}

.master-editor-popup-compact .master-editor-card-clean {
    padding: 14px 16px !important;
}

.master-editor-popup-compact .erp-form-note {
    margin-bottom: 10px !important;
    padding-bottom: 8px !important;
}

.master-editor-popup-compact .master-sap-form {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
}

.master-editor-popup-compact .master-sap-form .sap-field {
    grid-column: span 3 !important;
    gap: 4px !important;
}

.master-editor-popup-compact .master-sap-form .sap-field-day,
.master-editor-popup-compact .master-sap-form .sap-field-money,
.master-editor-popup-compact .master-sap-form .sap-field-xs,
.master-editor-popup-compact .master-sap-form .sap-field-check {
    grid-column: span 2 !important;
}

.master-editor-popup-compact .master-sap-form .sap-field-full,
.master-editor-popup-compact .master-sap-form .sap-field-long {
    grid-column: 1 / -1 !important;
}

@media (max-width: 720px) {
    .master-editor-popup-compact .master-sap-form {
        grid-template-columns: 1fr !important;
    }

    .master-editor-popup-compact .master-sap-form .sap-field {
        grid-column: 1 / -1 !important;
    }
}

/* Final hardening for ERP forms with external master buttons */
.master-linked-control {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    gap: 6px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
}

.master-linked-control > *:not(.master-link-button) {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.master-linked-control > .dxbl-text-edit,
.master-linked-control > .dxbl-combobox,
.master-linked-control > .dxbl-edit,
.master-linked-control > .dxbl-date-edit,
.master-linked-control > .form-control,
.master-linked-control > input {
    flex: initial !important;
}

.master-linked-control .master-link-button {
    grid-column: 2 !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
    position: static !important;
}

.sap-product-card .sap-field:has(.master-linked-control),
.client-modern-page .sap-field:has(.master-linked-control),
.commercial-ficha-card .sap-field:has(.master-linked-control),
.product-picker-selected .sap-field:has(.master-linked-control) {
    max-width: none !important;
    overflow: visible !important;
}

.sap-product-card .sap-field-xs:has(.master-linked-control),
.client-modern-page .sap-field-xs:has(.master-linked-control),
.sap-product-card .sap-field-short:has(.master-linked-control),
.client-modern-page .sap-field-short:has(.master-linked-control) {
    grid-column: span 3 !important;
    min-width: 220px !important;
}

.sap-product-card .sap-field-medium:has(.master-linked-control),
.client-modern-page .sap-field-medium:has(.master-linked-control) {
    grid-column: span 4 !important;
    min-width: 260px !important;
}

.commercial-ficha-card .commercial-header-form .sap-field:has(.master-linked-control) {
    min-width: 240px !important;
}

.line-editor-popup .dxbl-popup,
.line-editor-popup .dxbl-popup-root,
.line-editor-popup .dxbl-popup-content {
    width: min(760px, 96vw) !important;
    max-width: 96vw !important;
}

.line-editor-popup .product-picker-selected .product-picker-iva-field {
    grid-column: span 2 !important;
}

.line-editor-popup .product-picker-selected .product-picker-total-field {
    grid-column: span 2 !important;
}

.line-editor-popup .product-picker-selected .product-picker-warehouse-field {
    grid-column: span 5 !important;
}

.product-picker-selected .master-linked-control {
    grid-template-columns: minmax(0, 1fr) 28px !important;
    gap: 5px !important;
}

.product-picker-selected .master-linked-control .master-link-button {
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
}

.product-picker-selected .master-linked-control input.numeric-text-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

@media (max-width: 900px) {
    .sap-product-card .sap-field-xs:has(.master-linked-control),
    .client-modern-page .sap-field-xs:has(.master-linked-control),
    .sap-product-card .sap-field-short:has(.master-linked-control),
    .client-modern-page .sap-field-short:has(.master-linked-control),
    .sap-product-card .sap-field-medium:has(.master-linked-control),
    .client-modern-page .sap-field-medium:has(.master-linked-control),
    .commercial-ficha-card .commercial-header-form .sap-field:has(.master-linked-control) {
        grid-column: 1 / -1 !important;
        min-width: 0 !important;
    }

    .line-editor-popup .product-picker-selected .product-picker-iva-field,
    .line-editor-popup .product-picker-selected .product-picker-total-field,
    .line-editor-popup .product-picker-selected .product-picker-warehouse-field {
        grid-column: 1 / -1 !important;
    }
}

/* Pedido/Presupuesto: SAP-style final polish */
.commercial-ficha-header,
.commercial-ficha-card,
.commercial-bottom-actions {
    width: min(100%, 1320px) !important;
    max-width: 1320px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.commercial-ficha-header {
    align-items: flex-start !important;
    margin-bottom: 12px !important;
}

.commercial-ficha-header h1 {
    color: #0f172a !important;
    font-size: 32px !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
}

.commercial-ficha-header .subhead {
    color: #64748b !important;
    font-size: 14px !important;
}

.commercial-ficha-header .sap-actions,
.commercial-bottom-actions {
    gap: 8px !important;
}

.commercial-ficha-header .dxbl-btn,
.commercial-bottom-actions .dxbl-btn {
    min-width: 78px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 5px rgba(15, 23, 42, .08) !important;
}

.commercial-ficha-card {
    padding: 14px 16px 16px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    background: #ffffff !important;
}

.commercial-ficha-card .sap-card-title {
    margin: -14px -16px 12px !important;
    padding: 10px 16px !important;
    border-bottom: 1px solid #dbe3ef !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.commercial-tabs {
    margin-top: 8px !important;
}

.commercial-tabs .dxbl-tabs-tablist {
    border-bottom: 1px solid #cbd5e1 !important;
    gap: 18px !important;
}

.commercial-tabs .dxbl-tabs-tab {
    min-height: 38px !important;
    padding: 0 0 9px !important;
    color: #334155 !important;
    font-size: 14px !important;
    border-radius: 0 !important;
}

.commercial-tabs .dxbl-tabs-tab.dxbl-active,
.commercial-tabs .dxbl-tabs-tab[aria-selected="true"] {
    color: #f26b16 !important;
    border-bottom: 2px solid #f26b16 !important;
}

.commercial-tabs .dxbl-tabs-content-panel,
.commercial-tabs .dxbl-tabs-tabpane {
    padding-top: 14px !important;
}

.commercial-ficha-card .sap-section {
    padding-top: 0 !important;
}

.commercial-ficha-card .sap-section-header {
    align-items: center !important;
    margin-bottom: 8px !important;
}

.commercial-ficha-card .sap-section-title {
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.commercial-lines-wrap {
    border: 1px solid #d5dde8 !important;
    border-radius: 5px !important;
    overflow-x: auto !important;
    background: #ffffff !important;
}

.commercial-lines-table {
    width: 100% !important;
    min-width: 1160px !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    font-size: 12px !important;
}

.commercial-lines-table th {
    height: 33px !important;
    padding: 6px 7px !important;
    background: #f1f5f9 !important;
    border-bottom: 1px solid #d5dde8 !important;
    color: #61718a !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-align: left !important;
    line-height: 1.1 !important;
}

.commercial-lines-table td {
    height: 34px !important;
    min-height: 34px !important;
    padding: 5px 7px !important;
    border-bottom: 1px solid #e5eaf1 !important;
    color: #17202a !important;
    vertical-align: middle !important;
    line-height: 1.15 !important;
    background: #ffffff !important;
}

.commercial-line-row:hover td {
    background: #f8fafc !important;
}

.commercial-lines-table .line-ref { width: 118px !important; }
.commercial-lines-table .line-detail { width: auto !important; }
.commercial-lines-table .line-qty { width: 70px !important; }
.commercial-lines-table .line-money { width: 78px !important; }
.commercial-lines-table .line-disc { width: 70px !important; }
.commercial-lines-table .line-date { width: 94px !important; }
.commercial-lines-table .line-warehouse { width: 58px !important; }
.commercial-lines-table .line-check { width: 50px !important; }
.commercial-lines-table .line-total { width: 96px !important; }
.commercial-lines-table .line-actions { width: 62px !important; }

.commercial-lines-table .line-detail-inline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 5px !important;
}

.commercial-lines-table .line-detail-text,
.commercial-lines-table .line-ref-cell,
.commercial-lines-table .line-warehouse-cell {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.commercial-lines-table .line-number-cell,
.commercial-lines-table .line-total-cell {
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
}

.commercial-lines-table .line-total-cell {
    font-weight: 700 !important;
}

.commercial-lines-table .line-check-cell,
.commercial-lines-table .line-warehouse-cell {
    text-align: center !important;
}

.commercial-lines-table .line-action-buttons {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 5px !important;
}

.commercial-lines-table .erp-row-icon-btn {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    border-radius: 3px !important;
}

.commercial-totals {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    margin-top: 10px !important;
}

.commercial-totals div {
    width: 150px !important;
    min-height: 52px !important;
    padding: 9px 12px !important;
    border: 1px solid #d7dee9 !important;
    border-radius: 5px !important;
    background: #f8fafc !important;
    box-shadow: none !important;
}

.commercial-totals span {
    color: #64748b !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

.commercial-totals strong {
    color: #17202a !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
}

.commercial-bottom-actions {
    justify-content: flex-end !important;
    padding: 12px 0 0 !important;
}

.line-editor-popup .dxbl-popup,
.line-editor-popup .dxbl-popup-root,
.line-editor-popup .dxbl-popup-content {
    width: min(760px, 96vw) !important;
    max-width: 96vw !important;
    border-radius: 6px !important;
}

.line-editor-form {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
    padding: 10px !important;
    border-radius: 5px !important;
}

.line-editor-form .sap-field {
    gap: 3px !important;
}

.line-editor-form .product-picker-ref-field { grid-column: span 2 !important; }
.line-editor-form .product-picker-detail-field { grid-column: span 10 !important; }
.line-editor-form .product-picker-qty-field,
.line-editor-form .product-picker-price-field,
.line-editor-form .product-picker-discount-field,
.line-editor-form .product-picker-line-discount-field,
.line-editor-form .product-picker-iva-field,
.line-editor-form .product-picker-total-field {
    grid-column: span 2 !important;
}
.line-editor-form .product-picker-date-field { grid-column: span 3 !important; }
.line-editor-form .product-picker-warehouse-field { grid-column: span 7 !important; }
.line-editor-form .product-picker-reserve-field { grid-column: span 2 !important; }
.line-editor-form .product-picker-long-detail-field { grid-column: 1 / -1 !important; }


@media (max-width: 760px) {
    .commercial-ficha-header {
        flex-direction: column !important;
    }

    .commercial-ficha-header .sap-actions,
    .commercial-bottom-actions,
    .commercial-totals {
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }

    .line-editor-form {
        grid-template-columns: 1fr !important;
    }

    .line-editor-form .sap-field {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
    }

    .commercial-totals div {
        width: min(100%, 180px) !important;
    }
}

/* Product detail and order header final alignment */
.sap-product-card,
.sap-product-card .sap-section,
.sap-product-card .sap-form,
.sap-product-card .sap-field,
.sap-product-card .sap-tabs,
.sap-product-card .dxbl-tabs-content-panel {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.sap-product-card .sap-form {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    align-items: end !important;
    overflow: hidden !important;
}

.sap-product-card .sap-field-full {
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
}

.sap-product-card .sap-field-long {
    max-width: 100% !important;
}

.sap-product-card .sap-field .dxbl-text-edit,
.sap-product-card .sap-field .dxbl-combobox,
.sap-product-card .sap-field .dxbl-date-edit,
.sap-product-card .sap-field .dxbl-memo,
.sap-product-card .sap-field .form-control,
.sap-product-card .sap-field .erp-native-input,
.sap-product-card .sap-field input,
.sap-product-card .sap-field textarea,
.sap-product-card .product-html-editor,
.sap-product-card .product-html-source,
.sap-product-card .seo-json-editor {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.sap-product-card .sap-field textarea,
.sap-product-card .dxbl-memo-input {
    overflow-wrap: anywhere !important;
}

.sap-product-card .master-linked-control {
    grid-template-columns: minmax(0, 1fr) 32px !important;
    gap: 6px !important;
    overflow: visible !important;
}

.sap-product-card .master-linked-control .master-link-button {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
}

.product-images-toolbar {
    align-items: center !important;
}

.product-add-image-button {
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 12px !important;
    border-radius: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

/* Pedido: cabecera SAP compacta con etiquetas laterales */
.content:has(.commercial-ficha-card) {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

.commercial-ficha-header,
.commercial-ficha-card,
.commercial-bottom-actions {
    width: 100% !important;
    max-width: 1380px !important;
}

.commercial-ficha-card .commercial-header-form {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 5px 12px !important;
    align-items: center !important;
}

.commercial-ficha-card .commercial-header-form .sap-field {
    display: grid !important;
    grid-template-columns: var(--pedido-label-width, 82px) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0 8px !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 32px !important;
}

.commercial-ficha-card .commercial-header-form .sap-field > label {
    grid-column: 1 !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 31px !important;
    min-height: 31px !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.commercial-ficha-card .commercial-header-form .sap-field > :not(label) {
    grid-column: 2 !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.commercial-ficha-card .commercial-header-form .dxbl-text-edit,
.commercial-ficha-card .commercial-header-form .dxbl-combobox,
.commercial-ficha-card .commercial-header-form .dxbl-date-edit,
.commercial-ficha-card .commercial-header-form .dxbl-edit,
.commercial-ficha-card .commercial-header-form .dxbl-input-group,
.commercial-ficha-card .commercial-header-form .form-control,
.commercial-ficha-card .commercial-header-form input,
.commercial-ficha-card .commercial-header-form .sap-inline-control {
    width: 100% !important;
    min-width: 0 !important;
    height: 31px !important;
    min-height: 31px !important;
    max-height: 31px !important;
}

.commercial-ficha-card .commercial-header-form .sap-inline-control,
.commercial-ficha-card .commercial-header-form .master-linked-control {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 31px !important;
    align-items: center !important;
    gap: 5px !important;
}

.commercial-ficha-card .commercial-header-form .erp-row-icon-btn,
.commercial-ficha-card .commercial-header-form .master-link-button {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
}

.commercial-ficha-card .commercial-header-form .commercial-shipping-flag .dxbl-checkbox,
.commercial-ficha-card .commercial-header-form .commercial-reserved-field .dxbl-checkbox,
.commercial-ficha-card .commercial-header-form .commercial-held-field .dxbl-checkbox {
    justify-content: flex-start !important;
    height: 31px !important;
    min-height: 31px !important;
}

.commercial-ficha-card .commercial-header-form .commercial-number-field { grid-column: 1 / span 3 !important; grid-row: 1 !important; --pedido-label-width: 66px; }
.commercial-ficha-card .commercial-header-form .commercial-date-field { grid-column: 4 / span 3 !important; grid-row: 1 !important; --pedido-label-width: 56px; }
.commercial-ficha-card .commercial-header-form .commercial-serie-field { grid-column: 7 / span 2 !important; grid-row: 1 !important; --pedido-label-width: 48px; }
.commercial-ficha-card .commercial-header-form .commercial-client-field { grid-column: 9 / span 4 !important; grid-row: 1 !important; --pedido-label-width: 58px; }

.commercial-ficha-card .commercial-header-form .commercial-state-field { grid-column: 1 / span 3 !important; grid-row: 2 !important; --pedido-label-width: 66px; }
.commercial-ficha-card .commercial-header-form .commercial-payment-state-field { grid-column: 4 / span 3 !important; grid-row: 2 !important; --pedido-label-width: 86px; }
.commercial-ficha-card .commercial-header-form .commercial-customer-ref-field { grid-column: 7 / span 3 !important; grid-row: 2 !important; --pedido-label-width: 78px; }
.commercial-ficha-card .commercial-header-form .commercial-delivery-field { grid-column: 10 / span 3 !important; grid-row: 2 !important; --pedido-label-width: 64px; }

.commercial-ficha-card .commercial-header-form .commercial-payment-field { grid-column: 1 / span 3 !important; grid-row: 3 !important; --pedido-label-width: 80px; }
.commercial-ficha-card .commercial-header-form .commercial-currency-field { grid-column: 4 / span 3 !important; grid-row: 3 !important; --pedido-label-width: 58px; }
.commercial-ficha-card .commercial-header-form .commercial-transport-field { grid-column: 7 / span 6 !important; grid-row: 3 !important; --pedido-label-width: 78px; }

.commercial-ficha-card .commercial-header-form .commercial-discount-field { grid-column: 1 / span 2 !important; grid-row: 4 !important; --pedido-label-width: 54px; }
.commercial-ficha-card .commercial-header-form .commercial-quick-discount-field { grid-column: 3 / span 2 !important; grid-row: 4 !important; --pedido-label-width: 76px; }
.commercial-ficha-card .commercial-header-form .commercial-shipping-flag { grid-column: 5 / span 2 !important; grid-row: 4 !important; --pedido-label-width: 58px; }
.commercial-ficha-card .commercial-header-form .commercial-reserved-field { grid-column: 7 / span 2 !important; grid-row: 4 !important; --pedido-label-width: 72px; }
.commercial-ficha-card .commercial-header-form .commercial-held-field { grid-column: 9 / span 2 !important; grid-row: 4 !important; --pedido-label-width: 66px; }
.commercial-ficha-card .commercial-header-form .commercial-held-reason-field { grid-column: 1 / span 4 !important; grid-row: 5 !important; --pedido-label-width: 66px; }

.commercial-ficha-card .commercial-header-form .commercial-observations-field {
    grid-column: 5 / span 8 !important;
    grid-row: 5 !important;
    --pedido-label-width: 96px;
}

.commercial-ficha-card .commercial-header-form .commercial-number-field,
.commercial-ficha-card .commercial-header-form .commercial-date-field,
.commercial-ficha-card .commercial-header-form .commercial-serie-field,
.commercial-ficha-card .commercial-header-form .commercial-client-field,
.commercial-ficha-card .commercial-header-form .commercial-state-field,
.commercial-ficha-card .commercial-header-form .commercial-payment-state-field,
.commercial-ficha-card .commercial-header-form .commercial-customer-ref-field,
.commercial-ficha-card .commercial-header-form .commercial-delivery-field,
.commercial-ficha-card .commercial-header-form .commercial-payment-field,
.commercial-ficha-card .commercial-header-form .commercial-currency-field,
.commercial-ficha-card .commercial-header-form .commercial-transport-field,
.commercial-ficha-card .commercial-header-form .commercial-discount-field,
.commercial-ficha-card .commercial-header-form .commercial-quick-discount-field,
.commercial-ficha-card .commercial-header-form .commercial-shipping-flag,
.commercial-ficha-card .commercial-header-form .commercial-reserved-field,
.commercial-ficha-card .commercial-header-form .commercial-held-field,
.commercial-ficha-card .commercial-header-form .commercial-held-reason-field,
.commercial-ficha-card .commercial-header-form .commercial-observations-field {
    --pedido-label-width: 76px !important;
}

.commercial-ficha-card .commercial-lines-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    border: 1px solid #d8dee8 !important;
    border-radius: 4px !important;
}

.commercial-ficha-card .commercial-lines-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    font-size: 12px !important;
}

.commercial-ficha-card .commercial-lines-table th,
.commercial-ficha-card .commercial-lines-table td {
    height: 35px !important;
    padding: 5px 6px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
}

.commercial-ficha-card .commercial-lines-table th {
    background: #f3f6fa !important;
    border-bottom: 1px solid #d8dee8 !important;
}

.commercial-ficha-card .commercial-lines-table .line-ref { width: 12.5% !important; }
.commercial-ficha-card .commercial-lines-table .line-detail,
.commercial-ficha-card .commercial-lines-table .line-detail-cell { width: 22.5% !important; min-width: 0 !important; }
.commercial-ficha-card .commercial-lines-table .line-qty { width: 5.2% !important; }
.commercial-ficha-card .commercial-lines-table .line-money { width: 6.5% !important; }
.commercial-ficha-card .commercial-lines-table .line-disc { width: 5.3% !important; }
.commercial-ficha-card .commercial-lines-table .line-date { width: 8.2% !important; }
.commercial-ficha-card .commercial-lines-table .line-warehouse { width: 4.2% !important; }
.commercial-ficha-card .commercial-lines-table .line-check { width: 4.2% !important; }
.commercial-ficha-card .commercial-lines-table .line-total { width: 7% !important; }
.commercial-ficha-card .commercial-lines-table .line-actions { width: 6% !important; }

.commercial-ficha-card .commercial-lines-table .line-detail-inline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 28px !important;
    gap: 5px !important;
    align-items: center !important;
}

.commercial-ficha-card .commercial-lines-table .line-detail-text,
.commercial-ficha-card .commercial-lines-table .line-ref-cell,
.commercial-ficha-card .commercial-lines-table .line-warehouse-cell,
.commercial-ficha-card .commercial-lines-table .line-check-cell {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.commercial-ficha-card .commercial-lines-table .line-action-buttons {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 4px !important;
    white-space: nowrap !important;
}

.commercial-ficha-card .commercial-lines-table .line-action-buttons .erp-row-icon-btn {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    padding: 0 !important;
}

.commercial-ficha-card .commercial-subsection-title {
    margin-top: 16px !important;
    margin-bottom: 8px !important;
    padding-top: 10px !important;
    border-top: 1px solid #dbe3ef !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.commercial-ficha-card .commercial-status-form {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 10px 14px !important;
    align-items: end !important;
}

.commercial-ficha-card .commercial-status-form .sap-field-check {
    grid-column: span 2 !important;
}

.commercial-ficha-card .commercial-status-form .sap-field-medium {
    grid-column: span 4 !important;
}

.commercial-ficha-card .commercial-status-form .sap-field-full {
    grid-column: 1 / -1 !important;
    max-width: none !important;
}

.commercial-ficha-card .commercial-status-form .sap-field-full .dxbl-memo,
.commercial-ficha-card .commercial-status-form .sap-field-full textarea {
    min-height: 92px !important;
    height: auto !important;
    resize: vertical !important;
}

@media (max-width: 1180px) {
    .commercial-ficha-card .commercial-header-form {
        grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    }

    .commercial-ficha-card .commercial-header-form .sap-field {
        grid-template-columns: 92px minmax(0, 1fr) !important;
        grid-column: span 6 !important;
        grid-row: auto !important;
    }

    .commercial-ficha-card .commercial-header-form .commercial-client-field,
    .commercial-ficha-card .commercial-header-form .commercial-payment-field,
    .commercial-ficha-card .commercial-header-form .commercial-transport-field,
    .commercial-ficha-card .commercial-header-form .commercial-observations-field {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
    }

    .commercial-ficha-card .commercial-lines-wrap {
        overflow-x: auto !important;
    }

    .commercial-ficha-card .commercial-lines-table {
        min-width: 920px !important;
    }
}

@media (max-width: 760px) {
    .commercial-ficha-card .commercial-header-form {
        grid-template-columns: 1fr !important;
    }

    .commercial-ficha-card .commercial-header-form .sap-field {
        grid-template-columns: 92px minmax(0, 1fr) !important;
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
    }

    .commercial-ficha-card .commercial-header-form .sap-field > label {
        text-align: left !important;
    }
}

/* Pedido: envio ordenado y sin duplicar transporte de cabecera */
.commercial-ficha-card .commercial-shipping-form,
.commercial-ficha-card .commercial-shipping-logistics-form {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 8px 14px !important;
    align-items: center !important;
}

.commercial-ficha-card .commercial-shipping-form .sap-field,
.commercial-ficha-card .commercial-shipping-logistics-form .sap-field {
    display: grid !important;
    grid-template-columns: 92px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    max-width: none !important;
}

.commercial-ficha-card .commercial-shipping-form .sap-field > label,
.commercial-ficha-card .commercial-shipping-logistics-form .sap-field > label {
    min-height: 31px !important;
    line-height: 31px !important;
    text-align: left !important;
    font-weight: 400 !important;
    white-space: nowrap !important;
}

.commercial-ficha-card .commercial-shipping-form .dxbl-text-edit,
.commercial-ficha-card .commercial-shipping-form .dxbl-combobox,
.commercial-ficha-card .commercial-shipping-form .form-control,
.commercial-ficha-card .commercial-shipping-form input,
.commercial-ficha-card .commercial-shipping-logistics-form .dxbl-text-edit,
.commercial-ficha-card .commercial-shipping-logistics-form .dxbl-combobox,
.commercial-ficha-card .commercial-shipping-logistics-form .form-control,
.commercial-ficha-card .commercial-shipping-logistics-form input {
    width: 100% !important;
    min-width: 0 !important;
    height: 31px !important;
    min-height: 31px !important;
    max-height: 31px !important;
    border-radius: 3px !important;
    font-size: 12px !important;
}

.commercial-ficha-card .commercial-shipping-form .sap-inline-control,
.commercial-ficha-card .commercial-shipping-form .master-linked-control,
.commercial-ficha-card .commercial-shipping-logistics-form .sap-inline-control,
.commercial-ficha-card .commercial-shipping-logistics-form .master-linked-control {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 31px !important;
    align-items: center !important;
    gap: 5px !important;
}

.commercial-ficha-card .commercial-shipping-form .erp-row-icon-btn,
.commercial-ficha-card .commercial-shipping-form .master-link-button,
.commercial-ficha-card .commercial-shipping-logistics-form .erp-row-icon-btn,
.commercial-ficha-card .commercial-shipping-logistics-form .master-link-button {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
}

.commercial-ficha-card .commercial-shipping-form .commercial-shipping-contact-field { grid-column: 1 / span 4 !important; grid-row: 1 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-document-field { grid-column: 5 / span 4 !important; grid-row: 1 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-name-field { grid-column: 9 / span 4 !important; grid-row: 1 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-address-field { grid-column: 1 / span 8 !important; grid-row: 2 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-postal-field { grid-column: 9 / span 4 !important; grid-row: 2 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-country-field { grid-column: 1 / span 4 !important; grid-row: 3 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-province-field { grid-column: 5 / span 4 !important; grid-row: 3 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-city-field { grid-column: 9 / span 4 !important; grid-row: 3 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-phone1-field { grid-column: 1 / span 4 !important; grid-row: 4 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-phone2-field { grid-column: 5 / span 4 !important; grid-row: 4 !important; }
.commercial-ficha-card .commercial-shipping-form .commercial-shipping-email-field { grid-column: 9 / span 4 !important; grid-row: 4 !important; }

.commercial-ficha-card .commercial-shipping-logistics-form .commercial-shipping-weight-field { grid-column: 1 / span 3 !important; }
.commercial-ficha-card .commercial-shipping-logistics-form .commercial-shipping-packages-field { grid-column: 4 / span 3 !important; }
.commercial-ficha-card .commercial-shipping-logistics-form .commercial-shipping-expedition-field { grid-column: 7 / span 3 !important; }
.commercial-ficha-card .commercial-shipping-logistics-form .commercial-shipping-date-field { grid-column: 10 / span 3 !important; }

.address-popup .sap-popup-form .sap-inline-control,
.address-popup .sap-popup-form .master-linked-control {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 31px !important;
    align-items: center !important;
    gap: 5px !important;
}

.address-popup .sap-popup-form .master-link-button {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
}

@media (max-width: 1180px) {
    .commercial-ficha-card .commercial-shipping-form .sap-field,
    .commercial-ficha-card .commercial-shipping-logistics-form .sap-field {
        grid-column: span 6 !important;
        grid-row: auto !important;
    }

    .commercial-ficha-card .commercial-shipping-form .commercial-shipping-address-field,
    .commercial-ficha-card .commercial-shipping-form .commercial-shipping-province-field,
    .commercial-ficha-card .commercial-shipping-form .commercial-shipping-email-field,
    .commercial-ficha-card .commercial-shipping-logistics-form .commercial-shipping-expedition-field {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 760px) {
    .commercial-ficha-card .commercial-shipping-form,
    .commercial-ficha-card .commercial-shipping-logistics-form {
        grid-template-columns: 1fr !important;
    }

    .commercial-ficha-card .commercial-shipping-form .sap-field,
    .commercial-ficha-card .commercial-shipping-logistics-form .sap-field {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
    }
}

/* Pedido: importe y acciones de lineas sin desbordes */
.commercial-ficha-card .commercial-lines-wrap {
    overflow-x: auto !important;
}

.commercial-ficha-card .commercial-lines-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 0 !important;
}

.commercial-ficha-card .commercial-lines-table .line-ref { width: 9.2% !important; }
.commercial-ficha-card .commercial-lines-table .line-detail,
.commercial-ficha-card .commercial-lines-table .line-detail-cell { width: 22.5% !important; }
.commercial-ficha-card .commercial-lines-table .line-qty { width: 5.4% !important; }
.commercial-ficha-card .commercial-lines-table .line-money { width: 6% !important; }
.commercial-ficha-card .commercial-lines-table .line-disc { width: 5.3% !important; }
.commercial-ficha-card .commercial-lines-table .line-date { width: 8% !important; }
.commercial-ficha-card .commercial-lines-table .line-warehouse { width: 4.5% !important; }
.commercial-ficha-card .commercial-lines-table .line-check { width: 4.5% !important; }
.commercial-ficha-card .commercial-lines-table .line-total,
.commercial-ficha-card .commercial-lines-table .line-total-cell { width: 8.8% !important; }
.commercial-ficha-card .commercial-lines-table .line-actions,
.commercial-ficha-card .commercial-lines-table tr > td:last-child { width: 6.8% !important; }

.commercial-ficha-card .commercial-lines-table .line-total-cell {
    text-align: right !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    padding-right: 8px !important;
}

.commercial-ficha-card .commercial-lines-table tr > td:last-child {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.commercial-ficha-card .commercial-lines-table .line-action-buttons {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 4px !important;
}

.line-editor-popup .product-picker-selected .product-picker-total-field {
    min-width: 0 !important;
    max-width: none !important;
}

.line-editor-popup .product-picker-selected .product-picker-total-field input.numeric-text-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

/* Comercial: albaranes y formato operativo */
.commercial-delivery-popup .commercial-delivery-lines-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 0 !important;
}

.commercial-delivery-popup .commercial-lines-wrap {
    max-width: 100% !important;
    overflow-x: auto !important;
}

.commercial-delivery-popup .commercial-delivery-lines-table th,
.commercial-delivery-popup .commercial-delivery-lines-table td {
    box-sizing: border-box !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.commercial-delivery-popup .commercial-delivery-lines-table .line-ref {
    width: 16% !important;
}

.commercial-delivery-popup .commercial-delivery-lines-table .line-detail {
    width: 40% !important;
}

.commercial-delivery-popup .commercial-delivery-lines-table .line-qty {
    width: 11% !important;
}

.commercial-delivery-popup .commercial-delivery-lines-table th:last-child,
.commercial-delivery-popup .commercial-delivery-lines-table td:last-child {
    width: 12% !important;
    min-width: 96px !important;
    text-align: right !important;
}

.commercial-delivery-popup .commercial-delivery-lines-table td:last-child input.numeric-text-input {
    display: inline-block !important;
    width: 72px !important;
    min-width: 0 !important;
    max-width: 72px !important;
    box-sizing: border-box !important;
    text-align: right !important;
}

.commercial-ficha-card .commercial-lines-table .line-ref-cell {
    white-space: nowrap !important;
}

.commercial-ficha-card .commercial-lines-table .line-number-cell input.numeric-text-input {
    width: 100% !important;
    min-width: 0 !important;
    text-align: right !important;
}

.commercial-ficha-header .sap-actions,
.commercial-bottom-actions.sap-actions,
.popup-footer-actions,
.popup-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

.commercial-bottom-actions .dxbl-btn,
.commercial-ficha-header .sap-actions .dxbl-btn,
.popup-footer-actions .erp-action-button,
.popup-actions .dxbl-btn {
    min-width: 82px !important;
    height: 34px !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.popup-footer-actions .erp-action-button {
    padding: 0 14px !important;
}

/* Comercial: controles compactos y combos limpios en ficha */
.commercial-ficha-card .dxbl-text-edit-input,
.commercial-ficha-card .dxbl-combobox input,
.commercial-ficha-card .dxbl-input,
.commercial-ficha-card .dxbl-edit,
.commercial-ficha-card .form-control,
.commercial-ficha-card .pro-native-input,
.commercial-ficha-card input,
.commercial-ficha-card textarea,
.product-picker-popup .dxbl-text-edit-input,
.product-picker-popup .dxbl-combobox input,
.product-picker-popup .form-control,
.product-picker-popup .pro-native-input,
.product-picker-popup input,
.product-picker-popup textarea {
    font-size: 11.5px !important;
}

.commercial-ficha-card .sap-field > label,
.commercial-ficha-card .sap-field label,
.product-picker-popup .sap-field > label,
.product-picker-popup .sap-field label {
    font-size: 11.5px !important;
    font-weight: 400 !important;
}

.commercial-ficha-card .sap-inline-control.master-linked-control,
.commercial-ficha-card .master-linked-control,
.product-picker-popup .sap-inline-control.master-linked-control,
.product-picker-popup .master-linked-control {
    grid-template-columns: minmax(0, 1fr) !important;
}

.commercial-ficha-card .master-linked-control .master-link-button,
.product-picker-popup .master-linked-control .master-link-button {
    display: none !important;
}

.commercial-ficha-card .master-linked-control > *:not(.master-link-button),
.product-picker-popup .master-linked-control > *:not(.master-link-button) {
    width: 100% !important;
    min-width: 0 !important;
}

/* Categorias: evita que el formulario del popup fuerce ancho fuera del cuadro */
.category-editor-popup .dxbl-popup-body,
.category-editor-popup .dxbl-popup-content {
    overflow-x: hidden !important;
}

.category-editor-popup .erp-product-form,
.category-editor-popup .dxbl-fl,
.category-editor-popup .dxbl-fl-gd,
.category-editor-popup .dxbl-fl-group-content,
.category-editor-popup .dxbl-row,
.category-editor-popup .dxbl-fl-i,
.category-editor-popup .dxbl-fl-ctrl {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

.category-editor-popup input,
.category-editor-popup textarea,
.category-editor-popup .dxbl-text-edit,
.category-editor-popup .dxbl-combobox,
.category-editor-popup .dxbl-memo,
.category-editor-popup .form-control,
.category-editor-popup .pro-native-input {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    width: 100% !important;
}

.category-editor-popup .numeric-text-input {
    display: block !important;
}

/* Producto: formulario compacto tipo pedido, con etiquetas laterales */
.app-shell .content > .erp-page:has(.sap-product-card) .sap-page-header,
.app-shell .content > .erp-page .sap-product-card {
    width: min(100%, 1320px) !important;
    max-width: 1320px !important;
}

.sap-product-card .sap-form {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 6px 14px !important;
    align-items: center !important;
}

.sap-product-card .sap-field {
    display: grid !important;
    grid-template-columns: var(--product-label-width, 112px) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0 8px !important;
    max-width: none !important;
    min-height: 31px !important;
}

.sap-product-card .sap-field > label {
    grid-column: 1 !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #334155 !important;
    font-size: 11.5px !important;
    font-weight: 400 !important;
    line-height: 31px !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sap-product-card .sap-field > :not(label) {
    grid-column: 2 !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.sap-product-card .sap-field-xs,
.sap-product-card .sap-field-day {
    grid-column: span 2 !important;
    min-width: 170px !important;
}

.sap-product-card .sap-field-percent,
.sap-product-card .sap-field-money,
.sap-product-card .sap-field-date,
.sap-product-card .sap-field-short {
    grid-column: span 3 !important;
    min-width: 230px !important;
}

.sap-product-card .sap-field-medium,
.sap-product-card .sap-field-check {
    grid-column: span 4 !important;
    min-width: 285px !important;
}

.sap-product-card .sap-field-long {
    grid-column: span 6 !important;
    min-width: 430px !important;
}

.sap-product-card .sap-field-full {
    grid-column: 1 / -1 !important;
    --product-label-width: 128px;
}

.sap-product-card .sap-field .dxbl-text-edit,
.sap-product-card .sap-field .dxbl-combobox,
.sap-product-card .sap-field .dxbl-date-edit,
.sap-product-card .sap-field .dxbl-edit,
.sap-product-card .sap-field .dxbl-input-group,
.sap-product-card .sap-field .form-control,
.sap-product-card .sap-field .erp-native-input,
.sap-product-card .sap-field input,
.sap-product-card .sap-field .sap-inline-control {
    width: 100% !important;
    min-width: 0 !important;
    height: 31px !important;
    min-height: 31px !important;
    max-height: 31px !important;
    font-size: 11.5px !important;
}

.sap-product-card .sap-field:has(.dxbl-memo) {
    align-items: start !important;
    min-height: 78px !important;
}

.sap-product-card .sap-field:has(.dxbl-memo) > label {
    align-self: start !important;
    line-height: 1.2 !important;
    padding-top: 8px !important;
}

.sap-product-card .sap-field .dxbl-memo,
.sap-product-card .sap-field textarea,
.sap-product-card .product-html-memo textarea,
.sap-product-card .product-long-text textarea {
    height: auto !important;
    min-height: 78px !important;
    max-height: none !important;
    font-size: 11.5px !important;
}

.sap-product-card .product-html-memo textarea {
    min-height: 132px !important;
    font-family: Consolas, "Courier New", monospace !important;
}

.sap-product-card .master-linked-control {
    grid-template-columns: minmax(0, 1fr) 30px !important;
    gap: 5px !important;
}

.sap-product-card .master-linked-control .master-link-button {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
}

.product-stock-kpis {
    grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
}

.product-stock-grid {
    max-width: 100% !important;
    overflow-x: auto !important;
}

.stock-subtitle {
    margin-top: 16px !important;
    margin-bottom: 8px !important;
}

.product-html-preview {
    overflow-wrap: anywhere;
}

.sap-product-card .sap-form-master {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 6px 14px !important;
    --product-label-width: 86px;
}

.sap-product-card .sap-form-master .product-reference-field {
    grid-column: 1 / span 4 !important;
}

.sap-product-card .sap-form-master .product-ean-field {
    grid-column: 5 / span 4 !important;
}

.sap-product-card .sap-form-master .product-sale-ref-field {
    grid-column: 9 / span 4 !important;
}

.sap-product-card .sap-form-master .product-detail-field,
.sap-product-card .sap-form-master .product-web-detail-field {
    grid-column: 1 / -1 !important;
}

.sap-product-card .product-composition-field {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    align-items: start !important;
    min-height: 330px !important;
}

.sap-product-card .product-composition-field > label {
    grid-column: 1 !important;
    align-self: start !important;
    padding: 0 !important;
    line-height: 16px !important;
}

.sap-product-card .product-composition-field > .product-composition-editor-shell {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
}

.product-composition-tabs,
.product-composition-tabs .dxbl-tabs,
.product-composition-tabs .dxbl-tabs-content,
.product-composition-tabs .dxbl-tabs-content-panel,
.product-composition-tabs .dxbl-tabs-tabpane {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.sap-product-card .product-composition-editor,
.sap-product-card .product-composition-editor .dxbl-html-editor,
.sap-product-card .product-composition-editor .dxbl-html-editor-content,
.sap-product-card .product-composition-editor .dxbl-html-editor-body,
.sap-product-card .product-html-memo,
.sap-product-card .product-html-memo .dxbl-memo,
.sap-product-card .product-html-memo textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.sap-product-card .product-composition-editor {
    min-height: 260px !important;
}

.sap-product-card .product-composition-editor .dxbl-html-editor-content,
.sap-product-card .product-composition-editor .dxbl-html-editor-body,
.sap-product-card .product-html-memo textarea {
    min-height: 240px !important;
}

@media (max-width: 980px) {
    .sap-product-card .sap-field-xs,
    .sap-product-card .sap-field-day,
    .sap-product-card .sap-field-percent,
    .sap-product-card .sap-field-money,
    .sap-product-card .sap-field-date,
    .sap-product-card .sap-field-short,
    .sap-product-card .sap-field-medium,
    .sap-product-card .sap-field-long,
    .sap-product-card .sap-field-full,
    .sap-product-card .sap-field-check {
        grid-column: 1 / -1 !important;
        min-width: 0 !important;
    }

    .sap-product-card .sap-field {
        grid-template-columns: 108px minmax(0, 1fr) !important;
    }

    .product-stock-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .sap-product-card .sap-form-master .product-reference-field,
    .sap-product-card .sap-form-master .product-ean-field,
    .sap-product-card .sap-form-master .product-sale-ref-field {
        grid-column: 1 / -1 !important;
    }
}

/* Tienda Campos Lorca */
.storefront-shell {
    --store-blue: #008fca;
    --store-blue-dark: #07557b;
    --store-orange: #f28c1b;
    --store-orange-dark: #d36f00;
    --store-ink: #142331;
    --store-line: #d8e4ea;
    min-height: 100vh;
    background: #f5f8fa;
    color: var(--store-ink);
    font-family: var(--sams-font-commerce);
}

.storefront-shell a {
    color: inherit;
}

.storefront-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #fff;
    border-bottom: 1px solid var(--store-line);
    box-shadow: 0 8px 22px rgba(7, 85, 123, .08);
}

.storefront-servicebar {
    display: flex;
    justify-content: center;
    gap: 28px;
    padding: 7px 18px;
    background: var(--store-blue-dark);
    color: #f9fafb;
    font-size: .78rem;
}

.storefront-servicebar a {
    color: #fff4df;
    font-weight: 800;
    text-decoration: none;
}

.storefront-mainbar,
.storefront-nav,
.storefront-content,
.storefront-footer {
    width: min(100% - 32px, 1440px);
    margin: 0 auto;
}

.storefront-mainbar {
    display: grid;
    grid-template-columns: 230px minmax(320px, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 16px 0 12px;
}

.storefront-logo-link {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.storefront-logo-link img {
    display: block;
    width: 206px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.storefront-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 116px;
    align-items: center;
    min-width: 0;
    height: 46px;
    padding: 4px;
    border: 1px solid rgba(0, 143, 202, .35);
    border-radius: 8px;
    overflow: hidden;
    background: linear-gradient(180deg, #ffffff, #f8fcfe);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .78), 0 8px 18px rgba(7, 85, 123, .08);
}

.storefront-search input {
    min-width: 0;
    height: 100%;
    padding: 0 14px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--store-ink);
}

.storefront-search button,
.store-action-primary {
    border: 0;
    background: var(--store-orange);
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}

.storefront-search button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 100%;
    border-radius: 6px;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .12);
}

.storefront-search button:hover,
.store-action-primary:hover {
    background: var(--store-orange-dark);
}

.store-action-primary:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.storefront-icon-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    white-space: nowrap;
}

.storefront-menu-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 44px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: var(--store-blue-dark);
    color: #fff;
    cursor: pointer;
}

.storefront-menu-toggle:hover,
.storefront-menu-toggle[aria-expanded="true"] {
    background: var(--store-orange);
    border-color: var(--store-orange);
}

.storefront-icon-link,
.storefront-nav > a,
.storefront-mega summary {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 12px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 800;
}

.storefront-icon-link {
    justify-content: center;
    width: 44px;
    padding: 0;
    border: 1px solid var(--store-line);
    background: #f8fcfe;
    color: var(--store-blue-dark);
    position: relative;
}

.storefront-icon-link:hover {
    border-color: rgba(0, 143, 202, .45);
    background: rgba(0, 143, 202, .08);
}

.storefront-cart-link span {
    position: absolute;
    right: -5px;
    top: -7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--store-orange);
    color: #fff;
    font-size: .68rem;
    font-weight: 900;
}

.storefront-nav {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    border-top: 1px solid var(--store-line);
    scrollbar-width: none;
}

.storefront-nav::-webkit-scrollbar {
    display: none;
}

.storefront-nav > a:hover,
.storefront-mega[open] summary,
.storefront-mega summary:hover {
    background: var(--store-blue-dark);
    color: #fff;
}

.storefront-mega {
    position: static;
}

.storefront-mega summary {
    list-style: none;
    cursor: pointer;
}

.storefront-mega summary::-webkit-details-marker {
    display: none;
}

.storefront-mega summary::after {
    content: "+";
    margin-left: 8px;
    color: var(--store-orange);
    font-weight: 900;
}

.storefront-mega[open] summary::after {
    color: #fff;
    content: "-";
}

.storefront-mega-panel {
    position: absolute;
    left: 0;
    right: 0;
    top: 46px;
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 18px;
    padding: 22px;
    border: 1px solid var(--store-line);
    border-top: 3px solid var(--store-orange);
    background: #fff;
    box-shadow: 0 22px 50px rgba(7, 85, 123, .18);
}

.storefront-mega[open] .storefront-mega-panel {
    display: grid;
}

.storefront-mega-column {
    min-width: 0;
}

.storefront-mega-column h2 {
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--store-line);
    color: var(--store-blue-dark);
    font-size: .95rem;
}

.storefront-mega-column h2 a {
    color: inherit;
    text-decoration: none;
}

.storefront-mega-column h2 a:hover {
    color: var(--store-orange-dark);
}

.storefront-mega-column a,
.storefront-category-rail a {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    text-decoration: none;
}

.storefront-mega-column a {
    padding: 7px 0;
    color: var(--store-ink);
    font-size: .9rem;
}

.storefront-mega-column a:hover {
    color: var(--store-orange-dark);
}

.storefront-mega-column span,
.storefront-category-rail span,
.store-product-info strong {
    min-width: 0;
    overflow-wrap: anywhere;
}

.storefront-mega-column small,
.storefront-category-rail small {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

.storefront-content {
    padding: 22px 0 42px;
}

.storefront-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 22px;
    align-items: end;
    min-height: 190px;
    margin-bottom: 22px;
    padding: 26px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.storefront-hero-copy p,
.storefront-results-head p,
.store-detail-brand p {
    margin: 0 0 6px;
    color: var(--store-orange-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.storefront-hero-copy h1,
.store-detail-summary h1 {
    margin: 0;
    max-width: 760px;
    color: var(--store-ink);
    font-size: 2.05rem;
    line-height: 1.08;
    letter-spacing: 0;
}

.storefront-hero-copy span {
    display: block;
    max-width: 620px;
    margin-top: 10px;
    color: #475569;
    font-size: 1.02rem;
}

.storefront-hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(96px, 1fr));
    gap: 10px;
}

.storefront-hero-metrics div {
    padding: 14px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #f8fcfe;
}

.storefront-hero-metrics strong {
    display: block;
    font-size: 1.45rem;
    font-variant-numeric: tabular-nums;
}

.storefront-hero-metrics span {
    display: block;
    color: #64748b;
    font-size: .78rem;
    font-weight: 800;
}

.storefront-catalog-shell {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.storefront-category-rail {
    position: sticky;
    top: 146px;
    display: grid;
    gap: 5px;
    padding: 10px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.storefront-category-rail a {
    min-height: 38px;
    padding: 0 10px;
    border-radius: 6px;
    color: var(--store-ink);
}

.storefront-category-rail a:hover,
.storefront-category-rail a.active {
    background: var(--store-blue-dark);
    color: #fff;
}

.storefront-category-rail a.active small,
.storefront-category-rail a:hover small {
    color: #f8fafc;
}

.storefront-products-area {
    min-width: 0;
}

.storefront-results-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.storefront-results-head h2 {
    margin: 0;
    font-size: 1.35rem;
}

.storefront-results-head > span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 10px;
    border-radius: 6px;
    background: rgba(0, 143, 202, .1);
    color: var(--store-blue-dark);
    font-weight: 900;
    white-space: nowrap;
}

.storefront-product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    align-items: stretch;
    gap: 14px;
}

.storefront-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 18px;
}

.storefront-page-link,
.storefront-page-gap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
    padding: 0 12px;
    border-radius: 6px;
    font-weight: 900;
    line-height: 1;
}

.storefront-page-link {
    border: 1px solid var(--store-line);
    background: #fff;
    color: var(--store-blue-dark);
    text-decoration: none;
    transition: border-color .14s ease, background .14s ease, color .14s ease;
}

.storefront-page-link:hover {
    border-color: var(--store-blue);
    background: rgba(0, 143, 202, .08);
}

.storefront-page-link.active {
    border-color: var(--store-blue-dark);
    background: var(--store-blue-dark);
    color: #fff;
}

.storefront-page-link.disabled {
    border-color: #e5e7eb;
    background: #f8fafc;
    color: #94a3b8;
}

.storefront-page-side {
    min-width: 104px;
}

.storefront-page-gap {
    min-width: 24px;
    padding: 0;
    color: #64748b;
}

.store-product-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
    color: var(--store-ink);
    text-decoration: none;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

.store-product-card:hover {
    transform: translateY(-2px);
    border-color: var(--store-blue);
    box-shadow: 0 14px 28px rgba(7, 85, 123, .14);
}

.store-product-image {
    position: relative;
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: #fbfdff;
    border-bottom: 1px solid var(--store-line);
}

.store-product-image img {
    width: 100%;
    height: 100%;
    padding: 10px;
    object-fit: contain;
    box-sizing: border-box;
}

.store-product-image span {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 4px 7px;
    border-radius: 4px;
    background: var(--store-orange);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
}

.store-product-info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    padding: 12px;
}

.store-product-info small {
    min-width: 0;
    overflow: hidden;
    color: #64748b;
    font-size: .75rem;
    font-weight: 900;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.store-product-brand-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.store-product-brand-row img {
    width: 34px;
    height: 22px;
    object-fit: contain;
    flex: 0 0 auto;
}

.store-product-info strong {
    display: -webkit-box;
    min-width: 0;
    min-height: 40px;
    color: var(--store-ink);
    font-size: .94rem;
    line-height: 1.28;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.store-product-short {
    display: -webkit-box;
    min-height: 36px;
    overflow: hidden;
    color: #475569;
    font-size: .82rem;
    line-height: 1.35;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.store-product-info em {
    min-width: 0;
    overflow: hidden;
    color: #64748b;
    font-size: .78rem;
    font-style: normal;
    font-variant-numeric: tabular-nums;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.store-product-bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    align-items: end;
    min-width: 0;
    margin-top: auto;
    padding-top: 8px;
}

.store-product-bottom b {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-align: right;
    font-size: 1rem;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: normal;
}

.stock-ok,
.stock-muted {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    max-width: 100%;
    overflow: hidden;
    min-height: 24px;
    padding: 0 7px;
    border-radius: 4px;
    font-size: .73rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-ok {
    background: rgba(0, 143, 202, .1);
    color: var(--store-blue-dark);
}

.stock-muted {
    background: #fff4df;
    color: #825100;
}

.storefront-loading,
.storefront-error,
.storefront-empty {
    padding: 22px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
    color: #475569;
}

.storefront-loading.compact {
    margin-bottom: 14px;
}

.storefront-error {
    border-color: #f2aaa6;
    color: #b42318;
}

.store-product-detail {
    display: grid;
    grid-template-columns: minmax(320px, 52%) minmax(0, 1fr);
    grid-template-areas:
        "breadcrumbs breadcrumbs"
        "gallery summary"
        "gallery purchase"
        "description description";
    gap: 28px;
    align-items: start;
}

.store-detail-gallery,
.store-detail-summary,
.store-detail-purchase,
.store-detail-breadcrumbs {
    min-width: 0;
}

.store-detail-gallery {
    grid-area: gallery;
}

.store-detail-summary {
    grid-area: summary;
}

.store-detail-purchase {
    grid-area: purchase;
}

.store-detail-main-image {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 520px;
    padding: 0;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
    cursor: zoom-in;
}

.store-detail-main-image img {
    width: 100%;
    max-height: 520px;
    padding: 18px;
    object-fit: contain;
    box-sizing: border-box;
}

.store-detail-main-image span {
    position: absolute;
    right: 14px;
    bottom: 14px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(7, 85, 123, .88);
    color: #fff;
    font-size: .75rem;
    font-weight: 900;
}

.store-detail-thumbs {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.store-detail-thumbs button {
    width: 100%;
    padding: 0;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
}

.store-detail-thumbs button:hover,
.store-detail-thumbs button.active {
    border-color: var(--store-orange);
    box-shadow: 0 0 0 2px rgba(248, 137, 20, .16);
}

.store-detail-thumbs img {
    width: 100%;
    aspect-ratio: 1;
    padding: 6px;
    object-fit: contain;
    box-sizing: border-box;
}

.store-detail-summary,
.store-detail-purchase {
    padding: 22px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.store-detail-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.store-detail-brand img {
    max-width: 112px;
    max-height: 42px;
    object-fit: contain;
}

.store-detail-breadcrumbs {
    grid-area: breadcrumbs;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0 0 -8px;
    color: #64748b;
    font-size: .85rem;
    font-weight: 800;
}

.store-detail-breadcrumbs a {
    color: var(--store-blue-dark);
    text-decoration: none;
}

.store-detail-summary h2 {
    margin: 10px 0 0;
    color: #475569;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.35;
}

.store-back-link {
    display: inline-flex;
    margin-bottom: 18px;
    color: var(--store-blue-dark);
    font-weight: 900;
    text-decoration: none;
}

.store-detail-meta,
.store-detail-tags,
.store-detail-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.store-detail-meta span,
.store-detail-tags a {
    padding: 6px 9px;
    border-radius: 5px;
    background: #f0f8fc;
    color: var(--store-blue-dark);
    font-size: .82rem;
    text-decoration: none;
}

.store-detail-buybox {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    margin-top: 22px;
    padding: 16px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #f8fcfe;
}

.store-detail-buybox strong {
    font-size: 1.8rem;
}

.store-action-primary {
    grid-column: 1 / -1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 6px;
    text-decoration: none;
}

.store-action-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #fff;
    color: var(--store-blue-dark);
    font-weight: 900;
    text-decoration: none;
}

.store-action-secondary:hover {
    border-color: rgba(0, 143, 202, .42);
    background: rgba(0, 143, 202, .08);
}

.store-detail-cart-controls {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    gap: 10px;
}

.store-detail-cart-controls input {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 0 10px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    font: inherit;
}

.store-detail-cart-controls .store-action-primary {
    grid-column: auto;
}

.store-tech-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 42px;
    margin-top: 12px;
    border: 1px solid rgba(0, 143, 202, .28);
    border-radius: 6px;
    background: #fff;
    color: var(--store-blue-dark);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.store-tech-button:hover {
    background: #f0f8fc;
}

.store-cart-feedback {
    grid-column: 1 / -1;
    color: var(--store-blue-dark);
    font-weight: 900;
    text-decoration: none;
}

.storefront-cms-page,
.store-checkout-shell {
    max-width: 1120px;
    margin: 0 auto;
}

.storefront-cms-page {
    padding: 30px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.storefront-cms-page header p {
    margin: 0 0 8px;
    color: var(--store-orange-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.storefront-cms-page h1,
.store-checkout-shell h1 {
    margin: 0 0 20px;
    color: var(--store-ink);
    font-size: 2.2rem;
    line-height: 1.08;
}

.storefront-cms-content {
    color: #334155;
    line-height: 1.62;
}

.storefront-cms-content img {
    max-width: 100%;
    height: auto;
}

.store-checkout-shell {
    display: grid;
    gap: 18px;
}

.store-checkout-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.store-checkout-steps a,
.store-checkout-steps span,
.store-checkout-steps strong {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #fff;
    color: var(--store-blue-dark);
    font-size: .84rem;
    font-weight: 900;
    text-decoration: none;
}

.store-checkout-steps strong {
    border-color: var(--store-blue-dark);
    background: var(--store-blue-dark);
    color: #fff;
}

.store-cart-layout,
.store-payment-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 18px;
    align-items: start;
}

.store-cart-lines {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.store-cart-line {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) 92px 120px auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.store-cart-line img {
    width: 92px;
    aspect-ratio: 1;
    padding: 6px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    object-fit: contain;
    box-sizing: border-box;
}

.store-cart-line div {
    min-width: 0;
}

.store-cart-line small,
.store-cart-line span {
    display: block;
    color: #64748b;
    font-weight: 800;
}

.store-cart-line a {
    display: block;
    color: var(--store-ink);
    font-weight: 900;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.store-cart-line input,
.store-checkout-form input,
.store-checkout-form select,
.store-checkout-form textarea,
.store-coupon-form input {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #fff;
    color: var(--store-ink);
    font: inherit;
    box-sizing: border-box;
}

.store-cart-line input,
.store-checkout-form input,
.store-checkout-form select,
.store-coupon-form input {
    min-height: 42px;
    padding: 0 10px;
}

.store-checkout-form textarea {
    min-height: 92px;
    padding: 10px;
    resize: vertical;
}

.store-cart-line strong {
    text-align: right;
    white-space: nowrap;
}

.store-cart-line button,
.store-coupon-form button {
    min-height: 36px;
    border: 0;
    border-radius: 6px;
    background: #fff4df;
    color: #825100;
    font-weight: 900;
    cursor: pointer;
}

.store-cart-summary {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(7, 85, 123, .08);
}

.store-cart-summary h2 {
    margin: 0;
    color: var(--store-ink);
    font-size: 1.15rem;
}

.store-coupon-form {
    display: grid;
    gap: 7px;
}

.store-coupon-form label,
.store-checkout-form label {
    display: grid;
    gap: 7px;
    color: var(--store-ink);
    font-size: .84rem;
    font-weight: 900;
}

.store-coupon-form div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 86px;
    gap: 8px;
}

.store-coupon-form .ok {
    color: var(--store-blue-dark);
    font-weight: 900;
}

.store-coupon-form .error {
    color: #b42318;
    font-weight: 900;
}

.store-cart-summary dl {
    display: grid;
    gap: 8px;
    margin: 0;
}

.store-cart-summary dl div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.store-cart-summary dt,
.store-cart-summary dd {
    margin: 0;
}

.store-cart-summary dd {
    color: var(--store-ink);
    font-weight: 900;
}

.store-cart-summary dl div:last-child {
    padding-top: 10px;
    border-top: 1px solid var(--store-line);
    font-size: 1.15rem;
}

.store-checkout-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.store-checkout-form .wide,
.store-checkout-form .storefront-error,
.store-checkout-actions,
.store-check {
    grid-column: 1 / -1;
}

.store-check {
    display: inline-flex !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    justify-content: start;
}

.store-check input {
    width: auto;
    min-height: 0;
}

.store-checkout-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.store-payment-form {
    align-self: start;
}

.store-payment-choice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid rgba(0, 143, 202, .28);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 143, 202, .08), rgba(255, 141, 20, .12));
}

.store-payment-choice strong,
.store-payment-choice span {
    display: block;
}

.store-payment-choice strong {
    color: var(--store-ink);
    font-size: 1rem;
}

.store-payment-choice span {
    color: #475569;
    font-size: .88rem;
    font-weight: 800;
}

.store-payment-choice .store-payment-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    background: var(--store-ink);
    color: #fff;
    font-size: .78rem;
    font-weight: 900;
    white-space: nowrap;
}

.store-payment-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    color: #475569;
}

.store-payment-line span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.store-payment-line strong {
    color: var(--store-ink);
    white-space: nowrap;
}

.storefront-warning {
    padding: 12px 14px;
    border: 1px solid rgba(255, 141, 20, .35);
    border-radius: 8px;
    background: #fff7ed;
    color: #8a4b00;
    font-weight: 900;
}

.store-payment-result {
    align-items: start;
    text-align: left;
}

.store-payment-result span {
    color: var(--store-orange-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-payment-result.ok span {
    color: var(--store-blue-dark);
}

.store-detail-specs {
    padding: 0;
}

.store-detail-specs div {
    min-width: 120px;
    padding: 10px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
}

.store-detail-specs dt {
    color: #64748b;
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-detail-specs dd {
    margin: 3px 0 0;
}

.store-detail-description {
    grid-area: description;
    color: #334155;
    line-height: 1.55;
    padding: 24px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.store-detail-description h2 {
    margin: 0 0 8px;
    color: var(--store-ink);
    font-size: 1.35rem;
}

.store-detail-description-html {
    overflow-wrap: anywhere;
}

.store-detail-description-html img,
.store-detail-description-html iframe {
    max-width: 100%;
}

.store-detail-description-html table {
    width: 100%;
    border-collapse: collapse;
}

.store-image-zoom {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 28px;
    background: rgba(8, 23, 37, .86);
    cursor: zoom-out;
}

.store-image-zoom img {
    max-width: min(1120px, 96vw);
    max-height: 88vh;
    object-fit: contain;
    background: #fff;
    border-radius: 8px;
}

.store-image-zoom button {
    position: absolute;
    top: 18px;
    right: 18px;
    min-height: 40px;
    padding: 0 14px;
    border: 0;
    border-radius: 6px;
    background: var(--store-orange);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

.store-tech-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(8, 23, 37, .72);
}

.store-tech-card {
    position: relative;
    width: min(720px, 100%);
    max-height: min(760px, 88vh);
    overflow: auto;
    padding: 26px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(7, 85, 123, .28);
}

.store-tech-kicker {
    margin: 0 0 4px;
    color: var(--store-orange-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-tech-card h2 {
    margin: 0 0 16px;
    color: var(--store-ink);
    font-size: 1.55rem;
}

.store-tech-close {
    position: absolute;
    top: 14px;
    right: 14px;
    min-height: 38px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: var(--store-orange);
    color: #fff;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.store-tech-html {
    margin-bottom: 16px;
    color: #334155;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.store-tech-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.store-tech-list div {
    padding: 11px 12px;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #f8fcfe;
    min-width: 0;
}

.store-tech-list dt {
    color: #64748b;
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-tech-list dd {
    margin: 3px 0 0;
    color: var(--store-ink);
    overflow-wrap: anywhere;
}

.storefront-footer {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    align-items: start;
    gap: 28px;
    padding: 24px 0 34px;
    border-top: 1px solid var(--store-line);
    color: #475569;
}

.storefront-footer section {
    display: grid;
    gap: 8px;
}

.storefront-footer h2 {
    margin: 0 0 3px;
    color: var(--store-ink);
    font-size: .95rem;
    text-transform: uppercase;
}

.storefront-footer a {
    color: var(--store-blue-dark);
    font-weight: 900;
    text-decoration: none;
}

@media (max-width: 1080px) {
    .storefront-mainbar {
        grid-template-columns: 190px minmax(0, 1fr);
    }

    .storefront-icon-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .storefront-hero,
    .storefront-catalog-shell,
    .store-product-detail,
    .store-cart-layout,
    .store-payment-layout {
        grid-template-columns: 1fr;
    }

    .store-product-detail {
        grid-template-areas:
            "breadcrumbs"
            "summary"
            "gallery"
            "purchase"
            "description";
    }

    .storefront-category-rail {
        position: static;
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 720px) {
    .storefront-servicebar {
        align-items: center;
        flex-direction: column;
        gap: 4px;
        text-align: center;
    }

    .storefront-mainbar {
        grid-template-columns: minmax(0, 1fr) auto auto;
        gap: 12px;
    }

    .storefront-search {
        grid-column: 1 / -1;
        grid-row: 2;
        grid-template-columns: minmax(0, 1fr) 48px;
    }

    .storefront-logo-link {
        grid-column: 1;
        grid-row: 1;
    }

    .storefront-icon-actions {
        grid-column: 2;
        grid-row: 1;
        justify-content: flex-end;
    }

    .storefront-menu-toggle {
        display: inline-flex;
        grid-column: 3;
        grid-row: 1;
    }

    .storefront-search button {
        min-height: 40px;
    }

    .storefront-search button span {
        display: none;
    }

    .storefront-nav {
        display: none;
        align-items: stretch;
        flex-direction: column;
        gap: 4px;
        margin-top: 0;
        padding: 8px;
        border: 1px solid var(--store-line);
        border-radius: 8px;
        background: #fff;
        box-shadow: 0 16px 32px rgba(7, 85, 123, .12);
        overflow: visible;
    }

    .storefront-header.menu-open .storefront-nav {
        display: flex;
    }

    .storefront-nav > a,
    .storefront-mega summary {
        width: 100%;
        justify-content: space-between;
        box-sizing: border-box;
    }

    .storefront-mega {
        position: static;
    }

    .storefront-mega-panel {
        position: static;
        inset: auto;
        max-height: min(420px, 54vh);
        overflow: auto;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 4px 0 8px;
        padding: 10px 12px;
        border-top-width: 2px;
        box-shadow: none;
    }

    .storefront-hero {
        min-height: 0;
        padding: 18px;
    }

    .storefront-hero-metrics {
        grid-template-columns: 1fr;
    }

    .storefront-results-head {
        align-items: stretch;
        flex-direction: column;
    }

    .storefront-footer {
        grid-template-columns: 1fr 1fr;
    }

    .store-account-grid {
        grid-template-columns: 1fr;
    }

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

    .storefront-pagination {
        justify-content: stretch;
    }

    .storefront-page-link {
        flex: 1 1 44px;
    }

    .storefront-page-gap {
        flex: 0 0 18px;
    }

    .storefront-products-area {
        order: 1;
    }

    .storefront-category-rail {
        order: 2;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: 320px;
        overflow: auto;
    }

    .store-detail-main-image {
        min-height: 320px;
    }

    .store-cart-line {
        grid-template-columns: 74px minmax(0, 1fr);
    }

    .store-cart-line img {
        width: 74px;
    }

    .store-cart-line input,
    .store-cart-line strong,
    .store-cart-line button {
        grid-column: 2;
    }

    .store-cart-line strong {
        text-align: left;
    }

    .store-checkout-form {
        grid-template-columns: 1fr;
    }

    .store-checkout-actions {
        justify-content: stretch;
    }

    .store-checkout-actions > * {
        flex: 1 1 180px;
    }

    .store-detail-thumbs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .store-tech-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 430px) {
    .storefront-product-grid {
        grid-template-columns: 1fr;
    }

    .storefront-page-side {
        min-width: 120px;
    }

    .storefront-footer {
        grid-template-columns: 1fr;
    }
}

.store-home-slider {
    position: relative;
    height: 420px;
    overflow: hidden;
    border-radius: 8px;
    background: #111827;
}

.store-slide {
    position: absolute;
    inset: 0;
    display: block;
    color: #fff;
    opacity: 0;
    text-decoration: none;
    animation: store-slide-fade 15s infinite;
}

.store-slide-two {
    animation-delay: 5s;
}

.store-slide-three {
    animation-delay: 10s;
}

.store-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.store-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(7, 85, 123, .66), rgba(7, 85, 123, .08) 58%, rgba(20, 35, 49, .18));
}

.store-slide span {
    position: absolute;
    left: 36px;
    bottom: 32px;
    z-index: 1;
    max-width: 520px;
    color: #fff;
    font-size: 2.3rem;
    font-weight: 900;
    line-height: 1.05;
}

@keyframes store-slide-fade {
    0%,
    30% {
        opacity: 1;
    }

    36%,
    94% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.store-home-copy {
    margin-top: 20px;
    padding: 42px 26px;
    border-radius: 8px;
    background: #111;
    color: #fff;
    text-align: center;
}

.store-home-copy p {
    margin: 0 0 12px;
    color: var(--store-orange);
    font-family: var(--sams-font-decorative);
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
}

.store-home-copy h1 {
    margin: 0 auto;
    max-width: 980px;
    color: #fff;
    font-size: 3rem;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
}

.store-home-copy h2 {
    max-width: 760px;
    margin: 14px auto 0;
    color: #f1f5f9;
    font-size: 1.45rem;
    font-weight: 500;
    line-height: 1.35;
}

.store-home-categories {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 22px;
}

.store-home-category {
    position: relative;
    min-height: 245px;
    overflow: hidden;
    border-radius: 8px;
    background: #111827;
    color: #fff;
    text-decoration: none;
}

.store-home-category img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .22s ease;
}

.store-home-category::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .06), rgba(0, 0, 0, .78));
}

.store-home-category:hover img {
    transform: scale(1.04);
}

.store-home-category span,
.store-home-category small {
    position: absolute;
    z-index: 1;
    left: 18px;
    right: 18px;
}

.store-home-category span {
    bottom: 42px;
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.store-home-category small {
    bottom: 18px;
    color: rgba(255, 255, 255, .86);
    font-size: .9rem;
    font-weight: 800;
}

.store-home-section {
    margin-top: 34px;
}

.store-section-title {
    max-width: 900px;
    margin: 0 auto 24px;
    text-align: center;
}

.store-section-title hr {
    margin: 12px 0;
    border: 0;
    border-top: 2px solid #111;
}

.store-section-title h2 {
    margin: 0;
    color: #111;
    font-size: 2rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-section-title p {
    max-width: 650px;
    margin: 8px auto 0;
    color: #475569;
    font-size: 1.05rem;
}

.store-home-product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.store-home-product-grid .store-product-card {
    border-color: rgba(20, 20, 20, .16);
    box-shadow: 0 12px 32px rgba(17, 24, 39, .08);
}

.store-home-product-grid .store-product-image {
    min-height: 300px;
}

.store-home-product-grid .store-product-info {
    padding: 16px 18px 18px;
    text-align: center;
}

.store-home-product-grid .store-product-info strong {
    min-height: 50px;
    font-size: 1.1rem;
    text-transform: uppercase;
}

.store-home-empty {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.store-home-wide-photo {
    margin-top: 36px;
    height: 360px;
    overflow: hidden;
    border-radius: 8px;
    background: #111827;
}

.store-home-wide-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.storefront-results-head h1 {
    margin: 0;
    font-size: 2rem;
    line-height: 1.1;
}

.store-account-shell {
    display: grid;
    gap: 20px;
}

.store-account-head,
.store-account-empty,
.store-account-panel {
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(7, 85, 123, .08);
}

.store-account-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    padding: 26px;
}

.store-account-head p,
.store-account-empty p {
    margin: 0 0 8px;
    color: var(--store-orange-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-account-head h1,
.store-account-empty h1 {
    margin: 0;
    color: var(--store-ink);
    font-size: 2.4rem;
    line-height: 1.05;
}

.store-account-head span,
.store-account-empty span {
    display: block;
    margin-top: 8px;
    color: #64748b;
}

.store-account-contact {
    display: grid;
    gap: 6px;
    min-width: 220px;
    text-align: right;
    font-weight: 800;
}

.store-account-empty {
    max-width: 820px;
    margin: 36px auto;
    padding: 32px;
    text-align: center;
}

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

.store-account-kpis div {
    padding: 18px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #fff;
}

.store-account-kpis span {
    display: block;
    color: #64748b;
    font-size: .8rem;
    font-weight: 900;
    text-transform: uppercase;
}

.store-account-kpis strong {
    display: block;
    margin-top: 8px;
    color: var(--store-blue-dark);
    font-size: 1.65rem;
    font-variant-numeric: tabular-nums;
}

.store-account-panel {
    padding: 18px;
}

.store-account-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.store-account-panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.store-account-panel-title h2 {
    margin: 0;
    color: var(--store-ink);
    font-size: 1.4rem;
    text-transform: uppercase;
}

.store-account-panel-title span {
    color: #64748b;
    font-weight: 900;
}

.store-account-panel-title a,
.store-account-panel-title button {
    color: var(--store-blue-dark);
    font: inherit;
    font-size: .86rem;
    font-weight: 900;
    text-decoration: none;
}

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

.store-account-form label {
    display: grid;
    gap: 7px;
    color: var(--store-ink);
    font-size: .84rem;
    font-weight: 900;
}

.store-account-form .wide,
.store-account-form .store-check,
.store-account-form .store-action-primary,
.store-account-form .store-inline-message,
.store-account-form .store-account-note,
.store-address-editor .store-checkout-actions {
    grid-column: 1 / -1;
}

.store-account-form input,
.store-account-form textarea {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--store-line);
    border-radius: 6px;
    background: #fff;
    color: var(--store-ink);
    font: inherit;
    box-sizing: border-box;
}

.store-account-form input {
    min-height: 42px;
    padding: 0 10px;
}

.store-account-form textarea {
    min-height: 92px;
    padding: 10px;
    resize: vertical;
}

.store-account-form input:disabled {
    background: #edf2f7;
    color: #64748b;
    cursor: not-allowed;
}

.store-account-note {
    margin: 0;
    padding: 11px 12px;
    border-radius: 6px;
    background: #fff7ed;
    color: #9a4f00;
    font-size: .86rem;
    font-weight: 800;
}

.store-inline-message {
    padding: 11px 12px;
    border-radius: 6px;
    font-weight: 900;
}

.store-inline-message.ok {
    background: #e9f8ef;
    color: #166534;
}

.store-inline-message.error {
    background: #fff1f0;
    color: #b42318;
}

.store-address-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.store-address-card {
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #f8fcfe;
}

.store-address-card strong {
    color: var(--store-ink);
}

.store-address-card span,
.store-address-card small {
    color: #64748b;
    overflow-wrap: anywhere;
}

.store-address-card div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}

.store-address-card button {
    min-height: 34px;
    padding: 0 10px;
    border: 1px solid rgba(0, 143, 202, .28);
    border-radius: 6px;
    background: #fff;
    color: var(--store-blue-dark);
    font: inherit;
    font-size: .82rem;
    font-weight: 900;
    cursor: pointer;
}

.store-address-card button:hover {
    background: #f0f8fc;
}

.store-address-editor {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--store-line);
}

.store-checkout-address-book {
    margin-bottom: 18px;
}

.store-state-chip {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    width: fit-content;
    margin-left: auto;
    margin-bottom: 4px;
    padding: 0 9px;
    border-radius: 999px;
    background: rgba(0, 143, 202, .1);
    color: var(--store-blue-dark) !important;
}

.store-account-documents,
.store-account-shipments {
    display: grid;
    gap: 8px;
}

.store-account-documents article,
.store-account-shipments article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    min-height: 58px;
    padding: 12px 14px;
    border: 1px solid var(--store-line);
    border-radius: 8px;
    background: #f8fcfe;
}

.store-account-documents article > div,
.store-account-shipments article {
    min-width: 0;
}

.store-account-documents article > div:last-child {
    text-align: right;
}

.store-account-documents strong,
.store-account-shipments strong {
    display: block;
    color: var(--store-ink);
}

.store-account-documents span,
.store-account-shipments span,
.store-account-shipments small {
    display: block;
    color: #64748b;
    font-weight: 800;
}

.store-account-documents b {
    display: block;
    color: var(--store-blue-dark);
    font-size: 1.05rem;
    white-space: nowrap;
}

@media (max-width: 1080px) {
    .store-home-categories,
    .store-home-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .store-home-copy h1 {
        font-size: 2.35rem;
    }

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

@media (max-width: 720px) {
    .store-home-slider {
        height: 300px;
    }

    .store-slide span {
        left: 20px;
        right: 20px;
        bottom: 22px;
        font-size: 1.6rem;
    }

    .store-home-copy {
        padding: 30px 18px;
    }

    .store-home-copy h1 {
        font-size: 1.85rem;
    }

    .store-home-copy h2 {
        font-size: 1.1rem;
    }

    .store-home-categories,
    .store-home-product-grid {
        grid-template-columns: 1fr;
    }

    .store-home-category {
        min-height: 220px;
    }

    .store-section-title h2,
    .storefront-results-head h1,
    .store-detail-summary h1 {
        font-size: 1.55rem;
    }

    .store-home-wide-photo {
        height: 260px;
    }

    .store-account-head,
    .store-account-documents article,
    .store-account-shipments article {
        grid-template-columns: 1fr;
    }

    .store-account-head {
        align-items: stretch;
        flex-direction: column;
        padding: 20px;
    }

    .store-account-head h1,
    .store-account-empty h1 {
        font-size: 1.65rem;
    }

    .store-account-contact,
    .store-account-documents article > div:last-child {
        text-align: left;
    }

    .store-account-form {
        grid-template-columns: 1fr;
    }

    .store-state-chip {
        margin-left: 0;
    }

    .store-account-kpis {
        grid-template-columns: 1fr;
    }
}

html,
body {
    font-family: var(--sams-font-commerce) !important;
}
