:root {
    --fruport-blue: #182f78;
    --fruport-green: #1f9a49;
    --portal-bg: #f5f7fb;
    --portal-border: #e6e8ef;
    --portal-muted: #64748b;
}

html, body {
    background-color: var(--portal-bg);
    min-height: 100%;
}

body {
    color: #1f2937;
}

.portal-header {
    background: #fff;
    border-bottom: 1px solid var(--portal-border);
}

.portal-header-inner {
    min-height: 88px;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.portal-brand {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    text-decoration: none;
    white-space: nowrap;
}

.portal-logo {
    height: 42px;
    width: auto;
    display: block;
}

.portal-logo-clients {
    height: 68px;
    width: auto;
    max-width: 250px;
    object-fit: contain;
}

.brand-text {
    color: var(--fruport-blue);
    font-weight: 700;
    font-size: 1.1rem;
}

.portal-context-form {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-left: auto;
}

.portal-context-form label {
    color: var(--portal-muted);
    font-size: .82rem;
    white-space: nowrap;
}

.portal-context-form select {
    min-width: 310px;
}

.portal-nav {
    display: flex;
    align-items: center;
    gap: .15rem;
}

.portal-nav a {
    color: #334155;
    font-weight: 600;
    text-decoration: none;
    padding: .55rem .65rem;
    border-radius: .5rem;
}

.portal-nav a:hover,
.portal-nav a:focus {
    color: var(--fruport-blue);
    background: #f1f5f9;
}

.portal-nav a.is-active,
.portal-nav a.is-active:hover,
.portal-nav a.is-active:focus {
    color: #fff;
    background: var(--fruport-blue);
}

.portal-main {
    min-height: calc(100vh - 140px);
}

/* Keep both units visible; the selected unit takes the first, prominent line. */
.stock-quantity { display:flex; flex-direction:column; gap:.15rem; line-height:1.3; white-space:nowrap; }
.stock-quantity-pallets { order:0; font-size:inherit; font-weight:inherit; color:inherit; }
.stock-quantity-boxes { order:1; font-size:.8rem; font-weight:400; color:var(--portal-muted); }
.stock-quantity.is-boxes .stock-quantity-boxes { order:0; font-size:inherit; font-weight:inherit; color:inherit; }
.stock-quantity.is-boxes .stock-quantity-pallets { order:1; font-size:.8rem; font-weight:400; color:var(--portal-muted); }
.stat-value .stock-quantity { gap:.25rem; }
.stat-value .stock-quantity-boxes, .stat-value .stock-quantity.is-boxes .stock-quantity-pallets { font-size:.9rem; }
.stat-value .stock-quantity.is-boxes .stock-quantity-boxes { font-size:inherit; }

.portal-footer {
    border-top: 1px solid var(--portal-border);
    color: var(--portal-muted);
    background: #fff;
}

.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.page-title {
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--fruport-blue);
    margin-bottom: .25rem;
}

.page-subtitle {
    color: var(--portal-muted);
}

.btn-brand {
    background-color: var(--fruport-blue);
    border-color: var(--fruport-blue);
    color: #fff;
}

.btn-brand:hover,
.btn-brand:focus {
    background-color: #13265f;
    border-color: #13265f;
    color: #fff;
}

.stat-card {
    border: 0;
    box-shadow: 0 .125rem .5rem rgba(15, 23, 42, .06);
}

.stat-label {
    color: var(--portal-muted);
    font-size: .9rem;
    margin-bottom: .35rem;
}

.stat-value {
    color: var(--fruport-blue);
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.1;
}

.card {
    border-radius: .9rem;
}

.table thead th {
    white-space: nowrap;
}

.table-responsive {
    border-bottom-left-radius: .9rem;
    border-bottom-right-radius: .9rem;
}

.debug-filters {
    background: #fff;
    border: 1px solid var(--portal-border);
    border-radius: .75rem;
    padding: .75rem 1rem;
}

.debug-filters summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--fruport-blue);
}

.home-card {
    display: block;
    height: 100%;
    padding: 1.4rem;
    background: #fff;
    border: 1px solid var(--portal-border);
    border-radius: .9rem;
    text-decoration: none;
    box-shadow: 0 .125rem .5rem rgba(15, 23, 42, .05);
}

.home-card:hover {
    border-color: #cbd5e1;
    transform: translateY(-1px);
}

.home-card-title {
    color: var(--fruport-blue);
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: .35rem;
}

.home-card-text {
    color: var(--portal-muted);
}

@media (max-width: 1199px) {
    .portal-header-inner {
        padding-top: .75rem;
        padding-bottom: .75rem;
    }

    .portal-context-form {
        order: 3;
        width: 100%;
        margin-left: 0;
    }

    .portal-context-form select {
        flex: 1;
        min-width: 0;
    }

    .portal-nav {
        margin-left: auto;
    }
}

@media (max-width: 700px) {
    .portal-logo { height: 36px; }
    .portal-logo-clients { height: 54px; max-width: 205px; }
    .portal-nav { width: 100%; overflow-x: auto; }
    .portal-context-form { align-items: stretch; flex-direction: column; }
    .page-title { font-size: 1.55rem; }
    .stat-value { font-size: 1.6rem; }
}


/* Forecast: selector de unidad claramente visible */
#unitPallets,
#unitBoxes {
    background: #ffffff;
    border: 1px solid #aeb7c6;
    color: #4b5563;
    font-weight: 700;
    transition:
        background-color .15s ease,
        border-color .15s ease,
        color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

#unitPallets:hover,
#unitBoxes:hover {
    border-color: var(--fruport-blue);
    color: var(--fruport-blue);
}

#unitPallets.is-selected,
#unitBoxes.is-selected {
    background: var(--fruport-blue) !important;
    border-color: var(--fruport-blue) !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 .18rem rgba(24, 47, 120, .14);
}

#unitPallets.is-selected:hover,
#unitBoxes.is-selected:hover {
    background: #13265f !important;
    border-color: #13265f !important;
    color: #ffffff !important;
}

.vessel-toggle {
    min-width: 38px;
    min-height: 38px;
    font-size: 1rem;
    font-weight: 700;
}

.vessel-toggle.is-open {
    color: #ffffff;
    background: var(--fruport-blue);
    border-color: var(--fruport-blue);
}


/* Forecast V8: feedback sutil de selección y cantidad modificada */
.forecast-row {
    transition:
        background-color .15s ease,
        box-shadow .15s ease;
}

.forecast-row.is-selected-row > td {
    background-color: rgba(24, 47, 120, .055);
}

.forecast-row.is-selected-row > td:first-child {
    box-shadow: inset 3px 0 0 var(--fruport-blue);
}

.forecast-row.is-adjusted-row > td {
    background-image:
        linear-gradient(
            rgba(31, 154, 73, .025),
            rgba(31, 154, 73, .025)
        );
}

.assign-qty.is-adjusted-input {
    border-color: rgba(31, 154, 73, .72);
    background-color: rgba(31, 154, 73, .055);
    box-shadow: 0 0 0 .12rem rgba(31, 154, 73, .08);
    font-weight: 600;
}

.forecast-row.is-selected-row .assign-qty.is-adjusted-input {
    border-color: var(--fruport-green);
}


/* Forecast V9: botón Crear asignación */
#createAssignmentButton:not(:disabled) {
    box-shadow: 0 4px 12px rgba(24, 47, 120, .16);
}

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

.assign-qty {
    text-align: right;
}

/* Compact shipment board */
.shipments-board { border-radius:16px; background:#f7f9fc; }
.shipment-column-head { font-size:.7rem; text-transform:uppercase; letter-spacing:.045em; color:#6b7888; padding:0 30px 8px 14px; }
.shipment-grid { display:grid; grid-template-columns:minmax(190px,2.2fr) minmax(90px,1fr) 100px minmax(85px,.8fr) minmax(85px,.8fr) 65px minmax(90px,1fr); gap:12px; align-items:center; }
.shipment-card { background:white; border:1px solid #e3e9ef; border-radius:10px; margin-bottom:7px; overflow:hidden; }
.shipment-card > summary { cursor:pointer; position:relative; list-style:none; padding:11px 30px 11px 14px; font-size:.82rem; min-height:58px; }
.shipment-card > summary::-webkit-details-marker { display:none; }
.shipment-card > summary::after { content:'⌄'; position:absolute; right:12px; color:#708399; }
.shipment-card[open] > summary { background:#edf5f8; border-bottom:1px solid #e3e9ef; }
.shipment-card[open] > summary::after { content:'⌃'; }
.shipment-grid > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shipment-destination strong { display:block; overflow:hidden; text-overflow:ellipsis; }
.shipment-number { display:block; font-size:.67rem; color:#6b7888; margin-bottom:2px; }
.shipment-pallets { font-weight:700; color:#15586b; }
.shipment-status { font-size:.7rem; padding:4px 7px; border-radius:5px; background:#edf2f7; color:#46596d; }
.shipment-expanded { padding:14px; }
.shipment-order-lines th { font-size:.72rem; color:#6b7888; font-weight:600; }
.shipment-order-lines td { font-size:.8rem; }
.shipment-edit > summary { font-size:.8rem; color:#15586b; cursor:pointer; }
.shipment-prototype-note { font-size:.8rem; color:#627387; padding:10px 14px; border-left:3px solid #72a3b4; background:#f1f6f8; border-radius:6px; }
#shipmentEditor { border-radius:16px; border-top:3px solid #287d91 !important; }
@media(max-width:1100px) { .shipment-column-head { display:none; } .shipment-grid { grid-template-columns:2fr 1fr 1fr; gap:8px 16px; } .shipment-grid > span::before { content:attr(data-label); display:block; font-size:.62rem; text-transform:uppercase; color:#6b7888; margin-bottom:2px; } .shipment-card > summary { padding:12px 28px 12px 12px; } }
@media(max-width:600px) { .shipment-grid { grid-template-columns:1fr 1fr; } .shipment-destination { grid-column:1 / -1; } }

.stock-picker { width:min(1100px,96vw); max-height:85vh; border:0; border-radius:14px; padding:0; box-shadow:0 20px 70px #132a4055; }
.stock-picker::backdrop { background:#142a4055; }
.stock-picker-header { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid #e2e8ef; }
.stock-picker-header h2 { font-size:1.1rem; margin:0; }
.stock-picker-tools { display:flex; gap:12px; padding:12px 20px; }
.stock-picker-tools select { max-width:170px; }
.stock-picker-results { max-height:60vh; overflow:auto; padding:0 20px 16px; }
.stock-picker-results thead { position:sticky; top:0; background:white; }
.stock-picker-results th { font-size:.75rem; color:#64758a; white-space:nowrap; }
.stock-picker-results td { font-size:.82rem; }
.stock-product-button { min-height:38px; font-size:.85rem; overflow:hidden; text-overflow:ellipsis; }
@media(max-width:600px) { .stock-picker-tools { flex-direction:column; } .stock-picker-tools select { max-width:none; } }

.dock-planning{border:1px solid #e1e6ee;border-radius:12px;padding:14px;background:#fafbfd}.dock-slot-row{display:flex;gap:6px;align-items:center;min-width:700px;margin-bottom:8px}.dock-slots{overflow-x:auto}.dock-slot-label{width:60px;flex-shrink:0;font-size:.8rem}.dock-slot{flex:1;border:1px solid #dce2e9;border-radius:8px;background:white;padding:7px 5px;font-size:.85rem;color:#253650}.dock-slot small{display:block;font-size:.7rem}.dock-orange{background:#fff0d9;border-color:#edb560;color:#77470a}.dock-red{background:#fbe0e2;border-color:#da858d;color:#902e37}.dock-slot.selected{outline:2px solid #1c3074;outline-offset:1px}

.shipment-vessels{display:block;font-size:.73rem;color:#536883;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}

.shipment-time-dialog{width:min(420px,94vw);border:0;border-radius:16px;padding:24px;box-shadow:0 16px 70px #132a4055;overflow:visible}.shipment-time-dialog::backdrop{background:#142a4055}.shipment-hour-select{position:relative}.shipment-hour-options{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:2;max-height:320px;overflow-y:auto;background:white;border:1px solid #dae1eb;border-radius:10px;padding:5px;box-shadow:0 8px 24px #142a4026}.shipment-hour-option{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:7px;padding:10px 12px;background:#fff;text-align:left;color:#20365a;margin-bottom:3px}.shipment-hour-option small{font-size:.75rem;font-weight:400}.shipment-hour-option:hover,.shipment-hour-option:focus-visible{outline:2px solid #233879;outline-offset:-2px}.shipment-hour-medium{background-color:#fff0d9;color:#77470a}.shipment-hour-busy{background-color:#fbe0e2;color:#902e37}.shipment-hour-unknown{background-color:#f0f2f5;color:#626c7b}.shipment-hour-option[aria-selected=true]{outline:2px solid #233879;outline-offset:-2px}
.portal-client-preview #newShipment, .portal-client-preview #createAssignmentButton, .portal-client-preview .shipment-edit-button, .portal-client-preview .assignment-document form { display:none !important; }
