:root {
    --sb-w: 52px;       /* ancho colapsado */
    --sb-w-open: 220px; /* ancho expandido */
    --sb-bg: #1a2635;
    --sb-accent: #2a9d8f;
    --sb-text: #cdd9e5;
    --sb-hover: rgba(255,255,255,0.08);
    --sb-transition: 0.22s ease;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body, html {
    height: 100%;
    font-family: 'Segoe UI', Arial, sans-serif;
}

#map {
    width: 100%;
    height: 100vh;
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
#sidebar {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: var(--sb-w);
    background: var(--sb-bg);
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    transition: width var(--sb-transition);
    box-shadow: 2px 0 12px rgba(0,0,0,0.3);
}

body.sb-open #sidebar {
    width: var(--sb-w-open);
}

/* Toggle button */
#sidebar-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--sb-w);
    min-width: var(--sb-w);
    height: 52px;
    background: none;
    border: none;
    color: var(--sb-text);
    cursor: pointer;
    flex-shrink: 0;
}
#sidebar-toggle:hover { background: var(--sb-hover); }
#sidebar-toggle svg { width: 20px; height: 20px; }

/* Items */
.sb-item {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 0;
    color: var(--sb-text);
    text-decoration: none;
    cursor: default;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    background: none;
    border: none;
    text-align: left;
    font-size: 13px;
    font-family: inherit;
}
.sb-action { cursor: pointer; }
.sb-action:hover { background: var(--sb-hover); color: #fff; }
.sb-action:disabled { opacity: 0.35; cursor: not-allowed; pointer-events: none; }

.sb-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--sb-w);
    min-width: var(--sb-w);
    flex-shrink: 0;
}
.sb-icon svg { width: 18px; height: 18px; }

.sb-label {
    opacity: 0;
    transition: opacity var(--sb-transition);
    font-size: 13px;
    font-weight: 500;
    padding-right: 12px;
}
body.sb-open .sb-label { opacity: 1; }

/* User item */
#sb-user-item { color: #8fa8bf; font-size: 12px; }
#sb-user-name { font-size: 12px; overflow: hidden; text-overflow: ellipsis; }

/* Active nav item */
.sb-item.sb-active {
    background: var(--sb-hover);
    border-left: 3px solid var(--sb-accent);
}
.sb-item.sb-active .sb-icon { color: var(--sb-accent); }

/* Divider */
.sb-divider {
    height: 1px;
    background: rgba(255,255,255,0.08);
    margin: 4px 0;
    flex-shrink: 0;
}

/* Empresa name */
#sb-empresa {
    display: flex;
    align-items: center;
    height: 32px;
    flex-shrink: 0;
    overflow: hidden;
}
.sb-empresa-icon {
    width: var(--sb-w);
    min-width: var(--sb-w);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.35);
    font-size: 10px;
    flex-shrink: 0;
}
.sb-empresa-nombre {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255,255,255,0.75);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0;
    transition: opacity var(--sb-transition);
}
body.sb-open .sb-empresa-nombre { opacity: 1; }

/* Language selector */
#sb-lang {
    display: flex;
    align-items: center;
    height: 36px;
    flex-shrink: 0;
    overflow: hidden;
}
.sb-lang-icon {
    width: var(--sb-w);
    min-width: var(--sb-w);
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(255,255,255,0.45);
    flex-shrink: 0;
}
.sb-lang-icon svg { width: 15px; height: 15px; }
.sb-lang-btns {
    display: flex;
    gap: 5px;
    opacity: 0;
    transition: opacity var(--sb-transition);
    white-space: nowrap;
}
body.sb-open .sb-lang-btns { opacity: 1; }
.sb-lang-btn {
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 3px;
    background: transparent;
    color: rgba(255,255,255,0.45);
    cursor: pointer;
    transition: all 0.15s;
    font-family: inherit;
}
.sb-lang-btn.active {
    background: rgba(255,255,255,0.15);
    color: #fff;
    border-color: rgba(255,255,255,0.45);
}
.sb-lang-btn:hover:not(.active) {
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.8);
}

/* Backdrop (mobile only) */
#sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1090;
}

/* Panels shift when sidebar expands */
body.sb-open #assets-panel {
    left: var(--sb-w-open);
}

/* Search shifts with sidebar */
#search-container {
    transition: left var(--sb-transition), width var(--sb-transition);
}

/* Mobile */
@media (max-width: 640px) {
    :root { --sb-w: 0px; }

    body.sb-open #sidebar-backdrop { display: block; }

    #sidebar-toggle {
        position: fixed;
        top: 8px;
        left: 8px;
        width: 40px;
        height: 40px;
        background: var(--sb-bg);
        border-radius: 8px;
        z-index: 1200;
        box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    }

    body.sb-open #sidebar { width: var(--sb-w-open); }

    #assets-panel, #results-panel { left: 12px; }
    body.sb-open #assets-panel,
    body.sb-open #results-panel { left: 12px; }

    #kml-import-form {
        left: 12px;
        top: auto;
        bottom: 12px;
        width: calc(100vw - 24px);
        max-height: 50vh;
    }
    body.sb-open #kml-import-form { left: 12px; }
}

/* --- Buscador --- */
#search-container {
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    width: 420px;
}

#search-input {
    width: 100%;
    padding: 10px 18px;
    border-radius: 24px;
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    font-size: 14px;
    outline: none;
    background: white;
}

#search-input::placeholder {
    color: #aaa;
}

/* --- Toolbar --- */
#toolbar {
    position: absolute;
    bottom: 36px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    gap: 10px;
}

.btn {
    padding: 10px 22px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    transition: opacity 0.2s, transform 0.1s;
    white-space: nowrap;
}

.btn:not(:disabled):hover {
    opacity: 0.88;
    transform: translateY(-1px);
}

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

.btn-primary  { background: #1a73e8; color: white; }
.btn-secondary { background: #ffffff; color: #333; }
.btn-success  { background: #34a853; color: white; }

/* --- Selector de basemap --- */
#basemap-switcher {
    position: fixed;
    top: 62px;
    right: 10px;
    z-index: 1000;
    background: white;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.bm-btn {
    padding: 7px 16px;
    border: none;
    border-bottom: 1px solid #eee;
    background: white;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    color: #444;
    text-align: left;
    font-family: inherit;
    transition: background 0.15s;
}

.bm-btn:last-child { border-bottom: none; }
.bm-btn:hover { background: #f0f4f8; }
.bm-btn.active {
    background: #1a2635;
    color: #fff;
}

#bm-esri-meta {
    padding: 6px 10px 7px;
    background: #f7f9fc;
    border-top: 1px solid #e0e6ed;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.bm-meta-prov {
    font-size: 10px;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.bm-meta-date {
    font-size: 11px;
    color: #333;
    font-weight: 500;
}

/* --- Panel de resultados --- */
#results-panel {
    position: absolute;
    top: 70px;
    right: 16px;
    z-index: 1060;
    background: white;
    border-radius: 12px;
    padding: 18px;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.25);
    min-width: 250px;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

#results-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

#results-panel-header h3 {
    margin-bottom: 0;
}

#results-panel h3 {
    font-size: 14px;
    font-weight: 700;
    color: #333;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#total-ha {
    font-size: 22px;
    font-weight: 700;
    color: #1a73e8;
    margin-bottom: 14px;
}

#results-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

#results-table th {
    text-align: left;
    padding: 6px 8px;
    border-bottom: 2px solid #eee;
    color: #777;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
}

#results-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #f2f2f2;
    vertical-align: middle;
}

#results-table tr:last-child td {
    border-bottom: none;
}

.color-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    margin-right: 7px;
    vertical-align: middle;
    border: 1px solid rgba(0,0,0,0.1);
}

/* --- Loading overlay --- */
#loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.55);
    z-index: 100;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
}

#loading p {
    margin-top: 18px;
    font-size: 16px;
    font-weight: 500;
}

.spinner {
    width: 52px;
    height: 52px;
    border: 5px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

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

/* --- Datos complementarios --- */
#complementario {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid #eee;
}

#complementario h3 {
    font-size: 14px;
    font-weight: 700;
    color: #333;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.comp-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    font-size: 13px;
    border-bottom: 1px solid #f2f2f2;
}

.comp-row:last-child {
    border-bottom: none;
}

.comp-label {
    color: #777;
    flex: 1;
}

.comp-value {
    font-weight: 600;
    color: #333;
    text-align: right;
}

/* --- Botones GEE --- */
.btn-gee  { background: #7b2d8b; color: white; }

/* --- Filtro de nubes en popup satélite --- */
.btn-cloud-filter {
    background: transparent;
    border: 1px solid #aaa;
    border-radius: 4px;
    padding: 2px 6px;
    cursor: pointer;
    color: #666;
    display: flex;
    align-items: center;
    width: 26px;
    height: 22px;
}
.btn-cloud-filter svg { width: 14px; height: 14px; }
.btn-cloud-filter:hover { border-color: #555; color: #333; }
.btn-cloud-filter.active { background: #1a6fc4; border-color: #1a6fc4; color: white; }

/* --- Overlay de info GEE sobre el mapa --- */
.gee-map-card {
    position: fixed;
    background: white;
    border-radius: 8px;
    padding: 10px 12px;
    box-shadow: 0 2px 14px rgba(0,0,0,0.22);
    min-width: 155px;
    max-width: 195px;
    font-size: 12px;
    pointer-events: auto;
    transform: translateY(-50%);
    z-index: 200;
}
.gee-map-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 7px;
}
.gee-map-card-title {
    font-weight: 700;
    font-size: 12px;
    color: #333;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.gee-map-legend-bar {
    height: 8px;
    border-radius: 3px;
    margin-bottom: 3px;
    position: relative;
}
.gee-imagen-list {
    max-height: 180px;
    overflow-y: auto;
    margin-top: 4px;
}
.gee-imagen-list .rain-sat-img-row {
    padding: 3px 0;
}
.gee-legend-marker {
    position: absolute;
    top: -2px;
    width: 2px;
    height: 12px;
    background: #fff;
    border: 1px solid #333;
    border-radius: 1px;
    transform: translateX(-50%);
    z-index: 1;
}
.gee-map-legend-labels {
    display: flex;
    justify-content: space-between;
    font-size: 10px;
    color: #999;
    margin-bottom: 7px;
}
.gee-map-indicators {
    border-top: 1px solid #eee;
    padding-top: 6px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.gee-map-ind-row {
    display: flex;
    justify-content: space-between;
    color: #666;
}
.gee-map-ind-value { font-weight: 700; color: #222; }

.btn-sm {
    padding: 6px 14px;
    font-size: 13px;
}

/* --- Panel de lluvias --- */
#rain-panel {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 20;
    background: white;
    border-top: 1px solid #ddd;
    box-shadow: 0 -4px 16px rgba(0,0,0,0.15);
    display: flex;
    flex-direction: column;
    height: 300px;
}

#rain-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px 8px calc(var(--sb-w) + 10px);
    border-bottom: 1px solid #eee;
    flex-shrink: 0;
    transition: padding-left var(--sb-transition);
}
body.sb-open #rain-panel-header {
    padding-left: calc(var(--sb-w-open) + 10px);
}

#rain-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #555;
}
.btn-rain-nav {
    background: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 22px;
    height: 26px;
    font-size: 16px;
    cursor: pointer;
    color: #555;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    line-height: 1;
}
.btn-rain-nav:hover { background: #f0f5ff; border-color: #4a90d9; color: #2c7be5; }
#rain-periodo {
    font-size: 12px;
    padding: 3px 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #444;
    max-width: 130px;
}

#rain-controls label {
    display: flex;
    align-items: center;
    gap: 6px;
}

#rain-controls input[type="date"],
#rain-controls input[type="number"] {
    padding: 4px 6px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 13px;
}
#tolerancia-km { width: 68px; }

.rain-points-toggle {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.btn-close {
    background: none;
    border: none;
    font-size: 16px;
    color: #999;
    cursor: pointer;
    padding: 4px 8px;
    line-height: 1;
}

.btn-close:hover { color: #333; }

#rain-chart-container {
    flex: 1;
    padding: 6px 16px 10px;
    min-height: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: auto;
    position: relative;
}
#rain-chart-container::-webkit-scrollbar { height: 6px; }
#rain-chart-container::-webkit-scrollbar-track { background: #f0f4f8; }
#rain-chart-container::-webkit-scrollbar-thumb { background: #b0c8e8; border-radius: 4px; }

#rain-body {
    display: flex;
    flex: 1;
    min-height: 0;
}


#rain-chart-inner {
    display: flex;
    flex-direction: column;
}

#rain-monthly-sidebar {
    width: 205px;
    flex-shrink: 0;
    border-left: 1px solid #e8ecf0;
    padding: 6px 10px 8px;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    font-size: 11px;
    color: #445;
    background: #fafbfc;
}
.rain-m-title {
    font-size: 10px;
    font-weight: 600;
    color: #7a8fa6;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 5px;
    flex-shrink: 0;
}
.rain-m-row {
    margin-bottom: 3px;
}
.rain-m-top {
    display: flex;
    align-items: center;
    gap: 3px;
}
.rain-m-label {
    width: 22px;
    color: #7a8fa6;
    font-size: 10px;
    flex-shrink: 0;
}
.rain-m-bar-wrap {
    flex: 1;
    height: 7px;
    background: #dde5ee;
    border-radius: 2px;
    overflow: hidden;
}
.rain-m-bar {
    height: 100%;
    background: #4a90d9;
    border-radius: 2px;
}
.rain-m-val {
    width: 26px;
    text-align: right;
    font-size: 10px;
    color: #334;
    flex-shrink: 0;
}
.rain-m-temps {
    font-size: 9px;
    padding-left: 25px;
    margin-top: 1px;
    line-height: 1.3;
    white-space: nowrap;
}
.rain-m-tmin  { color: #4a90d9; }
.rain-m-tmean { color: #e68a2e; }
.rain-m-tmax  { color: #d9534f; }
.rain-m-stats {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid #e0e8f0;
    flex-shrink: 0;
}
.rain-m-stat {
    font-size: 10px;
    color: #556;
    margin-bottom: 2px;
    line-height: 1.4;
}
.rain-m-stat b { color: #223; }

#rain-sat-strip {
    position: relative;
    height: 22px;
    flex-shrink: 0;
}

.rain-sat-btn {
    position: absolute;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 19px;
    padding: 0;
    line-height: 1;
    opacity: 0.45;
    transform: translateX(-50%);
    top: 3px;
    transition: opacity 0.15s;
}
.rain-sat-btn:hover, .rain-sat-btn.active { opacity: 1; }
.rain-sat-btn.sat-image-active { opacity: 1; filter: drop-shadow(0 0 3px #2c7be5); }

#rain-chart { display: block; }

/* ── Popup Sentinel por semana ───────────────────────────────────────────── */
#rain-sat-popup {
    position: fixed;
    z-index: 35;
    background: white;
    border: 1px solid #dde3f0;
    border-radius: 10px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.18);
    width: 290px;
}
#rain-sat-popup-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px 6px;
    border-bottom: 1px solid #eef0f6;
    font-size: 12px;
    font-weight: 600;
    color: #37474f;
}
#rain-sat-popup-body {
    padding: 10px 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.rain-sat-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
}
.rain-sat-row label { color: #546e7a; white-space: nowrap; }
.rain-sat-row select { flex: 1; font-size: 12px; padding: 3px 6px; border: 1px solid #cdd7e0; border-radius: 4px; }
#rain-sat-images-list {
    max-height: 180px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 12px;
}
.rain-sat-img-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    border-radius: 5px;
    cursor: pointer;
}
.rain-sat-img-row:hover { background: #f0f5ff; }
.rain-sat-img-row small { color: #78909c; }
.rain-sat-loading, .rain-sat-noimages { color: #90a4ae; font-size: 12px; padding: 6px 0; text-align: center; }

/* --- Panel GEE --- */
#gee-panel {
    position: absolute;
    top: 70px;
    right: 16px;
    z-index: 1060;
    background: white;
    border-radius: 12px;
    padding: 0;
    box-shadow: 0 2px 16px rgba(0,0,0,0.25);
    width: 300px;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

#gee-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #7b2d8b;
    color: white;
}

#gee-panel-title {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#gee-controls {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.gee-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.gee-row-input {
    display: flex;
    gap: 6px;
    align-items: center;
}
.gee-row-input select {
    flex: 1;
    min-width: 0;
    width: auto;
}

.gee-row label {
    font-size: 11px;
    color: #777;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.4px;
}

.gee-row select,
.gee-row input[type="date"] {
    padding: 6px 8px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    width: 100%;
}

#gee-result {
    padding: 0 16px 14px;
    border-top: 1px solid #eee;
}

#gee-fecha-imagen {
    font-size: 11px;
    color: #999;
    padding: 8px 0 6px;
}

#gee-indicadores {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.gee-ind-row {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 4px 0;
    border-bottom: 1px solid #f2f2f2;
}

.gee-ind-row:last-child { border-bottom: none; }

.gee-ind-label { color: #777; }
.gee-ind-value { font-weight: 700; color: #333; }

#gee-imagenes-lista select {
    font-size: 12px;
}

.btn-product-info {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #bbb;
    border-radius: 50%;
    background: transparent;
    color: #888;
    font-size: 11px;
    font-style: italic;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}
.btn-product-info:hover {
    border-color: #555;
    color: #333;
}

.product-tooltip {
    position: fixed;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 10px 13px;
    font-size: 12px;
    color: #444;
    line-height: 1.55;
    max-width: 250px;
    z-index: 9999;
    box-shadow: 0 4px 14px rgba(0,0,0,0.15);
    pointer-events: none;
}

#gee-leyenda {
    padding: 0 16px 14px;
}

#gee-leyenda-bar {
    height: 10px;
    border-radius: 4px;
    margin-bottom: 4px;
}
#gee-leyenda-bar.sar-swatches,
.gee-map-legend-bar.sar-swatches {
    height: auto;
    background: none !important;
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 6px;
}
.gee-swatch-row {
    display: flex;
    align-items: center;
    gap: 7px;
}
.gee-swatch-dot {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 1px solid rgba(0,0,0,0.2);
}
.gee-swatch-label {
    font-size: 11px;
    color: #555;
}

#gee-leyenda-labels {
    display: flex;
    justify-content: space-between;
    font-size: 10px;
    color: #999;
}

/* --- Utils --- */
.hidden {
    display: none !important;
}


.btn-logout:hover { background: #c62828; }

/* --- Assets panel --- */
.btn-assets {
    background: #1565C0;
    color: white;
}
.btn-assets:hover { background: #0d47a1; }

#assets-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 0px);
    transition: left var(--sb-transition);
    width: 300px;
    height: 100vh;
    background: white;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1050;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#assets-panel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px 10px 8px;
    background: #1565C0;
    color: white;
    font-weight: 600;
    font-size: 14px;
    flex-shrink: 0;
}

#assets-panel-title {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Chevron de colapso del panel */
#btn-assets-collapse {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    padding: 2px;
    display: flex;
    align-items: center;
    opacity: 0.85;
    flex-shrink: 0;
}
#btn-assets-collapse:hover { opacity: 1; }
#btn-assets-collapse svg { width: 18px; height: 18px; transition: transform 0.2s; }
#assets-panel.panel-collapsed #btn-assets-collapse svg { transform: rotate(-90deg); }

/* Cuerpo colapsable del panel */
#assets-panel.panel-collapsed { height: auto; }
#assets-panel.panel-collapsed #assets-panel-body { display: none; }

#assets-panel-body {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

#assets-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
    min-height: 0;
}

/* Ocultar lista mientras se dibuja */
#assets-panel.drawing-mode #assets-list,
#assets-panel.drawing-mode #assets-search-bar { display: none !important; }

/* Barra de búsqueda */
#assets-search-bar {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 8px 10px;
    padding: 3px 10px;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    background: #fff;
    flex-shrink: 0;
}
#assets-search-bar svg {
    width: 13px;
    height: 13px;
    stroke: #90a4ae;
    flex-shrink: 0;
}
#assets-search-input {
    border: none;
    outline: none;
    font-size: 11px;
    color: #37474f;
    background: transparent;
    width: 100%;
}
#assets-search-input::placeholder { color: #b0bec5; }

/* Grupo "Sin campo asignado" colapsable */
.sueltos-group-header {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px 5px 10px;
    background: #f5f7fa;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #888;
    cursor: pointer;
    user-select: none;
}
.sueltos-group-header:hover { background: #edf0f5; }
.sueltos-toggle { background: none; border: none; color: #aaa; cursor: pointer; padding: 0; display: flex; }
.sueltos-toggle svg { width: 16px; height: 16px; transition: transform 0.2s; }
.sueltos-group.lotes-collapsed .sueltos-toggle svg { transform: rotate(-90deg); }
.sueltos-group.lotes-collapsed .sueltos-lotes { display: none; }

.asset-item {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    gap: 8px;
}
.asset-item:hover,
.asset-item.map-hovered { background: #cfe2ff; }

.asset-item-icon {
    font-size: 16px;
    flex-shrink: 0;
}

.asset-item-info {
    flex: 1;
    min-width: 0;
}

.asset-item-nombre {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.asset-item-sub {
    font-size: 11px;
    color: #888;
}

.asset-item-del,
.asset-item-edit,
.asset-item-save,
.asset-item-cancel {
    background: none;
    border: none;
    color: #ccc;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 4px;
    flex-shrink: 0;
    line-height: 1;
}
.asset-item-del:hover,
.asset-item-cancel:hover { color: #e53935; }
.asset-item-edit:hover   { color: #1565C0; }
.asset-item-save:hover   { color: #2e7d32; }
.asset-nivel-select {
    padding: 2px 4px; font-size: 10px; border: 1px solid #ddd;
    border-radius: 3px; background: #fff; color: #546e7a;
    flex-shrink: 0; cursor: pointer;
}
.asset-nivel-select:hover { border-color: #90a4ae; }

.asset-edit-form {
    flex: 1; min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 0;
    overflow: hidden;
}
.asset-edit-field {
    display: flex;
    align-items: center;
    gap: 6px;
}
.asset-edit-field label {
    font-size: 10px;
    color: #78909c;
    width: 70px;
    flex-shrink: 0;
    text-align: right;
}
.asset-edit-field input,
.asset-edit-field select {
    flex: 1;
    min-width: 0;
    font-size: 12px;
    padding: 3px 6px;
    border: 1px solid #cfd8dc;
    border-radius: 4px;
    background: #fff;
    color: #263238;
}
.asset-edit-actions {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    margin-top: 2px;
}
.asset-nombre-input {
    font-size: 13px;
    font-weight: 600;
    border: none;
    border-bottom: 1.5px solid #1565C0;
    outline: none;
    background: transparent;
    color: #333;
    width: 100%;
    padding: 0;
}

.asset-campo-select {
    font-size: 11px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 1px 4px;
    color: #555;
    background: #fff;
    width: 100%;
    margin-top: 2px;
}

.asset-error-msg {
    background: #fdecea;
    color: #c62828;
    font-size: 12px;
    padding: 6px 12px;
    border-left: 3px solid #e53935;
    margin: 4px 8px 0;
    border-radius: 0 4px 4px 0;
    display: none;
}

#assets-save-form {
    padding: 12px 16px;
    border-top: 1px solid #eee;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#asset-nombre {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 13px;
    outline: none;
}
#asset-nombre:focus { border-color: #1565C0; }

#asset-tipo, #asset-campo-id {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 13px;
    background: white;
}

/* --- Draw menu (assets panel) --- */
#assets-header-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

#draw-menu-wrapper {
    position: relative;
}

#btn-draw-menu {
    background: rgba(255,255,255,0.25);
    border: none;
    color: white;
    font-size: 20px;
    line-height: 1;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
#btn-draw-menu:hover { background: rgba(255,255,255,0.4); }

#btn-assets-close {
    background: none;
    border: none;
    color: rgba(255,255,255,0.55);
    font-size: 14px;
    line-height: 1;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
#btn-assets-close:hover { background: rgba(255,255,255,0.15); color: white; }

#draw-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    min-width: 180px;
    z-index: 2000;
    overflow: hidden;
}

.draw-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 14px;
    background: none;
    border: none;
    font-size: 13px;
    color: #333;
    cursor: pointer;
    text-align: left;
}
.draw-menu-item:hover:not(:disabled) { background: #f0f4ff; }

.draw-menu-disabled {
    color: #bbb !important;
    cursor: not-allowed !important;
}

.draw-menu-icon {
    font-size: 16px;
    width: 20px;
    text-align: center;
}

/* --- Map labels (drawing) --- */
.map-label {
    position: absolute;
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    font-size: 11px;
    font-family: sans-serif;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 10px;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    transform: translate(-50%, -50%);
}

.map-label.area-label {
    font-size: 15px;
    font-weight: 700;
    background: rgba(0, 0, 0, 0.75);
    padding: 4px 12px;
    border-radius: 14px;
}

.map-label.hover-label {
    font-size: 13px;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.88);
    color: #222;
    padding: 4px 12px;
    border-radius: 12px;
    box-shadow: 0 1px 6px rgba(0,0,0,0.25);
}

.map-label.kml-name-label {
    font-size: 11px;
    font-weight: 700;
    background: rgba(255, 111, 0, 0.85);
    color: white;
    padding: 2px 7px;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    white-space: nowrap;
    pointer-events: none;
}

/* --- Cancel draw button --- */
#btn-cancel-draw {
    background: rgba(229, 57, 53, 0.85);
    border: none;
    color: white;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 12px;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 5px;
}
#btn-cancel-draw:hover { background: rgba(198, 40, 40, 0.95); }

#btn-cancel-draw kbd {
    background: rgba(255,255,255,0.25);
    border-radius: 4px;
    padding: 1px 5px;
    font-size: 10px;
    font-family: sans-serif;
    font-weight: 700;
    letter-spacing: 0.5px;
}

/* --- Selected asset item --- */
.asset-item.active {
    background: #90bfff;
    border-left: 3px solid #1565C0;
    padding-left: 13px;
}
.asset-item.active .asset-item-nombre {
    color: #0d3c7a;
}

/* --- Campo group (árbol de lotes) --- */
.campo-toggle {
    background: none;
    border: none;
    color: #aaa;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.campo-toggle svg {
    width: 16px;
    height: 16px;
    transition: transform 0.2s;
}
.campo-toggle:hover { color: #555; }
.campo-toggle-placeholder { width: 16px; flex-shrink: 0; }

.campo-group.lotes-collapsed .campo-toggle svg { transform: rotate(-90deg); }
.campo-group.lotes-collapsed .campo-lotes { display: none; }

.campo-lotes { background: #fafafa; }

.lote-item {
    padding-left: 40px !important;
    border-left: 2px solid #e3eeff;
    background: #fafafa;
}
.lote-item:hover { background: #cfe2ff; }
.lote-item.active { border-left: 2px solid #1565C0; }

/* --- Exclusion form --- */
#exclusion-form {
    padding: 10px 12px;
    background: #fffde7;
    border-top: 1px solid #ffe082;
    border-bottom: 1px solid #ffe082;
}
.exclusion-header {
    font-size: 12px;
    font-weight: 600;
    color: #5d4037;
    margin-bottom: 8px;
}
.exclusion-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.exclusion-table th {
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #888;
    padding: 2px 6px 4px;
    border-bottom: 1px solid #ffe082;
}
.exclusion-table th:last-child { text-align: center; }
.exclusion-table td {
    padding: 4px 6px;
    border-bottom: 1px solid #fff8e1;
    color: #333;
    vertical-align: middle;
}
.exclusion-table tr:last-child td { border-bottom: none; }
.exclusion-table td:last-child { text-align: center; }

/* Separador sección lotes sueltos */
.assets-section-sep {
    padding: 6px 16px 4px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #aaa;
    background: #f5f5f5;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

/* --- Draw hint --- */
#draw-hint {
    padding: 7px 16px;
    background: #f0f4ff;
    border-bottom: 1px solid #dde8ff;
    font-size: 12px;
    color: #1565C0;
    font-weight: 500;
}

/* --- Draw menu separator --- */
.draw-menu-separator {
    height: 1px;
    background: #eee;
    margin: 4px 0;
}

/* --- KML import panel --- */
#kml-import-form {
    position: fixed;
    top: 104px;
    left: calc(var(--sb-w) + 320px);
    transition: left var(--sb-transition);
    width: 270px;
    max-height: calc(100vh - 120px);
    background: #fffde7;
    border: 1px solid #ffe082;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    z-index: 1050;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

body.sb-open #kml-import-form {
    left: calc(var(--sb-w-open) + 320px);
}

.kml-import-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px 6px;
    font-size: 12px;
    font-weight: 600;
    color: #5d4037;
}

#kml-polygon-list {
    flex: 1;
    overflow-y: auto;
    padding: 0 12px 4px;
}

.kml-poly-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-bottom: 1px solid #fff8e1;
}
.kml-poly-row:last-child { border-bottom: none; }

.kml-chk {
    flex-shrink: 0;
    cursor: pointer;
    width: 14px;
    height: 14px;
}

.kml-name {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 5px 8px;
    font-size: 12px;
    outline: none;
    width: 100%;
    background: white;
}
.kml-name:focus { border-color: #1565C0; }

.kml-campo-id-hidden { display: none; }

#kml-import-type {
    padding: 8px 12px 6px;
    border-top: 1px solid #ffe082;
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex-shrink: 0;
}

#kml-tipo-global, #kml-campo-id-global {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 5px 8px;
    font-size: 12px;
    background: white;
    width: 100%;
}

.kml-import-footer {
    padding: 8px 12px 10px;
    border-top: 1px solid #ffe082;
    flex-shrink: 0;
}


/* ═══════════════════════════════════════════════════════════════════════════
   Widget de pronóstico climático
   ══════════════════════════════════════════════════════════════════════════ */

#weather-widget {
    position: fixed;
    top: 16px;
    right: 10px;
    z-index: 1080;
}

/* ── Botón compacto ──────────────────────────────────────────────────────── */
#weather-compact {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    background: rgba(20, 30, 45, 0.82);
    color: #fff;
    border: none;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.35);
    transition: background 0.2s;
    white-space: nowrap;
}
#weather-compact:hover { background: rgba(20, 30, 45, 0.95); }
#weather-compact.w-loading { opacity: 0.65; }

#w-icon { font-size: 18px; line-height: 1; }

#w-alerts-badge {
    background: #c62828;  /* sobreescrito por JS según severidad */
    color: white;
    font-size: 10px;
    font-weight: 700;
    border-radius: 10px;
    padding: 1px 5px;
    margin-left: 2px;
    line-height: 1.4;
}

/* ── Panel expandido ─────────────────────────────────────────────────────── */
#weather-panel {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    width: 310px;
    max-height: calc(100vh - 80px);
    background: white;
    border-radius: 12px;
    box-shadow: 0 6px 28px rgba(0,0,0,0.22);
    overflow: hidden;
    font-size: 13px;
    display: flex;
    flex-direction: column;
}

#weather-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 12px 8px;
    background: #1a2635;
    color: #cdd9e5;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

/* ── Condiciones actuales ────────────────────────────────────────────────── */
#w-current {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 10px;
    background: linear-gradient(135deg, #e3f0fb 0%, #eef6ff 100%);
    border-bottom: 1px solid #d0e4f4;
    flex-shrink: 0;
}

#w-cur-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

#w-current-icon { font-size: 34px; line-height: 1; }

#w-current-temp {
    font-size: 26px;
    font-weight: 700;
    color: #1a2635;
    line-height: 1;
    display: block;
}

#w-current-desc {
    font-size: 11px;
    color: #546e7a;
    display: block;
}

#w-cur-right {
    margin-left: auto;
    font-size: 11px;
    color: #37474f;
    text-align: right;
    line-height: 1.7;
}

/* ── Pestañas ────────────────────────────────────────────────────────────── */
#w-tabs {
    display: flex;
    border-bottom: 2px solid #e8f0fe;
    background: #f8faff;
    flex-shrink: 0;
}

.w-tab {
    flex: 1;
    padding: 7px 4px;
    border: none;
    background: none;
    font-size: 11px;
    font-weight: 600;
    color: #78909c;
    cursor: pointer;
    transition: color 0.15s, border-bottom 0.15s;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
}
.w-tab:hover { color: #1565C0; }
.w-tab.active { color: #1565C0; border-bottom-color: #1565C0; }

#w-alerts-tab-count {
    background: #e53935;
    color: white;
    font-size: 9px;
    border-radius: 8px;
    padding: 0 4px;
    margin-left: 2px;
    vertical-align: middle;
}

/* ── Área de contenido de pestañas ──────────────────────────────────────── */
.w-view {
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

/* ── Pestaña Horas ───────────────────────────────────────────────────────── */
#w-hours-strip {
    display: flex;
    overflow-x: scroll;
    padding: 8px 6px 10px;
    gap: 2px;
    scrollbar-width: auto;
}
#w-hours-strip::-webkit-scrollbar { height: 6px; }
#w-hours-strip::-webkit-scrollbar-track { background: #f0f4f8; border-radius: 4px; }
#w-hours-strip::-webkit-scrollbar-thumb { background: #b0c8e8; border-radius: 4px; }

.w-hour-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 50px;
    padding: 6px 4px;
    border-radius: 8px;
    gap: 3px;
}
.w-hour-slot.w-hour-now {
    background: #e3f0fb;
    outline: 2px solid #1565C0;
}

.w-h-time {
    font-size: 10px;
    font-weight: 700;
    color: #546e7a;
    white-space: nowrap;
}
.w-hour-now .w-h-time { color: #1565C0; }
.w-h-day { font-size: 9px; color: #999; display: block; }
.w-h-icon { font-size: 18px; line-height: 1; }
.w-h-temp { font-size: 12px; font-weight: 700; color: #263238; }
.w-h-rain-mm  { font-size: 10px; color: #546e7a; height: 14px; display: flex; align-items: center; justify-content: center; }
.w-h-rain-pct { font-size: 10px; height: 13px; display: flex; align-items: center; justify-content: center; }
.w-h-wind { font-size: 9px; color: #78909c; white-space: nowrap; height: 13px; display: flex; align-items: center; justify-content: center; }

/* ── Pestaña días ────────────────────────────────────────────────────────── */
#w-days-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}
#w-days-table thead th {
    font-size: 9px;
    font-weight: 600;
    color: #90a4ae;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 4px 4px 2px;
    border-bottom: 1px solid #e0e7ef;
    white-space: nowrap;
}
.w-day-row { border-bottom: 1px solid #f0f4f8; cursor: pointer; }
.w-day-row:last-child { border-bottom: none; }
.w-day-row:hover { background: #f5f9ff; }
.w-day-row.w-day-expanded { background: #e8f0fe; }
.w-day-row td { padding: 4px 4px; vertical-align: middle; }

.w-d-label {
    font-weight: 700;
    color: #37474f;
    min-width: 38px;
    font-size: 12px;
}
.w-d-icon { font-size: 18px; text-align: center; line-height: 1; }

.w-day-detail-row td { padding: 0; overflow: hidden; width: 100%; }
.w-day-detail-strip {
    display: flex;
    overflow-x: scroll;
    padding: 6px 4px 10px;
    gap: 2px;
    background: #f0f5ff;
    border-bottom: 1px solid #c5d5f5;
    scrollbar-width: auto;
}
.w-day-detail-strip::-webkit-scrollbar { height: 6px; }
.w-day-detail-strip::-webkit-scrollbar-track { background: #dce8fb; border-radius: 4px; }
.w-day-detail-strip::-webkit-scrollbar-thumb { background: #7baee8; border-radius: 4px; }

.w-d-range { white-space: nowrap; font-size: 11px; }
.w-min { font-weight: 700; color: #1565c0; }
.w-range-sep { color: #90a4ae; }
.w-max { color: #c62828; }

.w-d-rain { font-size: 10px; color: #546e7a; text-align: right; white-space: nowrap; }
.w-prob   { color: #1976d2; font-weight: 600; }
.w-no-rain { color: #b0bec5; }

.w-d-wind { font-size: 10px; color: #37474f; white-space: nowrap; text-align: right; }
.w-wind-unit { color: #90a4ae; }

/* ── Pestaña Alertas ─────────────────────────────────────────────────────── */
#w-alerts-list {
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.w-no-alerts {
    font-size: 12px;
    color: #90a4ae;
    text-align: center;
    padding: 16px 0;
    margin: 0;
}

.w-alert-card {
    border-radius: 8px;
    padding: 8px 10px;
    background: #fffde7;
    border-left: 4px solid #f9a825;
    font-size: 12px;
}
.w-alert-card:has(.sev-orange) { background: #fff3e0; border-left-color: #e65100; }
.w-alert-card:has(.sev-red)    { background: #ffebee; border-left-color: #c62828; }
.w-alert-card:has(.sev-green)  { background: #e8f5e9; border-left-color: #2e7d32; }

.w-alert-top {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}

/* Badges de severidad */
.w-sev-badge {
    font-size: 9px;
    font-weight: 800;
    padding: 2px 6px;
    border-radius: 4px;
    letter-spacing: 0.05em;
    color: white;
}
.sev-yellow { background: #f9a825; color: #333; }
.sev-orange { background: #e65100; }
.sev-red    { background: #c62828; }
.sev-green  { background: #2e7d32; }

.w-atype-badge {
    font-size: 9px;
    font-weight: 700;
    color: #78909c;
    background: #eceff1;
    padding: 2px 6px;
    border-radius: 4px;
}

.w-alert-title-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 4px;
}
.w-alert-title    { font-weight: 700; color: #37474f; }
.w-alert-vigencia { font-size: 10px; color: #90a4ae; white-space: nowrap; }
.w-alert-desc     { font-size: 11px; color: #546e7a; margin-top: 3px; line-height: 1.5; white-space: pre-line; }
.w-alert-instr    { font-size: 11px; color: #37474f; margin-top: 4px; line-height: 1.5; font-style: italic; white-space: pre-line; }

/* ── Atribución ──────────────────────────────────────────────────────────── */
#weather-attribution {
    padding: 4px 12px 5px;
    font-size: 10px;
    color: #bbb;
    text-align: right;
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
    flex-shrink: 0;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
    #weather-widget { top: auto; bottom: 130px; right: 10px; }
    #weather-panel {
        top: auto;
        bottom: calc(100% + 6px);
        width: calc(100vw - 20px);
        max-width: 340px;
        max-height: 60vh;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Módulo Producción
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Panel principal ──────────────────────────────────────────────────────── */
#prod-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 0px);
    right: 0;
    bottom: 0;
    width: auto;
    max-height: none;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}

body.sb-open #prod-panel {
    left: var(--sb-w-open);
}

#prod-panel-header {
    display: flex;
    align-items: center;
    padding: 10px 12px 10px 14px;
    background: #f0f4f8;
    border-bottom: 1px solid #d0dae6;
    flex-shrink: 0;
    gap: 8px;
}

#prod-panel-title {
    font-size: 13px;
    font-weight: 700;
    color: #1a2635;
    flex: 1;
}

#prod-header-actions {
    display: flex;
    gap: 4px;
    align-items: center;
}

.btn-prod-add {
    background: #2a9d8f;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.btn-prod-add:hover { background: #21867a; }

/* ── Tabs ─────────────────────────────────────────────────────────────────── */
#prod-tabs {
    display: flex;
    border-bottom: 2px solid #e0e7ef;
    flex-shrink: 0;
    background: #f8fafd;
}

.prod-tab {
    flex: 1;
    padding: 8px 12px;
    border: none;
    background: none;
    font-size: 12px;
    font-weight: 600;
    color: #78909c;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color 0.15s, border-color 0.15s;
}
.prod-tab:hover { color: #37474f; }
.prod-tab.active {
    color: #2a9d8f;
    border-bottom-color: #2a9d8f;
}

/* ── Contenido de tabs ────────────────────────────────────────────────────── */
.prod-tab-content {
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    height: 0;
}

/* ── Panel vacío ──────────────────────────────────────────────────────────── */
.prod-empty {
    padding: 32px 16px;
    text-align: center;
    color: #90a4ae;
    font-size: 13px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

/* ── Catálogo de cultivos ─────────────────────────────────────────────────── */
#prod-cultivos-filter {
    padding: 8px 10px;
    border-bottom: 1px solid #e8edf3;
    flex-shrink: 0;
}

#prod-cultivos-filter select {
    width: 100%;
    padding: 5px 8px;
    border: 1px solid #cdd3da;
    border-radius: 6px;
    font-size: 12px;
    color: #37474f;
    background: #fff;
}

.prod-cultivo-group {
    padding: 0;
}

.prod-cultivo-group-title {
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #546e7a;
    background: #f4f7fa;
    border-left: 3px solid #aaa;
    border-bottom: 1px solid #e8edf3;
}

.prod-cultivo-row {
    padding: 6px 12px;
    border-bottom: 1px solid #f0f4f8;
    cursor: default;
}
.prod-cultivo-row:last-child { border-bottom: none; }
.prod-cultivo-row:hover { background: #f9fbfd; }

.prod-cultivo-nombre {
    font-size: 13px;
    font-weight: 600;
    color: #263238;
}

.prod-cultivo-meta {
    display: flex;
    gap: 10px;
    margin-top: 2px;
}

.prod-cultivo-ciclo {
    font-size: 11px;
    color: #78909c;
}

.prod-cultivo-rinde {
    font-size: 11px;
    color: #78909c;
}

.prod-cultivo-estaciones {
    display: flex;
    gap: 4px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.prod-est-badge {
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 10px;
    background: #e3f0fb;
    color: #1565c0;
    text-transform: capitalize;
}

/* ── Search inline en filtros ──────────────────────────────────────────────── */
.prod-filter-search-wrap {
    display: flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    padding: 3px 10px;
    background: #fff;
}
.prod-filter-search-wrap svg {
    width: 13px;
    height: 13px;
    stroke: #90a4ae;
    flex-shrink: 0;
}
#prod-search-input,
.prod-search-input {
    border: none;
    outline: none;
    font-size: 11px;
    color: #37474f;
    background: transparent;
    width: 110px;
}
#prod-search-input::placeholder,
.prod-search-input::placeholder { color: #b0bec5; }
#prod-search-clear {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 11px;
    color: #90a4ae;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
}
#prod-search-clear:hover { color: #546e7a; }

/* ── Paginador ──────────────────────────────────────────────────────────────── */
#prod-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 12px;
    border-top: 1px solid #f0f4f8;
}
.prod-pager-info {
    font-size: 11px;
    color: #90a4ae;
    margin-right: 6px;
}
.prod-pager-btn, .prod-pager-num {
    min-width: 28px;
    height: 28px;
    padding: 0 6px;
    border: 1px solid #dde3ea;
    border-radius: 5px;
    background: #fff;
    font-size: 12px;
    color: #546e7a;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .12s, border-color .12s;
}
.prod-pager-btn:hover:not(:disabled), .prod-pager-num:hover { background: #f0f4f8; border-color: #90a4ae; }
.prod-pager-btn:disabled { opacity: .35; cursor: default; }
.prod-pager-num.active { background: #1a73e8; border-color: #1a73e8; color: #fff; }
.prod-pager-ellipsis { font-size: 12px; color: #90a4ae; padding: 0 2px; }

/* ── Lista de campañas / Gantt ────────────────────────────────────────────── */
#prod-gantt-header {
    display: flex;
    align-items: flex-start;
    margin: 6px 0 2px 0;
    padding: 0 10px 0 12px;
    gap: 8px;
}

.prod-gantt-hdr-spacer {
    flex: 0 0 564px;
}

.prod-gantt-ruler {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.prod-gantt-hdr-right {
    flex: 0 0 48px;
}

/* Two-row ruler: year bands on top, sub-ticks below */
.prod-gantt-ruler-years {
    position: relative;
    height: 12px;
    border-bottom: 1px solid #e0e8f0;
    flex-shrink: 0;
}

.prod-gantt-ruler-ticks {
    position: relative;
    height: 11px;
    flex-shrink: 0;
}

.prod-gantt-year-band {
    position: absolute;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 600;
    color: #546e7a;
    border-right: 1px solid #cfd8dc;
    box-sizing: border-box;
    overflow: hidden;
    padding: 0 2px;
    white-space: nowrap;
}

.prod-gantt-tick-label {
    position: absolute;
    top: 2px;
    font-size: 8px;
    color: #90a4ae;
    transform: translateX(-50%);
    white-space: nowrap;
}

.prod-campana-row {
    display: flex;
    align-items: center;
    padding: 6px 10px 6px 12px;
    border-bottom: 1px solid #f0f4f8;
    gap: 8px;
}
.prod-campana-row:last-child { border-bottom: none; }
.prod-campana-row:hover { background: #f9fbfd; }

.prod-campana-info {
    width: 320px;
    min-width: 200px;
    max-width: 320px;
    flex-shrink: 0;
}

.prod-campana-nombre {
    font-size: 13px;
    font-weight: 700;
    color: #263238;
    white-space: normal;
    overflow-wrap: break-word;
    line-height: 1.3;
}

.prod-campana-sub {
    display: flex;
    gap: 4px;
    align-items: center;
    margin-top: 2px;
    flex-wrap: wrap;
}

.prod-tipo-badge {
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 8px;
    color: #fff;
    white-space: nowrap;
}

.prod-campana-lotes-col {
    width: 180px;
    min-width: 180px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.prod-lote-tag {
    font-size: 12px;
    color: #37474f;
    white-space: normal;
    line-height: 1.3;
}

.prod-campana-fechas {
    font-size: 11px;
    color: #78909c;
    margin-top: 3px;
}

.prod-campana-estado {
    width: 90px;
    min-width: 90px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.prod-campana-usuario {
    width: 110px;
    min-width: 110px;
    flex-shrink: 0;
    overflow: hidden;
}

.prod-usuario-chip {
    display: block;
    font-size: 10px;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 9px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #e3f0fb;
    color: #1565c0;
}

.prod-estado-badge {
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 8px;
    color: #fff;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    transition: opacity .15s, box-shadow .15s;
}
.prod-estado-badge:hover {
    opacity: .85;
    box-shadow: 0 1px 4px rgba(0,0,0,.25);
}

.prod-estado-picker {
    position: absolute;
    z-index: 9999;
    background: #fff;
    border: 1px solid #dde3ea;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.15);
    padding: 4px 0;
    min-width: 130px;
}
.prod-estado-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    font-size: 12px;
    color: #37474f;
    cursor: pointer;
    white-space: nowrap;
}
.prod-estado-option::before {
    content: '';
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--dot);
    flex-shrink: 0;
}
.prod-estado-option:hover { background: #f4f7fb; }
.prod-estado-option.active { font-weight: 700; }

.prod-gantt-track {
    flex: 1;
    height: 16px;
    background: #f0f4f8;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
    min-width: 60px;
}

/* Event dots on the main crop Gantt track */
.prod-gantt-evt-pin {
    position: absolute;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    margin-left: -4px;
    border-radius: 50%;
    border: 1.5px solid #fff;
    z-index: 2;
    opacity: 0.9;
    cursor: default;
    transition: opacity .15s, transform .1s;
    box-sizing: border-box;
}
.prod-gantt-evt-pin:hover {
    opacity: 1;
    transform: scale(1.4);
    z-index: 3;
}

.prod-gantt-bar {
    position: absolute;
    top: 0;
    height: 100%;
    border-radius: 4px;
    min-width: 4px;
    opacity: 0.85;
}

.prod-gantt-today {
    position: absolute;
    top: 0;
    width: 2px;
    height: 100%;
    background: #f44336;
    opacity: 0.7;
    z-index: 1;
}

.prod-campana-actions {
    display: flex;
    gap: 2px;
    flex-shrink: 0;
}

/* ── Expand toggle ─────────────────────────────────────────────────────────── */
.prod-cultivo-wrapper {
    display: block;
}
.prod-campana-row:last-child { border-bottom: none; }

.prod-expand-placeholder {
    width: 20px;
    min-width: 20px;
    flex-shrink: 0;
    display: inline-block;
}

.prod-expand-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #b0bec5;
    padding: 2px;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: color .15s, background .15s;
}
.prod-expand-btn svg {
    width: 14px;
    height: 14px;
    transition: transform .18s ease;
}
.prod-expand-btn:hover { color: #1565C0; background: #e3f0fb; }
.prod-expand-btn.expanded svg { transform: rotate(90deg); }

.prod-campana-row { cursor: pointer; }

/* ── Sub-task rows ─────────────────────────────────────────────────────────── */
.prod-sub-rows { display: block; }
.prod-sub-rows.hidden { display: none; }

.prod-sub-row {
    display: flex;
    align-items: center;
    padding: 4px 10px 4px 12px;
    border-bottom: 1px solid #f0f4f8;
    gap: 8px;
    background: #f7fafc;
}
.prod-sub-row:last-child { border-bottom: none; }

.prod-sub-indent {
    width: 20px;
    min-width: 20px;
    flex-shrink: 0;
    border-left: 2px solid #dde3ea;
    align-self: stretch;
    margin-left: 9px;
}

.prod-sub-info {
    width: 320px;
    min-width: 200px;
    max-width: 320px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
}

.prod-sub-cat-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.prod-sub-tarea {
    font-size: 11px;
    font-weight: 700;
    color: #37474f;
    white-space: nowrap;
    flex-shrink: 0;
}

.prod-sub-titulo {
    font-size: 12px;
    color: #37474f;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prod-sub-estado-badge {
    font-size: 9px;
    padding: 1px 6px;
    border-radius: 8px;
    color: #fff;
    white-space: nowrap;
    flex-shrink: 0;
}

.prod-sub-meta {
    width: 200px;
    min-width: 200px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
    overflow: hidden;
}

.prod-sub-fecha-label {
    font-size: 10px;
    color: #b0bec5;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.prod-sub-fecha {
    font-size: 11px;
    color: #546e7a;
    font-weight: 500;
}

.prod-sub-usuario {
    font-size: 10px;
    color: #90a4ae;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.prod-sub-gantt {
    height: 10px;
    background: #eef2f6;
}

.prod-sub-marker {
    position: absolute;
    top: 1px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: translateX(-50%);
    z-index: 1;
    opacity: 0.85;
}

.prod-sub-marker-active {
    box-shadow: 0 0 0 2px rgba(255,255,255,.7), 0 0 0 3.5px currentColor;
}

.prod-sub-bar {
    position: absolute;
    top: 2px;
    height: 6px;
    border-radius: 3px;
    opacity: 0.75;
    min-width: 3px;
}

.prod-sub-act-spacer {
    width: 54px;
    flex-shrink: 0;
}

.prod-sub-loading,
.prod-sub-empty,
.prod-sub-error {
    padding: 6px 12px 6px 52px;
    font-size: 11px;
    color: #90a4ae;
    background: #f7fafc;
    border-bottom: 1px solid #f0f4f8;
    font-style: italic;
}
.prod-sub-error { color: #e57373; }

/* ── Barra de filtros ──────────────────────────────────────────────────────── */
#prod-filters {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-bottom: 1px solid #f0f4f8;
    flex-wrap: wrap;
    flex-shrink: 0;
}
.prod-filter-wrap {
    position: relative;
}
.prod-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 11px;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    background: #fff;
    font-size: 11px;
    color: #546e7a;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .15s, background .15s;
}
.prod-filter-btn:hover { border-color: #90a4ae; background: #f8fbff; }
.prod-filter-btn.active { border-color: #1a73e8; color: #1a73e8; background: #e8f0fe; }
.prod-filter-btn.open   { border-color: #90a4ae; background: #f0f4f8; }
.prod-filter-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 15px;
    height: 15px;
    padding: 0 3px;
    border-radius: 8px;
    background: #1a73e8;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
}
.prod-filter-panel {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 500;
    background: #fff;
    border: 1px solid #dde3ea;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    padding: 6px 0;
    min-width: 190px;
    max-height: 280px;
    overflow-y: auto;
}
.prod-filter-check-label {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 5px 14px;
    font-size: 12px;
    color: #37474f;
    cursor: pointer;
    white-space: nowrap;
}
.prod-filter-check-label:hover { background: #f4f7fb; }
.prod-filter-dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}
.prod-filter-empty {
    padding: 8px 14px;
    font-size: 11px;
    color: #90a4ae;
    margin: 0;
}
.prod-filter-clear {
    padding: 4px 10px;
    border: none;
    background: none;
    font-size: 11px;
    color: #e53935;
    cursor: pointer;
    border-radius: 14px;
}
.prod-filter-clear:hover { background: #fce8e6; }
.prod-filter-noresult {
    padding: 20px;
    text-align: center;
    font-size: 12px;
    color: #90a4ae;
}

/* ── Campaña group headers (colapsables) ───────────────────────────────────── */
.prod-group-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px 4px;
    border-top: 2px solid #e8f0fe;
    margin-top: 4px;
    cursor: pointer;
    user-select: none;
}
.prod-group:first-child .prod-group-header {
    border-top: none;
    margin-top: 0;
}
.prod-group-header:hover { background: #f0f6ff; }
.prod-group-toggle {
    font-size: 13px;
    color: #1a73e8;
    font-weight: 700;
    flex-shrink: 0;
    width: 18px;
    text-align: center;
}
.prod-group-count {
    margin-left: auto;
    font-size: 10px;
    color: #b0bec5;
}
.prod-group-nombre {
    font-size: 12px;
    font-weight: 700;
    color: #1a73e8;
    letter-spacing: .02em;
}
.prod-group-temporada {
    font-size: 10px;
    color: #90a4ae;
    background: #f0f4f8;
    padding: 1px 6px;
    border-radius: 8px;
}

/* ── Nueva campaña inline ──────────────────────────────────────────────────── */
#pf-nueva-campana-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 6px;
}
#pf-nueva-campana-wrap input {
    width: 100%;
    padding: 5px 8px;
    border: 1px solid #cfd8dc;
    border-radius: 5px;
    font-size: 12px;
    box-sizing: border-box;
}
.pf-campana-dates {
    display: flex;
    align-items: center;
    gap: 6px;
}
.pf-campana-dates label {
    font-size: 11px;
    color: #546e7a;
    flex-shrink: 0;
}
.pf-campana-dates select {
    flex: 1;
    padding: 4px 6px;
    border: 1px solid #cfd8dc;
    border-radius: 5px;
    font-size: 12px;
}
.pf-campana-select, .pf-lote-select {
    width: 100%;
    padding: 5px 8px;
    border: 1px solid #cfd8dc;
    border-radius: 5px;
    font-size: 12px;
}

.btn-prod-edit, .btn-prod-delete, .btn-prod-archive {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    padding: 3px 5px;
    border-radius: 4px;
    opacity: 0.5;
    line-height: 1;
}
.btn-prod-edit:hover    { background: #e3f0fb; opacity: 1; }
.btn-prod-delete:hover  { background: #ffebee; opacity: 1; }
.btn-prod-archive:hover { background: #f3e5f5; opacity: 1; }

/* ── Rotaciones ────────────────────────────────────────────────────────────── */
#prod-tab-rotaciones {
    display: flex;
    flex-direction: column;
    overflow: hidden;    /* override .prod-tab-content overflow-y: auto */
}

#rot-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 14px;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
    background: #fafcfe;
}
#rot-cancel-sel {
    background: rgba(229, 57, 53, 0.85);
    border: none;
    color: white;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 12px;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 5px;
}
#rot-cancel-sel:hover { background: rgba(198, 40, 40, 0.95); }
#rot-cancel-sel kbd {
    background: rgba(255,255,255,0.25);
    border-radius: 4px;
    padding: 1px 5px;
    font-size: 10px;
    font-family: sans-serif;
}

.rot-nav-btn {
    background: none;
    border: 1px solid #d0dae6;
    border-radius: 5px;
    cursor: pointer;
    padding: 3px 10px;
    font-size: 11px;
    color: #546e7a;
    line-height: 1.4;
}
.rot-nav-btn:hover { background: #f0f4f8; color: #1a2635; }

#rot-title {
    flex: 1;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    color: #37474f;
}

#rot-wrap {
    overflow: auto;
    flex: 1;
    min-height: 0;
    height: 0;          /* force flex to control height, not content */
}

.rot-table {
    border-collapse: collapse;
    font-size: 11px;
    width: 100%;
    table-layout: fixed;
}

/* Header: year row */
.rot-th-lote {
    position: sticky;
    left: 0;
    background: #edf2f7;
    z-index: 3;
    padding: 4px 10px;
    text-align: left;
    font-size: 10px;
    color: #546e7a;
    border-bottom: 1px solid #d0dae6;
    white-space: nowrap;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
}

.rot-th-year {
    background: #edf2f7;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    color: #37474f;
    border-bottom: 1px solid #d0dae6;
    border-left: 2px solid #cdd9e5;
    padding: 3px 4px;
}

.rot-th-month {
    background: #f0f4f8;
    text-align: center;
    font-size: 10px;
    color: #78909c;
    border-bottom: 2px solid #cdd9e5;
    border-left: 1px solid #e8ecf0;
    padding: 3px 2px;
    white-space: nowrap;
    overflow: hidden;
}
.rot-th-today {
    background: rgba(42,157,143,0.28);
    color: #0d5c52;
    font-weight: 700;
    border-left: 3px solid #2a9d8f !important;
    border-top: 3px solid #2a9d8f;
}

/* Body rows */
.rot-campo-row td {
    background: #edf2f7;
    font-size: 11px;
    font-weight: 700;
    color: #37474f;
    padding: 4px 10px;
    border-bottom: 1px solid #d0dae6;
    position: sticky;
    left: 0;
}

.rot-lote-row { height: 32px; }
.rot-lote-row:hover .rot-td-lote { background: #f4f8fc; }
.rot-lote-row:hover .rot-cell    { background: rgba(0,0,0,0.02); }

.rot-td-lote {
    position: sticky;
    left: 0;
    background: #fff;
    z-index: 1;
    padding: 3px 8px 3px 14px;
    border-bottom: 1px solid #f0f4f8;
    border-right: 2px solid #e0e8f0;
    white-space: nowrap;
    font-size: 11px;
    color: #263238;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rot-lote-ha {
    font-size: 9px;
    color: #90a4ae;
    font-weight: 400;
}

.rot-cell {
    border-left: 1px solid #f0f4f8;
    border-bottom: 1px solid #f0f4f8;
    padding: 2px 0;
    vertical-align: middle;
    height: 32px;
}

.rot-cell-today {
    background: rgba(42,157,143,0.13);
    border-left: 3px solid rgba(42,157,143,0.75) !important;
}

/* Celdas vacías — seleccionables para crear nuevo cultivo */
.rot-cell-empty {
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    position: relative;
}
.rot-cell-empty:hover {
    background: rgba(42,157,143,0.08) !important;
}
.rot-cell-selected {
    background: rgba(42,157,143,0.18) !important;
    box-shadow: inset 0 0 0 1.5px rgba(42,157,143,0.5);
}
.rot-selection-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    background: var(--sb-accent, #2a9d8f);
    border-radius: 50%;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    transition: transform .1s;
}
.rot-selection-add:hover {
    transform: translate(-50%, -50%) scale(1.15);
}


/* Continuous bar spanning one or more months (via colspan) */
.rot-cell-filled {
    padding: 3px 4px;
}

.rot-bar {
    position: relative;
    display: flex;
    align-items: center;
    height: 22px;
    background: var(--crop-color, #78909c);
    border-radius: 3px;
    padding: 0 7px;
    opacity: 0.88;
    min-width: 0;
    overflow: visible;
}
.rot-evt-pin {
    position: absolute;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    margin-left: -4px;
    border-radius: 50%;
    border: 1.5px solid #fff;
    z-index: 2;
    opacity: 0.9;
    cursor: default;
    transition: opacity .15s, transform .1s;
    box-sizing: border-box;
    pointer-events: auto;
}
.rot-evt-pin:hover { opacity: 1; transform: scale(1.4); z-index: 3; }

.rot-bar + .rot-bar {
    margin-top: 2px;
}

.rot-bar-label {
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* ── Salud (crop health monitor) ──────────────────────────────────────────── */
/* Eventos panel — overlay on top of prod-panel */
#eventos-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 0px);
    right: 0;
    bottom: 0;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1150;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
    max-width: 600px;
}
body.sb-open #eventos-panel { left: var(--sb-w-open); }
#eventos-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}
#eventos-panel-title { font-size: 15px; font-weight: 700; color: #263238; }
#eventos-panel-body { flex: 1; overflow-y: auto; padding: 12px 16px; }

/* Event list in panel */
.evt-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #f0f4f8;
}
.evt-item:last-child { border-bottom: none; }
.evt-pin {
    width: 10px; height: 10px;
    border-radius: 50%;
    margin-top: 4px;
    flex-shrink: 0;
}
.evt-item-body { flex: 1; min-width: 0; }
.evt-item-header {
    display: flex; align-items: center; gap: 6px;
    font-size: 13px; font-weight: 600; color: #263238;
}
.evt-item-date { font-weight: 400; color: #78909c; font-size: 12px; }
.evt-item-meta { font-size: 12px; color: #546e7a; margin-top: 2px; }
.evt-item-meta span { margin-right: 10px; }
.evt-item-notes { font-size: 12px; color: #78909c; font-style: italic; margin-top: 2px; }
.evt-item-files { margin-top: 4px; }
.evt-item-origin {
    font-size: 10px; color: #90a4ae;
    background: #f5f7fa; padding: 1px 5px; border-radius: 4px;
}
.evt-item-actions {
    display: flex; gap: 4px; flex-shrink: 0;
    opacity: 0; transition: opacity .15s;
}
.evt-item:hover .evt-item-actions { opacity: 1; }
.evt-item-actions button {
    background: none; border: none; cursor: pointer;
    font-size: 13px; padding: 2px 4px; color: #78909c;
}
.evt-item-actions button:hover { color: #263238; }

/* Event form */
.eventos-form-header {
    font-size: 14px; font-weight: 700; color: #263238;
    padding: 12px 0 8px; border-top: 1px solid #e8ecf0; margin-top: 10px;
}
.eventos-form-footer {
    display: flex; justify-content: flex-end; gap: 8px; padding-top: 12px;
}
#eventos-form-wrap .prod-field {
    margin-bottom: 12px;
}
#eventos-form-wrap .prod-field label {
    display: block;
    font-size: 12px;
    color: #546e7a;
    font-weight: 600;
    margin-bottom: 4px;
}
#eventos-form-wrap input,
#eventos-form-wrap select,
#eventos-form-wrap textarea {
    width: 100%; box-sizing: border-box;
    padding: 7px 10px; font-size: 13px;
    border: 1px solid #cfd8dc; border-radius: 6px;
    background: #fff; color: #263238;
}
#eventos-form-wrap textarea { resize: vertical; }
#evf-extra-fields .prod-field { margin-bottom: 10px; }
.evf-file-wrap {
    margin-bottom: 12px;
    padding: 10px 12px;
    background: #f8fafb;
    border: 1px dashed #cfd8dc;
    border-radius: 8px;
}
.evf-file-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    background: #fff;
    border: 1px solid #2a9d8f;
    border-radius: 6px;
    color: #2a9d8f;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s;
}
.evf-file-btn:hover { background: rgba(42,157,143,0.06); }
.evf-rx-found {
    margin-bottom: 8px;
}
.evf-rx-found-title {
    font-size: 11px;
    font-weight: 600;
    color: #546e7a;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 6px;
}
.evf-rx-option {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #e8ecf0;
    border-radius: 6px;
    margin-bottom: 4px;
    cursor: pointer;
    font-size: 12px;
    transition: background .12s;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
}
.evf-rx-option:hover { background: #f5f7fa; }
.evf-rx-option input[type="radio"] {
    margin: 3px 0 0 0;
    flex-shrink: 0;
    accent-color: #2a9d8f;
    width: 14px !important;
    height: 14px;
}
.evf-rx-option-text { flex: 1; min-width: 0; text-align: left; }
.evf-rx-option-text b { color: #263238; display: block; font-weight: 600; }
.evf-rx-detail { font-size: 11px; color: #64748b; margin-left: 4px; }
.evf-rx-option-sub {
    font-size: 11px;
    color: #78909c;
    margin-top: 2px;
}
.evf-rx-linked {
    font-size: 11px;
    color: #546e7a;
    padding: 4px 0;
}
.evf-rx-linked-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    background: rgba(42,157,143,0.12);
    color: #2a9d8f;
    font-size: 10px;
    font-weight: 600;
    margin-right: 4px;
}
.evt-parse-summary {
    font-size: 11px;
    color: #2e7d32;
    background: rgba(76,175,80,0.08);
    border: 1px solid rgba(76,175,80,0.2);
    border-radius: 4px;
    padding: 4px 8px;
    margin-bottom: 6px;
}
.evf-dosis-row {
    display: flex;
    gap: 8px;
}
.evf-dosis-row input[type="number"] {
    flex: 1;
    min-width: 0;
    width: auto !important;
}
.evf-dosis-row select {
    width: auto !important;
    flex: 0 0 110px;
}
.evf-rx-summary {
    font-size: 11px;
    color: #546e7a;
    background: rgba(42,157,143,0.06);
    border-radius: 4px;
    padding: 3px 6px;
    margin-top: 3px;
}

/* ── Cultivo Detail Panel ──────────────────────────────────────────────── */
#cultivo-detail-panel {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 480px; max-width: 100vw;
    background: #fff;
    box-shadow: -2px 0 12px rgba(0,0,0,0.15);
    z-index: 1150;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
#cultivo-detail-panel.hidden { display: none; }
#cd-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px 16px; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
#cd-header-info { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; }
#cd-title { font-size: 15px; font-weight: 700; color: #1a2635; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
#cd-estado-badge { flex-shrink: 0; }
#cd-subtitle { width: 100%; }
#cd-subtitle { font-size: 12px; color: #64748b; margin-top: 2px; }
#cd-header-actions { display: flex; gap: 4px; align-items: center; flex-shrink: 0; }
.btn-cd-action { background: none; border: none; cursor: pointer; font-size: 14px; padding: 4px 6px; opacity: 0.5; border-radius: 4px; }
.btn-cd-action:hover { opacity: 1; background: #f0f4f8; }
#cd-body { flex: 1; overflow-y: auto; }
#cd-resumen { padding: 12px 16px; font-size: 12px; color: #475569; border-bottom: 1px solid #f1f5f9; }
#cd-resumen:empty { display: none; }
.cd-section { border-bottom: 1px solid #f1f5f9; }
.cd-section-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 8px 16px; font-size: 12px; font-weight: 600; color: #64748b;
    text-transform: uppercase; letter-spacing: 0.3px; cursor: pointer; user-select: none;
}
.cd-section-header:hover { background: #f8fafc; }
.cd-section-body { padding: 0 16px 8px; }
.cd-section-body:empty::after { content: "—"; color: #b0bec5; font-size: 12px; display: block; padding: 4px 0; }
.cd-evt-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-size: 12px; border-bottom: 1px solid #f8fafc; }
.cd-evt-row:last-child { border-bottom: none; }
.cd-evt-badge { padding: 1px 6px; border-radius: 4px; font-size: 10px; font-weight: 600; color: #fff; }
.cd-evt-date { color: #64748b; white-space: nowrap; }
.cd-evt-notes { color: #475569; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cd-evt-actions { display: flex; gap: 2px; }
.cd-evt-actions button { background: none; border: none; cursor: pointer; font-size: 12px; opacity: 0.4; padding: 2px; }
.cd-evt-actions button:hover { opacity: 1; }
.cd-evt-item { border-bottom: 1px solid #f1f5f9; }
.cd-evt-item:last-child { border-bottom: none; }
.cd-evt-item .cd-evt-row { cursor: pointer; padding: 6px 0; }
.cd-evt-item .cd-evt-row:hover { background: #f8fafc; }
.cd-evt-detail { padding: 4px 0 10px 28px; font-size: 12px; color: #475569; }
.cd-evt-detail.hidden { display: none; }
.cd-evt-detail-notes { font-style: italic; margin-bottom: 4px; white-space: pre-wrap; }
.cd-evt-detail-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 4px; }
.cd-evt-detail-meta span { color: #334155; }
.cd-evt-detail-meta b { color: #64748b; font-weight: 600; }
.cd-evt-detail-row { margin-bottom: 3px; }
.cd-evt-detail-origin { color: #94a3b8; font-size: 11px; margin-top: 4px; }
.cd-evt-file { color: #1565c0; text-decoration: none; font-size: 11px; margin-right: 8px; }
.cd-evt-file:hover { text-decoration: underline; }
.cd-evt-rx-map { background: none; border: none; cursor: pointer; color: #1565c0; font-size: 12px; padding: 0; }
.cd-evt-rx-map:hover { text-decoration: underline; }
.cd-evt-order-link { color: #1565c0; text-decoration: none; font-size: 12px; }
.cd-evt-order-link:hover { text-decoration: underline; }
.cd-evt-detail-label { color: #64748b; font-weight: 600; }
.cd-ord-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-size: 12px; border-bottom: 1px solid #f8fafc; cursor: pointer; }
.cd-ord-row:hover { background: #f8fafc; }
.cd-ord-row:last-child { border-bottom: none; }
.cd-ord-titulo { flex: 1; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cd-ord-tarea { color: #64748b; font-size: 11px; }
.cd-rx-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-size: 12px; border-bottom: 1px solid #f8fafc; }
.cd-rx-row:last-child { border-bottom: none; }

/* Costs section in cultivo detail */
.cd-costos-wrap { font-size: 12px; }
.cd-costos-section { margin-bottom: 12px; }
.cd-costos-title { font-size: 11px; font-weight: 700; color: #2a9d8f; text-transform: uppercase; letter-spacing: .3px; margin-bottom: 4px; }
.cd-costos-line { display: flex; justify-content: space-between; padding: 2px 0; }
.cd-costos-line span:last-child { font-variant-numeric: tabular-nums; text-align: right; }
.cd-costos-total { font-weight: 700; border-top: 1px solid #e8ecf0; padding-top: 4px; margin-top: 2px; }
.cd-costos-subtle { font-size: 11px; color: #78909c; }
.cd-costos-positive { color: #2e7d32; }
.cd-costos-negative { color: #c62828; }
.cd-rx-name { flex: 1; font-weight: 500; }
.cd-rx-map { background: none; border: none; cursor: pointer; font-size: 13px; opacity: 0.5; }
.cd-rx-map:hover { opacity: 1; }

/* Salud panel — overlay on top of everything */
#salud-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 0px);
    right: 0;
    bottom: 0;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}
body.sb-open #salud-panel {
    left: var(--sb-w-open);
}
#salud-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}
#salud-panel-title {
    font-size: 16px;
    font-weight: 700;
    color: #263238;
}
#salud-panel-body {
    flex: 1;
    overflow-y: auto;
}

#salud-wrap {
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.salud-lote-info {
    font-size: 12px;
    color: #64748b;
    margin-top: 4px;
}
.salud-lote-info b { color: #334155; }
.salud-info-popup {
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    max-width: 320px;
    background: #1e293b;
    color: #e2e8f0;
    font-size: 11px;
    line-height: 1.5;
    padding: 8px 10px;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    z-index: 10;
}
.salud-stat-card { position: relative; }
.btn-salud-info {
    width: 16px; height: 16px;
    font-size: 9px;
    vertical-align: middle;
    margin-left: 4px;
}
.salud-stat-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 600;
    margin-top: 3px;
    white-space: nowrap;
}

#salud-header {
    font-size: 14px;
    font-weight: 600;
    color: #1a2635;
    display: flex;
    align-items: center;
    gap: 8px;
}
#salud-header .salud-variedad-hint {
    font-size: 11px;
    font-weight: 400;
    color: #b58a00;
    background: #fff8e1;
    padding: 2px 8px;
    border-radius: 4px;
}
#salud-chart-container {
    position: relative;
    width: 100%;
    height: 280px;
}
#salud-chart-container canvas {
    width: 100% !important;
    height: 100% !important;
}
#salud-fenologia-strip {
    position: relative;
    height: 28px;
    border-radius: 4px;
    overflow: hidden;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
}
.salud-stage {
    position: absolute;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 4px;
    box-sizing: border-box;
}
.salud-stage-today {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #333;
    z-index: 2;
}
#salud-resumen {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
.salud-stat-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 8px 10px;
    text-align: center;
}
.salud-stat-card .salud-stat-label {
    font-size: 10px;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.salud-stat-card .salud-stat-value {
    font-size: 18px;
    font-weight: 700;
    color: #1a2635;
    margin-top: 2px;
}
.salud-stat-card .salud-stat-unit {
    font-size: 11px;
    color: #94a3b8;
}
.salud-semaforo {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}
.salud-semaforo.good     { background: #16a34a; }
.salud-semaforo.warning  { background: #f59e0b; }
.salud-semaforo.critical { background: #dc2626; }
.salud-no-kc-banner {
    font-size: 11px;
    color: #94a3b8;
    font-style: italic;
    text-align: center;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.salud-stat-sub {
    font-size: 9px;
    color: #94a3b8;
    margin-top: 2px;
}
.btn-prod-salud {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 4px;
    opacity: 0.6;
    transition: opacity .15s;
}
.btn-prod-salud:hover { opacity: 1; }

/* ── Panel de formulario ──────────────────────────────────────────────────── */
#prod-form-panel {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 360px;
    max-height: none;
    background: #fff;
    box-shadow: -2px 0 12px rgba(0,0,0,0.18);
    z-index: 1150;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#prod-form-header {
    display: flex;
    align-items: center;
    padding: 10px 12px 10px 14px;
    background: #f0f4f8;
    border-bottom: 1px solid #d0dae6;
    flex-shrink: 0;
    gap: 8px;
}

#prod-form-title {
    font-size: 13px;
    font-weight: 700;
    color: #1a2635;
    flex: 1;
}

#prod-form-body {
    overflow-y: auto;
    flex: 1;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.prod-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.prod-field label {
    font-size: 11px;
    font-weight: 600;
    color: #546e7a;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.prod-optional {
    text-transform: none;
    font-weight: 400;
    color: #90a4ae;
    font-size: 10px;
}
.req { color: #e53935; font-weight: 700; }

.prod-field input[type="text"],
.prod-field input[type="date"],
.prod-field select,
.prod-field textarea {
    padding: 6px 9px;
    border: 1px solid #cdd3da;
    border-radius: 6px;
    font-size: 12px;
    color: #263238;
    background: #fff;
    font-family: inherit;
}

.prod-field input:focus,
.prod-field select:focus,
.prod-field textarea:focus {
    outline: none;
    border-color: #2a9d8f;
    box-shadow: 0 0 0 2px rgba(42,157,143,0.15);
}

.prod-field textarea { resize: vertical; }

/* Lotes check list */
.prod-lotes-check {
    border: 1px solid #cdd3da;
    border-radius: 6px;
    max-height: 150px;
    overflow-y: auto;
    background: #fafcfe;
}

.pf-campo-group { padding: 2px 0; }

.pf-campo-header {
    padding: 4px 8px 2px;
    background: #f0f4f8;
}

.pf-campo-label {
    font-size: 11px;
    font-weight: 700;
    color: #37474f;
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.pf-lote-label {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px 3px 20px;
    font-size: 12px;
    color: #37474f;
    cursor: pointer;
}
.pf-lote-label:hover { background: #f0f7ff; }

.prod-hint {
    font-size: 11px;
    color: #546e7a;
    background: #f0f7ff;
    border-radius: 5px;
    padding: 4px 8px;
}

.prod-error {
    font-size: 12px;
    color: #c62828;
    background: #ffebee;
    border-radius: 6px;
    padding: 6px 10px;
}

#prod-form-footer {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding-top: 4px;
}

/* ── Sidebar: sección Administración ──────────────────────────────────────── */
.sb-section-header {
    display: flex;
    align-items: center;
    padding: 6px 0;
    color: var(--sb-text);
    opacity: 0.5;
    pointer-events: none;
    min-height: 36px;
}
/* Sub-items dependientes (Suelos, Histórico bajo Mis Campos) */
.sb-children {
    border-left: 2px solid rgba(255,255,255,0.15);
    margin-left: calc(var(--sb-w) / 2 - 1px);
}
.sb-child {
    font-size: 12px;
    min-height: 38px;
    opacity: 0.82;
}
.sb-child .sb-icon {
    width: calc(var(--sb-w) / 2 + 2px);
    min-width: calc(var(--sb-w) / 2 + 2px);
}
.sb-child .sb-icon svg { width: 15px; height: 15px; }
.sb-child:hover { opacity: 1; }

.sb-subsection { overflow: hidden; }
.sb-sub-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #8fa8bf;
    padding-left: 4px;
}
.sb-subitem .sb-icon { opacity: 0.85; }

/* ── Panel Usuarios (Admin) ─────────────────────────────────────────────────── */
/* Plan de cuentas panel — reuses admin-cultivos styles */
#admin-cuentas-panel {
    position: fixed;
    top: 0; left: var(--sb-w);
    width: 420px;
    height: 100vh;
    background: #1e2a38;
    border-right: 1px solid #2a3f55;
    z-index: 120;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-cuentas-panel { left: var(--sb-w-open); }
#admin-cuentas-panel.hidden { display: none; }
#admin-cuentas-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 10px 14px; background: #16202c; border-bottom: 1px solid #2a3f55;
    color: #e8edf3; font-size: 13px; font-weight: 600;
}
#admin-cuentas-list { flex: 1; overflow-y: auto; padding: 8px 0; }
.acct-row {
    padding: 8px 16px;
    border-bottom: 1px solid #1a2635;
    display: flex;
    align-items: center;
    gap: 8px;
}
.acct-row:hover { background: rgba(255,255,255,0.04); }
.acct-row.acct-n1 {
    font-weight: 700; font-size: 11px; text-transform: uppercase;
    letter-spacing: .05em; padding: 6px 12px; padding-top: 12px;
    background: #f4f7fa; border-left: 3px solid #aaa; border-bottom: 1px solid #e8edf3;
}
.acct-row.acct-n1 .acct-name { color: #546e7a; font-size: 11px; }
}
.acct-row.acct-n2 { padding-left: 24px; }
.acct-row.acct-n3 { padding-left: 44px; }
.acct-row .acct-name {
    flex: 1; min-width: 0;
    font-size: 13px; font-weight: 500; color: #e0eaf4;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.acct-row.acct-n3 .acct-name { font-size: 12px; color: #7a9ab8; }
.acct-row .admin-cultivo-actions { display: flex; gap: 4px; flex-shrink: 0; }
.acct-row .acct-del {
    background: none; border: none; color: #546e7a; cursor: pointer;
    font-size: 13px; opacity: 0; padding: 2px 4px;
}
.acct-row:hover .acct-del { opacity: 0.5; }
.acct-row .acct-del:hover { opacity: 1; color: #e53935; }
#admin-cuenta-form { background: #16202c; }
#admin-cuenta-form input, #admin-cuenta-form select {
    background: #0d1b2a; color: #cdd9e5; border: 1px solid #2a3f55;
    border-radius: 6px; padding: 7px 10px; font-size: 13px; width: 100%; box-sizing: border-box;
}
#admin-cuenta-form label { color: #8fa8bf; font-size: 11px; }

#admin-usuarios-panel {
    position: fixed;
    top: 0; left: var(--sb-w);
    width: 380px;
    height: 100vh;
    background: #1e2a38;
    border-right: 1px solid #2a3f55;
    z-index: 120;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-usuarios-panel { left: var(--sb-w-open); }
#admin-usuarios-panel.hidden { display: none; }

#admin-usuarios-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 15px;
    color: #e8f0fe;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}

#admin-usuarios-search {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 10px 12px;
    padding: 4px 10px;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 14px;
    flex-shrink: 0;
}
#admin-usuarios-search svg {
    width: 13px; height: 13px;
    stroke: #8fa8bf;
    flex-shrink: 0;
}
#admin-usuarios-search-input {
    background: transparent;
    border: none;
    outline: none;
    color: #e8f0fe;
    font-size: 12px;
    width: 100%;
}
#admin-usuarios-search-input::placeholder { color: #4a6a8a; }

#admin-usuarios-list {
    flex: 1;
    overflow-y: auto;
    padding: 4px 0;
}
.admin-usuarios-empty {
    padding: 20px 16px;
    color: #8fa8bf;
    font-size: 13px;
    text-align: center;
}

/* Fila de usuario */
.au-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    gap: 8px;
}
.au-row:hover { background: rgba(255,255,255,0.04); }
.au-info { flex: 1; min-width: 0; }
.au-nombre {
    font-size: 13px;
    font-weight: 500;
    color: #e8f0fe;
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}
.au-email {
    font-size: 11px;
    color: #8fa8bf;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.au-actions { display: flex; gap: 4px; flex-shrink: 0; }
.au-btn {
    background: rgba(255,255,255,0.08);
    border: none;
    color: #b0c4d8;
    width: 26px; height: 26px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    display: flex; align-items: center; justify-content: center;
}
.au-btn:hover { background: rgba(255,255,255,0.18); color: #fff; }
.au-btn-del:hover { background: rgba(198,40,40,0.7); color: #fff; }

/* Badges */
.au-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.au-badge-admin    { background: #1a3a5c; color: #64b5f6; }
.au-badge-usuario  { background: #1a3a2c; color: #81c995; }
.au-badge-inactivo { background: #3a1a1a; color: #ef9a9a; }
.au-badge-pending  { background: #3a3010; color: #ffd54f; }

/* Panel formulario usuario */
#admin-usuario-form-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 380px);
    width: 340px;
    height: 100vh;
    background: #243447;
    border-right: 1px solid #2a3f55;
    z-index: 121;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-usuario-form-panel { left: calc(var(--sb-w-open) + 380px); }
#admin-usuario-form-panel.hidden { display: none; }

#admin-usuario-form-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 14px;
    color: #e8f0fe;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}
#admin-usuario-form-body {
    padding: 16px;
    overflow-y: auto;
    flex: 1;
}
#auf-footer {
    display: flex;
    gap: 8px;
    margin-top: 16px;
}

/* ── Panel perfil de usuario ────────────────────────────────────────────────── */
#user-profile-panel {
    position: fixed;
    top: 8px;
    left: calc(var(--sb-w) + 8px);
    width: 280px;
    background: #1e2a38;
    border: 1px solid #2a3f55;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #user-profile-panel { left: calc(var(--sb-w-open) + 8px); }
#user-profile-panel.hidden { display: none; }

#user-profile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    font-weight: 600;
    font-size: 13px;
    color: #e8f0fe;
    border-bottom: 1px solid #2a3f55;
}
#user-profile-body {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.profile-divider {
    height: 1px;
    background: rgba(255,255,255,0.08);
    margin: 2px 0;
}
.profile-pwd-section { display: flex; flex-direction: column; gap: 8px; }
.profile-pwd-desc {
    font-size: 11px;
    color: #8fa8bf;
    line-height: 1.4;
}
.profile-pwd-ok {
    font-size: 11px;
    color: #81c995;
    line-height: 1.4;
}

/* ── Panel Catálogo de cultivos (Admin) ────────────────────────────────────── */
#admin-cultivos-panel {
    position: fixed;
    top: 0; left: var(--sb-w);
    width: 420px;
    height: 100vh;
    background: #1e2a38;
    border-right: 1px solid #2a3f55;
    z-index: 120;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-cultivos-panel { left: var(--sb-w-open); }
#admin-cultivos-panel.hidden { display: none; }

#admin-cultivos-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 15px;
    color: #e0eaf4;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}
.admin-header-actions { display: flex; gap: 8px; align-items: center; }

#admin-cultivos-filter {
    padding: 10px 16px;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}
#admin-cultivos-filter select {
    width: 100%;
    background: #0d1b2a;
    color: #cdd9e5;
    border: 1px solid #2a3f55;
    border-radius: 6px;
    padding: 6px 8px;
    font-size: 13px;
}

#admin-cultivos-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
}

.admin-cultivo-card {
    padding: 10px 16px;
    border-bottom: 1px solid #1a2635;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.admin-cultivo-card:hover { background: rgba(255,255,255,0.04); }
.admin-cultivo-info { flex: 1; min-width: 0; }
.admin-cultivo-nombre {
    font-size: 13px;
    font-weight: 500;
    color: #e0eaf4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.admin-cultivo-cient {
    font-size: 11px;
    color: #7a9ab8;
    font-style: italic;
}
.admin-cultivo-meta {
    font-size: 11px;
    color: #5a7a98;
    margin-top: 2px;
}
.admin-origen-badge {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
    flex-shrink: 0;
}
.admin-origen-badge.sistema {
    background: rgba(42,157,143,0.2);
    color: #2a9d8f;
}
.admin-origen-badge.empresa {
    background: rgba(233,180,60,0.2);
    color: #e9b43c;
}
.admin-cultivo-actions { display: flex; gap: 4px; flex-shrink: 0; }
.btn-admin-edit, .btn-admin-del {
    background: none;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #7a9ab8;
    cursor: pointer;
    padding: 3px 7px;
    font-size: 13px;
    transition: all 0.15s;
}
.btn-admin-edit:hover { border-color: #2a9d8f; color: #2a9d8f; }
.btn-admin-del:hover  { border-color: #e94560; color: #e94560; }

/* ── Panel formulario cultivo ─────────────────────────────────────────────── */
#admin-cultivo-form-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 420px);
    width: 380px;
    height: 100vh;
    background: #1a2635;
    border-right: 1px solid #2a3f55;
    z-index: 121;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-cultivo-form-panel { left: calc(var(--sb-w-open) + 420px); }
#admin-cultivo-form-panel.hidden { display: none; }

#admin-cultivo-form-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 14px;
    color: #e0eaf4;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}
#admin-cultivo-form-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px 20px 16px;
}
#admin-cultivo-form-body .prod-field {
    margin-bottom: 16px;
}
#admin-cultivo-form-body .prod-field label {
    font-size: 12px;
    margin-bottom: 5px;
}
#admin-cultivo-form-body .prod-field-row {
    margin-bottom: 16px;
}
#admin-cultivo-form-body .prod-field-row .prod-field {
    margin-bottom: 0;
}
#admin-cultivo-form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 12px;
}
.acf-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}
.acf-check {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: #cdd9e5;
    cursor: pointer;
}
.prod-field-row {
    display: flex;
    gap: 12px;
}
.prod-field-row > div { flex: 1; }

/* ── Consociación multi-especie ────────────────────────────────────────────── */
.pf-especie-row {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 6px;
}
.pf-especie-row .pf-especie-select {
    flex: 1;
    background: #0d1b2a;
    color: #cdd9e5;
    border: 1px solid #2a3f55;
    border-radius: 6px;
    padding: 5px 7px;
    font-size: 13px;
}
.btn-remove-especie {
    background: none;
    border: none;
    color: #5a7a98;
    cursor: pointer;
    font-size: 14px;
    padding: 0 4px;
    line-height: 1;
}
.btn-remove-especie:hover { color: #e94560; }
.btn-add-especie {
    background: none;
    border: 1px dashed #2a3f55;
    border-radius: 6px;
    color: #5a7a98;
    cursor: pointer;
    font-size: 12px;
    padding: 4px 10px;
    margin-top: 2px;
    transition: all 0.15s;
    width: 100%;
}
.btn-add-especie:hover { border-color: #2a9d8f; color: #2a9d8f; }

/* ═══════════════════════════════════════════════════════════════════════════
   Órdenes de Trabajo — Shared classes (used from main app + ordenes page)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Estado badge (shared) ────────────────────────────────────────────────── */
.estado-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
    color: #fff;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.estado-abierto    { background: #1e88e5; }
.estado-en_proceso { background: #f57c00; }
.estado-finalizado { background: #2e7d32; }
.estado-archivado  { background: #78909c; }

/* ── Prioridad dot (shared) ───────────────────────────────────────────────── */
.prioridad-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    border: 1.5px solid rgba(0,0,0,0.1);
}
.prioridad-urgente { background: #e53935; border-color: #c62828; }
.prioridad-normal  { background: #b0bec5; border-color: #90a4ae; }
.prioridad-baja    { background: #42a5f5; border-color: #1e88e5; }

/* ── Admin: Tipos de tarea panel ──────────────────────────────────────────── */
#admin-tipos-tarea-panel {
    position: fixed;
    top: 0; left: var(--sb-w);
    width: 420px;
    height: 100vh;
    background: #1e2a38;
    border-right: 1px solid #2a3f55;
    z-index: 120;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-tipos-tarea-panel { left: var(--sb-w-open); }
#admin-tipos-tarea-panel.hidden { display: none; }

#admin-tipos-tarea-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 15px;
    color: #e0eaf4;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}

#admin-tipos-tarea-filter {
    padding: 10px 16px;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}
#admin-tipos-tarea-filter select {
    width: 100%;
    background: #0d1b2a;
    color: #cdd9e5;
    border: 1px solid #2a3f55;
    border-radius: 6px;
    padding: 6px 8px;
    font-size: 13px;
}

#admin-tipos-tarea-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
}

/* Override group title for dark admin panels — same as plan de cuentas / catálogo */
#admin-tipos-tarea-panel .prod-cultivo-group-title {
    background: #f4f7fa;
    color: #546e7a;
}

.admin-tipo-tarea-card {
    padding: 10px 16px;
    border-bottom: 1px solid #1a2635;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.admin-tipo-tarea-card:hover { background: rgba(255,255,255,0.04); }
.admin-tipo-tarea-info { flex: 1; min-width: 0; }
.admin-tipo-tarea-nombre {
    font-size: 13px;
    font-weight: 500;
    color: #e0eaf4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.admin-tipo-tarea-meta {
    font-size: 11px;
    color: #5a7a98;
    margin-top: 2px;
}
.admin-tipo-tarea-actions { display: flex; gap: 4px; flex-shrink: 0; }

/* Form panel for tipos de tarea */
#admin-tipo-tarea-form-panel {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 420px);
    width: 360px;
    height: 100vh;
    background: #1a2635;
    border-right: 1px solid #2a3f55;
    z-index: 121;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #admin-tipo-tarea-form-panel { left: calc(var(--sb-w-open) + 420px); }
#admin-tipo-tarea-form-panel.hidden { display: none; }

#admin-tipo-tarea-form-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 14px;
    color: #e0eaf4;
    border-bottom: 1px solid #2a3f55;
    flex-shrink: 0;
}

#admin-tipo-tarea-form-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px 20px 16px;
}
#admin-tipo-tarea-form-body .prod-field {
    margin-bottom: 16px;
}
#admin-tipo-tarea-form-body .prod-field label {
    font-size: 12px;
    margin-bottom: 5px;
}

#admin-tipo-tarea-form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 12px;
}

/* ─── Configuración de empresa panel ──────────────────────────────────────── */
#cfg-panel {
    position: fixed;
    top: 8px;
    left: calc(var(--sb-w) + 8px);
    width: 300px;
    background: #1e2a38;
    border: 1px solid #2a3f55;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #cfg-panel { left: calc(var(--sb-w-open) + 8px); }
#cfg-panel.hidden { display: none; }

#cfg-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    font-weight: 600;
    font-size: 13px;
    color: #e8f0fe;
    border-bottom: 1px solid #2a3f55;
}
#cfg-panel-body {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.cfg-radio-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 6px;
}
.cfg-radio-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #c8d8e8;
    cursor: pointer;
}
.cfg-radio-label input[type="radio"] {
    accent-color: #4fa3e0;
    width: 15px;
    height: 15px;
}
.cfg-radio-label input:disabled { opacity: 0.4; cursor: not-allowed; }
.cfg-readonly {
    font-size: 11px;
    color: #8fa8bf;
    line-height: 1.4;
}
.cfg-msg {
    font-size: 12px;
    min-height: 16px;
    line-height: 1.4;
}
.cfg-msg-ok    { color: #81c995; }
.cfg-msg-error { color: #e57373; }

/* ── Eventos de cultivo ───────────────────────────────────────────────────── */
.prod-evt-section {
    border-top: 1px solid rgba(255,255,255,0.06);
    padding: 6px 0 2px 0;
}
.prod-cultivo-nota {
    padding: 6px 12px 6px 48px;
    font-size: 12px;
    color: #475569;
    font-style: italic;
    border-bottom: 1px solid #f1f5f9;
}
.prod-nota-icon {
    margin-right: 4px;
}
.evf-siembra-section {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 4px;
}
.evf-siembra-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.evf-siembra-label {
    font-size: 12px;
    font-weight: 600;
    color: #e8edf3;
}
.evf-siembra-inputs {
    display: flex;
    gap: 6px;
}
.evf-siembra-inputs input,
.evf-siembra-inputs select {
    background: #0d1b2a;
    color: #cdd9e5;
    border: 1px solid #2a3f55;
    border-radius: 6px;
    padding: 5px 7px;
    font-size: 13px;
    width: auto !important;
}
.evf-siembra-inputs input { flex: 1; min-width: 0; }
.evf-siembra-inputs select { flex: 0 0 110px; }
.prod-evt-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px 4px 48px;
}
.prod-evt-section-title {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8fa8bf;
}
.prod-evt-add-btn {
    width: 18px;
    height: 18px;
    font-size: 14px;
    line-height: 1;
    padding: 0;
}
.prod-evt-empty {
    padding: 2px 12px 4px 48px;
    font-size: 11px;
    color: #5a7a98;
}

/* Event row — flex layout matching prod-sub-row so Gantt tracks align */
.prod-evt-row {
    display: flex;
    align-items: center;
    padding: 3px 10px 3px 12px;
    min-height: 26px;
    font-size: 12px;
    gap: 0;
}
.prod-evt-row:hover { background: rgba(255,255,255,0.03); }
.prod-evt-info {
    flex: 1;
    min-width: 200px;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    padding-right: 4px;
}
.prod-evt-badge {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
    flex-shrink: 0;
}
.prod-evt-date {
    color: #c8dce8;
    font-size: 11px;
    white-space: nowrap;
    flex-shrink: 0;
}
.prod-evt-notes {
    color: #8fa8bf;
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.prod-evt-order-link {
    font-size: 10px;
    color: #4fa3e0;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}
.prod-evt-order-link:hover { text-decoration: underline; }
.prod-evt-file-chip {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    background: rgba(255,255,255,0.06);
    border-radius: 3px;
    padding: 0 4px;
    font-size: 10px;
    flex-shrink: 0;
}
.prod-evt-file-chip .prod-evt-file-dl {
    color: #4fa3e0;
    text-decoration: none;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.prod-evt-file-chip .prod-evt-file-del {
    background: none; border: none; color: #5a7a98;
    cursor: pointer; font-size: 9px; padding: 0 1px;
}
.prod-evt-file-chip .prod-evt-file-del:hover { color: #e94560; }

/* Edit / delete action buttons */
.prod-evt-row-actions {
    width: 54px;
    flex-shrink: 0;
    display: flex;
    gap: 2px;
    justify-content: flex-end;
    opacity: 0;
    transition: opacity .15s;
}
.prod-evt-row:hover .prod-evt-row-actions { opacity: 1; }
.prod-evt-edit-btn, .prod-evt-del-btn {
    background: none; border: none; cursor: pointer;
    font-size: 12px; padding: 1px 4px; border-radius: 3px;
    color: #5a7a98; transition: color .15s;
}
.prod-evt-edit-btn:hover { color: #4fa3e0; }
.prod-evt-del-btn:hover  { color: #e94560; }

/* Inline create/edit form */
.prod-evt-form {
    padding: 6px 12px 6px 48px;
    border-top: 1px solid rgba(255,255,255,0.05);
}
.prod-evt-form-row {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}
.prod-evt-tipo-sel,
.prod-evt-fecha-inp,
.prod-evt-notas-inp {
    background: #1e2d3d;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 4px;
    color: #c8dce8;
    font-size: 12px;
    padding: 4px 8px;
}
.prod-evt-tipo-sel  { flex: 1; }
.prod-evt-fecha-inp { width: 130px; flex-shrink: 0; }
.prod-evt-notas-inp {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 6px;
}
.prod-evt-form-files {
    margin-bottom: 6px;
}
.prod-evt-form-filelist { margin-bottom: 4px; }
.prod-evt-form-file-row {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    padding: 1px 0;
}
.prod-evt-form-file-row .prod-evt-file-dl { color: #4fa3e0; text-decoration: none; }
.prod-evt-form-file-row .prod-evt-file-del {
    background: none; border: none; color: #5a7a98;
    cursor: pointer; font-size: 10px;
}
.prod-evt-form-file-row .prod-evt-file-del:hover { color: #e94560; }
.prod-evt-no-files { font-size: 11px; color: #5a7a98; }
.prod-evt-file-upload-btn {
    display: inline-block;
    font-size: 11px;
    color: #4fa3e0;
    cursor: pointer;
    padding: 2px 0;
}
.prod-evt-file-upload-btn:hover { text-decoration: underline; }
.prod-evt-form-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
.prod-evt-form-error {
    flex: 1;
    font-size: 11px;
    color: #e57373;
}
.btn-xs { padding: 3px 10px; font-size: 11px; }

/* ── Variedades de semillas ───────────────────────────────────────────────── */
#admin-variedades-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: 580px; max-width: 100vw;
    height: 100vh;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}
body.sb-open #admin-variedades-panel { left: var(--sb-w-open); }
#admin-variedades-panel.hidden { display: none; }
#admin-variedades-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    border-bottom: 1px solid #e8ecf0;
    font-size: 16px;
    font-weight: 700;
    color: #263238;
}
#admin-variedades-filters {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-bottom: 1px solid #f0f4f8;
    flex-wrap: wrap;
    flex-shrink: 0;
}
#avar-search {
    border: none;
    outline: none;
    font-size: 11px;
    color: #37474f;
    background: transparent;
    width: 110px;
}
#avar-search::placeholder { color: #b0bec5; }
#avar-search-clear {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 11px;
    color: #90a4ae;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
}
#avar-search-clear:hover { color: #546e7a; }
#admin-variedades-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px 16px 16px;
}
/* Variety cards */
.avar-group { margin-bottom: 12px; }
.avar-group-title {
    font-size: 13px; font-weight: 700; color: #263238;
    padding: 6px 0 4px; border-bottom: 1px solid #e8ecf0; margin-bottom: 4px;
}
.avar-group-count { font-weight: 400; color: #8fa8bf; }
.avar-card {
    border: 1px solid #eef2f6; border-radius: 6px;
    margin-bottom: 4px; background: #fafcfe; transition: box-shadow .15s;
}
.avar-card:hover { box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.avar-card-header {
    display: flex; align-items: center;
    padding: 7px 10px; cursor: pointer; font-size: 12px;
}
.avar-card-main {
    width: 260px; min-width: 160px; flex-shrink: 0;
    display: flex; align-items: center; gap: 6px;
    overflow: hidden;
}
.avar-variedad { font-weight: 700; color: #263238; white-space: nowrap; }
.avar-empresa-badge {
    background: #e3f2fd; color: #1565c0; padding: 1px 6px;
    border-radius: 8px; font-size: 10px; font-weight: 600;
    white-space: nowrap; flex-shrink: 0;
}
.avar-card-meta {
    flex: 1; display: flex; align-items: center; gap: 6px;
    color: #5a7a98; font-size: 11px; min-width: 0;
}
.avar-gm {
    width: 90px; min-width: 90px; flex-shrink: 0;
    text-align: center; font-weight: 600;
    padding: 2px 7px; border-radius: 4px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.avar-ciclo {
    width: 65px; min-width: 65px; flex-shrink: 0;
    text-align: right; font-weight: 700; font-size: 13px;
}
.avar-tech {
    width: 90px; min-width: 90px; flex-shrink: 0;
    color: #2a9d8f; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.avar-card-actions {
    width: 50px; flex-shrink: 0;
    display: flex; gap: 2px; justify-content: flex-end;
    opacity: 0; transition: opacity .15s;
}
.avar-card:hover .avar-card-actions { opacity: 1; }
.avar-btn-edit, .avar-btn-del {
    background: none; border: none; cursor: pointer;
    font-size: 12px; padding: 2px 4px; border-radius: 3px;
    color: #5a7a98; transition: color .15s;
}
.avar-btn-edit:hover { color: #4fa3e0; }
.avar-btn-del:hover  { color: #e94560; }

/* Expandable detail */
.avar-card-detail { display: none; padding: 12px 14px; border-top: 1px solid #eef2f6; }
.avar-expanded .avar-card-detail { display: block; }

/* Maturity group badge in card header */
.avar-gm {
    padding: 2px 7px; border-radius: 4px; font-size: 11px; font-weight: 600;
}
.avar-ciclo { font-weight: 700; font-size: 13px; }

/* Phenological bar */
.avar-phenobar {
    position: relative; height: 28px; background: #f0f0f0;
    border-radius: 6px; overflow: hidden; margin-bottom: 4px;
}
.avar-phenobar-bg {
    position: absolute; inset: 0; border-radius: 6px;
}
.avar-pheno-marker {
    position: absolute; top: 0; bottom: 0;
    transform: translateX(-50%); z-index: 1;
}
.avar-phenobar-footer {
    display: flex; justify-content: space-between;
    font-size: 10px; color: #888; margin-bottom: 12px;
}

/* Estadios table */
.avar-estadios-table {
    width: 100%; border-collapse: collapse; font-size: 11px;
    margin-bottom: 14px; table-layout: fixed;
}
.avar-estadios-table th {
    padding: 4px 2px; text-align: center; font-weight: 700;
    font-size: 11px; white-space: nowrap;
}
.avar-estadios-table td {
    padding: 4px 2px; text-align: center; color: #333;
    border-top: 1px solid #f0f0f0;
}
.avar-td-val { font-weight: 600; }
.avar-estadios-label-row td {
    font-size: 9px; color: #aaa; padding: 2px 2px; border-top: none;
}

/* Info grid */
.avar-detail-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px;
}
.avar-detail-field label {
    font-size: 10px; color: #888; font-weight: 700;
    text-transform: uppercase; letter-spacing: .5px;
    margin-bottom: 2px; display: block;
}
.avar-detail-field span { font-size: 12px; color: #333; display: block; }
.avar-notes-text { color: #555; font-style: italic; }

/* GAEZ badges */
.avar-gaez-badge {
    display: inline-block; padding: 1px 6px; margin: 1px 2px;
    border-radius: 8px; font-size: 10px; font-weight: 600;
    background: rgba(42,157,143,0.12); color: #2a9d8f;
}

/* Admin — evento badge en card de tipo de tarea */
.admin-evt-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 600;
    background: rgba(42,157,143,0.25);
    color: #2a9d8f;
    white-space: nowrap;
}

/* ── Cosechas (Harvest data) ─────────────────────────────────────────────── */
#cosechas-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: 640px; max-width: 100vw;
    height: 100vh;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}
body.sb-open #cosechas-panel { left: var(--sb-w-open); }
#cosechas-panel.hidden { display: none; }

#cosechas-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 15px;
    color: #263238;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}
#yield-filters {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}
#yield-list {
    flex: 1;
    overflow-y: auto;
    padding: 0 8px;
}
#yield-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px;
    border-top: 1px solid #f1f5f9;
    flex-shrink: 0;
}
.yield-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    color: #334155;
}
.yield-table thead th {
    font-weight: 600;
    color: #64748b;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    text-align: left;
    padding: 6px 8px;
    border-bottom: 1px solid #e2e8f0;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}
.yield-table td {
    padding: 6px 8px;
    border-bottom: 1px solid #f8fafc;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}
.yield-row:hover td { background: #f8fafc; }
.yield-cell-lote { font-weight: 500; }
.yield-cell-rend { font-weight: 600; color: #2e7d32; }
.yield-cell-actions { white-space: nowrap; }

/* Yield upload form — lateral panel */
#yield-upload-form {
    position: fixed;
    top: 0;
    left: calc(var(--sb-w) + 900px);
    width: 360px;
    height: 100vh;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1201;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    transition: left var(--sb-transition);
}
body.sb-open #yield-upload-form { left: calc(var(--sb-w-open) + 900px); }
#yield-upload-form.hidden { display: none; }

.cosecha-empty {
    padding: 20px;
    text-align: center;
    color: #90a4ae;
    font-size: 13px;
}

.cosecha-card {
    border: 1px solid #e8ecf0;
    border-radius: 8px;
    padding: 10px 12px;
    margin-bottom: 8px;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.cosecha-card:hover { border-color: #b0bec5; }
.cosecha-card.cosecha-active {
    border-color: #2a9d8f;
    box-shadow: 0 0 0 2px rgba(42,157,143,0.15);
}

.cosecha-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
}
.cosecha-card-title {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cosecha-especie {
    font-size: 14px;
    font-weight: 600;
    color: #263238;
}
.cosecha-fecha {
    font-size: 11px;
    color: #78909c;
}
.cosecha-card-meta {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.cosecha-chip {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 8px;
    background: #f0f4f8;
    color: #546e7a;
    font-weight: 600;
}

.cosecha-card-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: 11px;
    color: #90a4ae;
}
.cosecha-maq { font-style: italic; }
.cosecha-pts { flex: 1; text-align: right; }
.cosecha-card-actions { display: flex; gap: 4px; }
.cosecha-btn-map {
    background: none;
    border: 1px solid #cdd3da;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 4px;
    line-height: 1.2;
}
.cosecha-btn-map:hover { background: #e3f0fb; border-color: #2a9d8f; }
.cosecha-active .cosecha-btn-map { background: #e0f2f1; border-color: #2a9d8f; }

#btn-cosecha-upload {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cosecha-upload-status {
    padding: 10px 16px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    flex-shrink: 0;
}
.cosecha-status-info { background: #e3f2fd; color: #1565c0; }
.cosecha-status-ok   { background: #e8f5e9; color: #2e7d32; }
.cosecha-status-err  { background: #ffebee; color: #c62828; }

.cosecha-chip-yield { background: #e8f5e9; color: #2e7d32; font-weight: 700; }

.rx-btn-confirm,
.cosecha-btn-cal {
    background: none;
    border: 1px solid #FF9800;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 4px;
    line-height: 1.2;
    color: #e65100;
}
.rx-btn-confirm:hover,
.cosecha-btn-cal:hover { background: #fff3e0; }

.cosecha-cal-inline {
    border: 1px solid #e0e7ef;
    border-top: none;
    border-radius: 0 0 8px 8px;
    background: #f7fafd;
    padding: 12px;
    margin-top: -8px;
    margin-bottom: 8px;
}
.cosecha-cal-inline.hidden { display: none; }
.cosecha-cal-dialog { padding: 0; }
.cosecha-cal-title {
    font-size: 14px;
    font-weight: 600;
    color: #263238;
    margin-bottom: 8px;
}
.cosecha-cal-match {
    font-size: 12px;
    color: #2e7d32;
    margin-bottom: 10px;
    padding: 6px 8px;
    background: #f1f8e9;
    border-radius: 4px;
}
.cosecha-cal-fields {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
}
.cosecha-cal-field {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 8px;
}
.cosecha-cal-field label {
    font-size: 12px;
    font-weight: 600;
    color: #546e7a;
    text-transform: uppercase;
    margin-bottom: 2px;
}
.cosecha-cal-field input,
.cosecha-cal-select {
    padding: 5px 8px;
    border: 1px solid #cdd3da;
    border-radius: 4px;
    font-size: 13px;
    width: 100%;
    box-sizing: border-box;
}
.cosecha-cal-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

/* ── Prescripciones panel (reuses cosecha card styles) ───────────────────── */
#prescripciones-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: 1000px; max-width: 100vw;
    height: 100vh;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}
body.sb-open #prescripciones-panel { left: var(--sb-w-open); }
#prescripciones-panel.hidden { display: none; }

#prescripciones-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 15px;
    color: #263238;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}

#rx-filters {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}

#rx-list {
    flex: 1;
    overflow-y: auto;
    padding: 0 8px;
}
#rx-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px;
    border-top: 1px solid #f1f5f9;
    flex-shrink: 0;
}

/* Grid rows */
.rx-grid {
    display: grid;
    grid-template-columns: 1.5fr 1.1fr 0.6fr 0.9fr 0.9fr 0.4fr 70px 0.8fr 75px;
    gap: 4px;
    align-items: center;
    padding: 6px 8px;
    font-size: 12px;
    color: #334155;
}
.rx-grid-header {
    font-weight: 600;
    color: #64748b;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: 1px solid #e2e8f0;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}
.rx-grid-row {
    border-bottom: 1px solid #f8fafc;
    cursor: default;
}
.rx-grid-row:hover { background: #f8fafc; }
.rx-grid-row.rx-active { background: #e3f2fd; }
.rx-cell-lote {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rx-tipo-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}
.rx-row-actions {
    display: flex;
    gap: 2px;
    align-items: center;
}
.rx-btn-map, .rx-btn-edit, .rx-btn-del {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    padding: 2px;
    opacity: 0.5;
}
.rx-btn-map:hover, .rx-btn-edit:hover, .rx-btn-del:hover { opacity: 1; }
.rx-empty {
    padding: 32px 16px;
    text-align: center;
    color: #90a4ae;
}
.rx-loading {
    padding: 24px;
    text-align: center;
    color: #90a4ae;
}

/* Grid row cell no-wrap */
.rx-grid-row span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-grid-row .rx-cell-fecha,
.rx-grid-row .rx-cell-dosis { font-size: 11px; }

/* Upload form — separate panel to the right of prescripciones list */
#rx-upload-form {
    position: fixed;
    top: 0;
    left: min(calc(var(--sb-w) + 1000px), calc(100vw - 360px));
    width: 360px;
    max-width: calc(100vw - var(--sb-w));
    height: 100vh;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1201;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    transition: left var(--sb-transition);
}
body.sb-open #rx-upload-form { left: min(calc(var(--sb-w-open) + 1000px), calc(100vw - 360px)); }
#rx-upload-form.hidden { display: none; }
.rx-form-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 14px;
    color: #1a2635;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}
.rx-form-body {
    padding: 16px;
    flex: 1;
}
.rx-form-body .prod-field {
    margin-bottom: 12px;
}
.rx-form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}
.rx-file-btn {
    display: inline-block;
    cursor: pointer;
    align-self: flex-start;
    padding: 5px 12px;
    font-size: 12px;
    border: 1px solid #dde3ea;
    border-radius: 6px;
    background: #fff;
    color: #1565c0;
}
.rx-file-btn:hover { background: #f0f4f8; }
.rx-file-name {
    font-size: 11px;
    color: #64748b;
    margin-top: 4px;
}
.rx-up-status {
    font-size: 12px;
    padding: 4px 0;
}
.rx-status-info { color: #1976d2; }
.rx-status-ok { color: #2e7d32; }
.rx-status-err { color: #c62828; }

/* ── Ganadería ─────────────────────────���─────────────────────────────────── */
#ganaderia-panel,
#ganaderia-detail-panel,
#ganaderia-lote-detail-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: 500px; max-width: 100vw;
    height: 100vh;
    background: #fff;
    box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}
body.sb-open #ganaderia-panel,
body.sb-open #ganaderia-detail-panel,
body.sb-open #ganaderia-lote-detail-panel { left: var(--sb-w-open); }
#ganaderia-panel.hidden,
#ganaderia-detail-panel.hidden,
#ganaderia-lote-detail-panel.hidden { display: none; }

#ganaderia-detail-panel { left: calc(var(--sb-w) + 500px); z-index: 1201; }
body.sb-open #ganaderia-detail-panel { left: calc(var(--sb-w-open) + 500px); }
#ganaderia-lote-detail-panel { left: calc(var(--sb-w) + 1000px); z-index: 1202; width: 400px; }
body.sb-open #ganaderia-lote-detail-panel { left: calc(var(--sb-w-open) + 1000px); }

#ganaderia-header,
#ganaderia-detail-header,
#ganaderia-lote-detail-header,
#ganaderia-lote-form-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 14px 16px; font-weight: 600; font-size: 15px; color: #263238;
    border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}

#ganaderia-list,
#ganaderia-lotes-list,
#ganaderia-lote-eventos-list,
#ganaderia-lote-evento-form {
    flex: 1; overflow-y: auto; padding: 12px;
}

.gan-new-form {
    display: flex; flex-direction: column; gap: 0;
    padding: 12px; border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}
.gan-new-form.hidden { display: none; }
.gan-new-form input, .gan-new-form select {
    width: 100%; padding: 6px 9px; font-size: 13px;
    border: 1px solid #cdd3da; border-radius: 5px;
    box-sizing: border-box;
}
.gan-new-form input:focus, .gan-new-form select:focus { outline: none; border-color: #2a9d8f; }
.gan-add-cat-form {
    display: flex; gap: 6px; align-items: center;
    padding: 8px 12px; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
.gan-add-cat-form.hidden { display: none; }
.gan-add-cat-form select { flex: 1; padding: 6px 9px; font-size: 13px; border: 1px solid #cdd3da; border-radius: 5px; }

/* ── Rentabilidad Ganadera ────────────────────────────────────────────────── */
.rent-panel { padding: 0; }
.rent-filters {
    display: flex; gap: 8px; align-items: center; padding: 10px 16px;
    border-bottom: 1px solid #e8ecf0; flex-shrink: 0; position: relative;
    flex-wrap: wrap;
}
.rent-filters input[type="date"] {
    padding: 4px 6px; font-size: 11px; border: 1px solid #cdd3da;
    border-radius: 4px; width: 120px;
}
.rent-filters select {
    padding: 4px 6px; font-size: 11px; border: 1px solid #cdd3da;
    border-radius: 4px;
}
.rent-filters .prod-filter-panel {
    position: absolute; top: 100%; left: 0; min-width: 280px; max-height: 300px;
}

.rent-summary-cards { display: flex; gap: 12px; padding: 16px; }
.rent-card {
    flex: 1; padding: 12px; border-radius: 8px; background: #f8fafc;
    border: 1px solid #e8ecf0; display: flex; flex-direction: column; align-items: center;
}
.rent-card-label { font-size: 10px; color: #78909c; text-transform: uppercase; font-weight: 600; }
.rent-card-val { font-size: 20px; font-weight: 700; color: #263238; margin: 4px 0; }
.rent-card-sub { font-size: 11px; color: #78909c; }

.rent-section { padding: 12px 16px; border-bottom: 1px solid #f0f4f8; }
.rent-section-title { font-size: 12px; font-weight: 700; color: #2a9d8f; text-transform: uppercase; margin-bottom: 8px; }
.rent-section-highlight { background: #f8fafc; }

.rent-kv { display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; font-size: 12px; color: #546e7a; }
.rent-kv-wide { grid-template-columns: 1fr auto; }
.rent-kv .rv { text-align: right; font-weight: 500; color: #263238; }
.rent-kv-sep { grid-column: 1 / -1; border-top: 1px solid #e8ecf0; margin-top: 2px; padding-top: 4px; }
.rent-kv-total { font-weight: 700 !important; color: #263238 !important; border-top: 1px solid #e8ecf0; padding-top: 4px; margin-top: 4px; }

.rent-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.rent-table th { text-align: left; padding: 4px 8px; border-bottom: 1px solid #e8ecf0; color: #78909c; font-size: 10px; text-transform: uppercase; }
.rent-table td { padding: 4px 8px; border-bottom: 1px solid #f0f4f8; }

#rentabilidad-gan-panel {
    position: fixed; top: 0; left: calc(var(--sb-w) + 500px);
    width: 780px; max-width: 100vw; height: 100vh;
    background: #fff; box-shadow: 2px 0 12px rgba(0,0,0,0.12);
    z-index: 1201; display: flex; flex-direction: column;
    transition: left var(--sb-transition);
}
body.sb-open #rentabilidad-gan-panel { left: calc(var(--sb-w-open) + 500px); }
#rentabilidad-gan-panel.hidden { display: none; }
#rentabilidad-gan-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 14px 16px; font-weight: 600; font-size: 15px; color: #263238;
    border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
#rentabilidad-gan-body { flex: 1; overflow-y: auto; }

.costos-row-inactive { opacity: 0.4; }
.costos-row-inactive td { text-decoration: line-through; }
.rec-icon { font-size: 14px; }
.rent-info { cursor: help; color: #90a4ae; font-size: 11px; margin-left: 2px; }
.rent-info:hover { color: #2a9d8f; }
.rent-footer { padding: 8px 16px; font-size: 10px; color: #90a4ae; border-top: 1px solid #e8ecf0; }

/* ── Balance Forrajero ────────────────────────────────────────────────────── */
/* ── Costos panel ────────────────────────────────────────────────────────── */
#costos-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: calc(100vw - var(--sb-w));
    max-width: 1200px;
    height: 100vh;
    background: #fff;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition), width var(--sb-transition);
}
#costos-form-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: 720px;
    height: 100vh;
    background: #fff;
    z-index: 1250;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition);
}
#costos-form-panel { z-index: 1250; width: 900px; border-right: 1px solid #e0e0e0; box-shadow: 2px 0 8px rgba(0,0,0,.08); }
body.sb-open #costos-panel { left: var(--sb-w-open); width: calc(100vw - var(--sb-w-open)); }
body.sb-open #costos-form-panel { left: var(--sb-w-open); }
#costos-panel.hidden, #costos-form-panel.hidden { display: none; }

#costos-header, #costos-form-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px 16px; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
    font-weight: 600; font-size: 15px;
}
#costos-tabs {
    display: flex; gap: 0; border-bottom: 1px solid #e8ecf0; flex-shrink: 0; padding: 0 16px;
}
.costos-tab {
    flex: 1; padding: 10px; text-align: center; font-size: 13px; font-weight: 600;
    background: none; border: none; border-bottom: 2px solid transparent;
    color: #78909c; cursor: pointer; transition: all 0.15s;
}
.costos-tab.active { color: #2a9d8f; border-bottom-color: #2a9d8f; }
.costos-tab:hover:not(.active) { color: #263238; }
#costos-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
#costos-form-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
#costos-form-body .prod-field { margin-bottom: 14px; }
#costos-form-body .prod-field label { margin-bottom: 4px; display: block; font-size: 12px; font-weight: 500; color: #455a64; }
#costos-form-body .prod-field input,
#costos-form-body .prod-field select,
#costos-form-body .prod-field textarea { width: 100%; font-size: 13px; padding: 8px 10px; border: 1px solid #cfd8dc; border-radius: 4px; box-sizing: border-box; }

.costos-toolbar { margin-bottom: 10px; display: flex; gap: 8px; }
.costos-filters {
    display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
    padding: 8px 20px; border-bottom: 1px solid #f0f4f8; flex-shrink: 0;
}
.costos-filters input[type="date"] {
    font-size: 11px; padding: 4px 8px; border: 1px solid #dde3ea;
    border-radius: 14px; background: #fff; color: #546e7a;
}
.costos-filter-clear {
    font-size: 11px; color: #2a9d8f; cursor: pointer; background: none;
    border: none; font-weight: 600;
}
.costos-filter-clear:hover { color: #1a7a6e; }
.costos-pager {
    display: flex; justify-content: center; align-items: center; gap: 6px;
    padding: 8px; border-top: 1px solid #f0f4f8; flex-shrink: 0;
}
.costos-pager button {
    background: none; border: 1px solid #cfd8dc; border-radius: 4px;
    padding: 4px 8px; font-size: 11px; cursor: pointer; color: #455a64;
}
.costos-pager button:hover { background: #f5f7fa; }
.costos-pager button.active { background: #2a9d8f; color: #fff; border-color: #2a9d8f; }
.costos-pager button:disabled { opacity: 0.4; cursor: default; }
.costos-pager-info { font-size: 11px; color: #78909c; }
.costos-row-actions {
    white-space: nowrap;
}
.costos-row-actions button {
    background: none; border: none; cursor: pointer; font-size: 12px;
    padding: 2px 4px; opacity: 0.5; border-radius: 4px;
}
.costos-row-actions button:hover { opacity: 1; background: #f0f4f8; }
.costos-monto-secondary { font-size: 10px; color: #78909c; }
.costos-empty { color: #90a4ae; text-align: center; padding: 40px; font-size: 13px; }
.costos-add-menu {
    position: absolute; right: 50px; top: 40px; z-index: 100;
    background: #fff; border: 1px solid #e0e0e0; border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,.12); overflow: hidden;
}
.costos-add-option {
    display: block; width: 100%; padding: 10px 16px; border: none;
    background: none; text-align: left; font-size: 13px; cursor: pointer;
    white-space: nowrap;
}
.costos-add-option:hover { background: #f5f7fa; }
.costos-ai-success {
    background: #e8f5e9; color: #2e7d32; padding: 8px 12px; border-radius: 4px;
    font-size: 12px; margin-bottom: 12px;
}
.costos-ai-warning {
    background: #fff3e0; color: #e65100; padding: 8px 12px; border-radius: 4px;
    font-size: 12px; margin-bottom: 12px;
}
.costos-loading-spinner {
    width: 32px; height: 32px; border: 3px solid #e0e0e0;
    border-top-color: #1565c0; border-radius: 50%;
    animation: costos-spin 0.8s linear infinite; margin: 0 auto;
}
@keyframes costos-spin { to { transform: rotate(360deg); } }

.costos-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.costos-table th { text-align: left; padding: 6px 8px; border-bottom: 2px solid #e8ecf0; color: #78909c; font-weight: 600; font-size: 10px; text-transform: uppercase; }
.costos-table td { padding: 6px 8px; border-bottom: 1px solid #f0f4f8; }
.costos-row { cursor: pointer; }
.costos-row:hover td { background: #f5f7fa; }

.costos-estado { font-size: 10px; padding: 2px 6px; border-radius: 3px; font-weight: 600; }
.costos-st-ok { background: #e8f5e9; color: #2e7d32; }
.costos-st-partial { background: #fff3e0; color: #e65100; }
.costos-st-pending { background: #eceff1; color: #546e7a; }

.costos-detail { padding: 4px; }
.costos-detail h3 { font-size: 14px; margin: 8px 0; }
.costos-detail-meta { font-size: 12px; color: #546e7a; margin-bottom: 12px; }

/* Gasto cards in detail view */
.costos-gasto-card { border: 1px solid #e8ecf0; border-radius: 6px; margin-bottom: 8px; overflow: hidden; }
.costos-gasto-line {
    display: grid;
    grid-template-columns: minmax(120px, 1.5fr) minmax(120px, 1.5fr) 70px 100px 70px 30px;
    align-items: center; gap: 6px; padding: 8px 10px;
    background: #f7f9fb; font-size: 12px;
}
.cgl-desc { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cgl-cuenta { font-size: 11px; padding: 4px 6px; border: 1px solid #cfd8dc; border-radius: 3px; width: 100%; box-sizing: border-box; }
.cgl-cantuni { color: #78909c; font-size: 11px; text-align: center; }
.cgl-monto { white-space: nowrap; text-align: right; }

/* Assignment list */
.costos-asig-list { padding: 6px 12px; border-top: 1px solid #e8ecf0; }
.costos-asig-row { display: flex; gap: 12px; font-size: 11px; padding: 3px 0; color: #455a64; }
.costos-asig-row span:first-child { flex: 1; }

/* Assignment controls */
.costos-asig-controls { padding: 8px 12px; border-top: 1px solid #e8ecf0; }
.costos-asig-panel { margin-top: 8px; padding: 10px; background: #fafbfc; border-radius: 4px; border: 1px solid #e0e7ef; }
.costos-asig-mode { display: flex; gap: 12px; font-size: 12px; margin-bottom: 8px; }
.costos-asig-mode label { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.costos-asig-destinos { margin-bottom: 8px; }
.costos-dest-row { display: flex; gap: 6px; align-items: center; margin-bottom: 4px; }
.costos-dest-row select, .costos-dest-row input { font-size: 11px; padding: 4px 6px; border: 1px solid #cfd8dc; border-radius: 3px; }
.costos-dest-row select { flex: 1; min-width: 0; }
.costos-detail-table td { font-size: 11px; }

/* Gasto line form */
.cf-gasto-row { margin-bottom: 6px; padding: 6px 8px; background: #f7f9fb; border-radius: 4px; border: 1px solid #e8ecf0; }
.cf-gasto-fields { display: flex; gap: 4px; align-items: center; flex-wrap: nowrap; }
.cf-gasto-fields input, .cf-gasto-fields select { font-size: 11px; padding: 5px 6px; border: 1px solid #cfd8dc; border-radius: 3px; }
.cf-gasto-fields .cf-g-desc { flex: 2; min-width: 0; }
.cf-gasto-fields .cf-g-cuenta { flex: 2; min-width: 0; }
.cf-gasto-fields .cf-g-cant { width: 60px; flex: 0 0 60px; }
.cf-gasto-fields .cf-g-uni { width: 65px; flex: 0 0 65px; }
.cf-gasto-fields .cf-g-pu { width: 70px; flex: 0 0 70px; }
.cf-gasto-fields .cf-g-monto { width: 80px; flex: 0 0 80px; }
.cf-g-remove { background: none; border: none; cursor: pointer; color: #e53935; font-size: 14px; padding: 2px 4px; flex: 0 0 auto; }
.cf-g-asig-toggle { background: none; border: 1px solid #cfd8dc; cursor: pointer; color: #78909c; font-size: 10px; padding: 2px 6px; border-radius: 3px; flex: 0 0 auto; }
.cf-g-asig-toggle:hover { border-color: #2a9d8f; color: #2a9d8f; }
.cf-asig-panel { margin: 6px 0 4px; padding: 8px 10px; background: #fafbfc; border: 1px solid #e0e7ef; border-radius: 4px; }
.costos-form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid #e8ecf0; }

/* Report tab */
.rep-filters { margin-bottom: 12px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.rep-period-pills { display: flex; gap: 4px; align-items: center; }
.rep-pill {
    padding: 5px 12px; border: 1px solid #cfd8dc; border-radius: 16px;
    background: #fff; font-size: 11px; font-weight: 600; cursor: pointer; color: #546e7a;
}
.rep-pill.active { background: #2a9d8f; color: #fff; border-color: #2a9d8f; }
.rep-pill:hover { border-color: #2a9d8f; }
.rep-date { font-size: 11px; padding: 4px 8px; border: 1px solid #dde3ea; border-radius: 14px; }
.rep-moneda-select {
    font-size: 11px; padding: 5px 10px; border: 1px solid #dde3ea;
    border-radius: 14px; background: #fff; color: #546e7a; font-weight: 600;
    cursor: pointer;
}
.rep-filter-pills { display: flex; gap: 6px; align-items: center; }
.rep-filter-pills > div { position: relative; display: inline-block; }
.rep-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px; }
.rep-card {
    background: #f7f9fb; border: 1px solid #e8ecf0; border-radius: 6px;
    padding: 12px 14px; text-align: center;
}
.rep-card-label { font-size: 10px; color: #78909c; text-transform: uppercase; font-weight: 600; margin-bottom: 4px; }
.rep-card-value { font-size: 16px; font-weight: 700; color: #263238; }
.rep-card-value small { font-size: 11px; color: #90a4ae; font-weight: 400; }
.rep-chart-wrap { height: 280px; margin-bottom: 20px; }
#costos-body h4 { font-size: 13px; color: #455a64; margin: 16px 0 8px; border-bottom: 1px solid #e8ecf0; padding-bottom: 4px; }

#balance-forrajero-panel {
    position: fixed;
    top: 0; left: calc(var(--sb-w) + 0px);
    width: calc(100vw - var(--sb-w));
    height: 100vh;
    background: #fff;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: left var(--sb-transition), width var(--sb-transition);
}
body.sb-open #balance-forrajero-panel { left: var(--sb-w-open); width: calc(100vw - var(--sb-w-open)); }
#balance-forrajero-panel.hidden { display: none; }

#bf-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px 16px; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
.bf-header-left { display: flex; align-items: center; gap: 12px; }
.bf-header-left > span { font-weight: 600; font-size: 15px; color: #263238; }
.bf-plan-select {
    padding: 4px 8px; font-size: 12px; border: 1px solid #cdd3da;
    border-radius: 4px; max-width: 180px;
}
.bf-plan-nombre-wrap {
    display: flex; align-items: center; gap: 6px;
}
.bf-plan-nombre-wrap label {
    font-size: 11px; font-weight: 600; color: #546e7a; white-space: nowrap;
}
.bf-plan-nombre {
    padding: 4px 8px; font-size: 13px; border: 1px solid #cdd3da;
    border-radius: 4px; width: 160px;
}
.bf-plan-del {
    background: none; border: none; cursor: pointer;
    font-size: 13px; color: #ccc; padding: 2px 4px; line-height: 1;
}
.bf-plan-del:hover { color: #e53935; }
.bf-plan-loading {
    display: inline-block; width: 14px; height: 14px;
    border: 2px solid #e8ecf0; border-top-color: #2a9d8f;
    border-radius: 50%; animation: bf-spin 0.6s linear infinite;
}
.bf-plan-loading.hidden { display: none; }
@keyframes bf-spin { to { transform: rotate(360deg); } }

#bf-filters {
    display: flex; gap: 8px; align-items: center; padding: 10px 16px;
    border-bottom: 1px solid #e8ecf0; flex-shrink: 0; position: relative;
}
.bf-region-select {
    padding: 5px 8px; font-size: 12px; border: 1px solid #cdd3da;
    border-radius: 4px; min-width: 180px;
}
.bf-filter-label {
    font-size: 11px; font-weight: 600; color: #546e7a; white-space: nowrap;
}
#btn-bf-calc { white-space: nowrap; }
#btn-bf-calc.bf-btn-dirty {
    animation: bf-pulse 1.5s ease-in-out infinite;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.3);
}
@keyframes bf-pulse {
    0%, 100% { box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.3); }
    50% { box-shadow: 0 0 0 4px rgba(25, 118, 210, 0.15); }
}
#bf-filters .prod-filter-panel {
    position: absolute; top: 100%; left: 0; min-width: 280px; max-height: 300px;
}
.bf-check-label {
    font-size: 11px; display: flex; align-items: center; gap: 4px;
    cursor: pointer; white-space: nowrap;
}
.bf-check-child { padding-left: 24px; }
.bf-check-meta { color: #90a4ae; }
.bf-group { margin-bottom: 2px; }

#bf-table-wrap { flex: 1; overflow: auto; padding: 0; }
.bf-table {
    width: 100%; border-collapse: collapse; font-size: 12px;
}
.bf-table th {
    position: sticky; top: 0; background: #f7f9fb;
    padding: 8px 10px; text-align: center; font-size: 10px;
    font-weight: 700; color: #546e7a; text-transform: uppercase;
    border-bottom: 2px solid #e0e7ef;
}
.bf-th-name { text-align: left; min-width: 200px; }
.bf-section-row td { padding: 6px 10px; }
.bf-section-label {
    font-size: 11px; font-weight: 700; color: #2a9d8f;
    text-transform: uppercase; border-top: 1px solid #e8ecf0;
}
.bf-row-lote td, .bf-row-rodeo td { padding: 5px 10px; border-bottom: 1px solid #f0f4f8; }
.bf-cell-name { text-align: left; display: flex; align-items: center; gap: 4px; }
.bf-cell-name .bf-lote-info { display: flex; flex-direction: column; }
.bf-lote-name { font-weight: 500; color: #263238; }
.bf-lote-meta { font-size: 10px; color: #90a4ae; }
.bf-cell-num { text-align: right; font-variant-numeric: tabular-nums; }
.bf-cell-total { font-weight: 600; background: #f7f9fb; }
.bf-subtotal-row td { padding: 6px 10px; border-top: 1px solid #cdd3da; background: #f7f9fb; }
.bf-balance-row td {
    padding: 8px 10px; border-top: 2px solid #263238;
    font-size: 13px;
}
.bf-deficit { color: #c62828; background: #ffebee; }
.bf-superavit { color: #2e7d32; background: #e8f5e9; }
.bf-equilibrio { color: #f57c00; background: #fff3e0; }

/* Expandable lote rows */
.bf-row-expandable { cursor: pointer; }
.bf-row-expandable:hover td { background: #f5f8fa; }
.bf-expand-btn {
    background: none; border: none; cursor: pointer; color: #b0bec5;
    padding: 2px; flex-shrink: 0; width: 20px; height: 20px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 4px; transition: color .15s, background .15s;
    vertical-align: middle; margin-right: 2px;
}
.bf-expand-btn svg { width: 14px; height: 14px; transition: transform .18s ease; }
.bf-expand-btn:hover { color: #1565C0; background: #e3f0fb; }
.bf-expand-btn.expanded svg { transform: rotate(90deg); }
.bf-row-loading td { opacity: 0.5; pointer-events: none; }
.bf-row-loading .bf-cell-name::after {
    content: ''; display: inline-block; width: 12px; height: 12px;
    border: 2px solid #e8ecf0; border-top-color: #2a9d8f;
    border-radius: 50%; animation: bf-spin 0.6s linear infinite;
    margin-left: 8px; vertical-align: middle;
}
.bf-bim-inicio {
    padding: 4px 6px; font-size: 12px; border: 1px solid #cdd3da;
    border-radius: 4px;
}
.bf-anio-inicio {
    padding: 4px 6px; font-size: 12px; border: 1px solid #cdd3da;
    border-radius: 4px; width: 70px;
}

/* Pregnancy detail row */
.bf-row-preg-detail td { background: #fef8f0; }
.bf-row-preg-detail .bf-detail-name-cell { padding: 6px 10px !important; }
.bf-preg-header { font-weight: 500; color: #5d4037; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
.bf-preg-dates { font-size: 10px; color: #8d6e63; margin: 1px 0; }
.bf-preg-icon {
    display: inline-block; background: #ff9800; color: #fff;
    font-size: 11px; font-weight: 700; width: 18px; height: 18px;
    line-height: 18px; text-align: center; border-radius: 50%;
    vertical-align: middle; margin-left: 4px;
}
.bf-expand-arrow { font-size: 9px; color: #90a4ae; margin-right: 2px; cursor: pointer; }
.bf-info-popup {
    position: absolute; z-index: 100; background: #263238; color: #fff;
    padding: 8px 12px; border-radius: 6px; font-size: 11px; line-height: 1.5;
    max-width: 320px; box-shadow: 0 2px 8px rgba(0,0,0,.3); margin-top: 4px;
}
.bf-preg-info-btn { margin-left: 4px; }

/* Detail row — vertical bars aligned with bimestre columns */
.bf-row-detail td { border-bottom: 1px solid #e0e7ef; background: #fafbfc; }
.bf-detail-name-cell {
    padding: 6px 10px !important; vertical-align: top;
}
.bf-detail-bim-cell {
    padding: 4px 2px !important; text-align: center; vertical-align: bottom;
}
.bf-vbar-wrap {
    display: flex; align-items: flex-end; justify-content: center;
    margin: 0 auto 3px;
}
.bf-vbar {
    width: 16px; border-radius: 2px 2px 0 0;
    transition: height 0.3s ease;
}
.bf-detail-tasa {
    font-size: 10px; font-weight: 700; color: #263238;
    text-align: center; line-height: 1.2;
}
.bf-detail-unit { font-weight: 400; font-size: 7px; color: #90a4ae; }
.bf-detail-factor {
    font-size: 8px; font-weight: 600; color: #f57c00;
    text-align: center; line-height: 1;
}
.bf-detail-recurso {
    font-size: 7px; color: #78909c;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    text-align: center; max-width: 80px; margin: 0 auto;
}
.bf-detail-control {
    display: flex; flex-direction: column; gap: 2px; margin-bottom: 6px;
}
.bf-detail-control label {
    font-size: 9px; font-weight: 600; color: #90a4ae; text-transform: uppercase;
}
.bf-detail-control select {
    padding: 3px 6px; font-size: 11px;
    border: 1px solid #cdd3da; border-radius: 4px; background: #fff;
    width: 100%; max-width: 200px;
}

.gan-tabs {
    display: flex; gap: 0; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
.gan-tab {
    flex: 1; padding: 10px; text-align: center; font-size: 12px; font-weight: 600;
    background: none; border: none; border-bottom: 2px solid transparent;
    color: #78909c; cursor: pointer; transition: all 0.15s;
}
.gan-tab.active { color: #2a9d8f; border-bottom-color: #2a9d8f; }
.gan-tab:hover:not(.active) { color: #263238; }
#gan-detail-tabs { display: flex; gap: 0; border-bottom: 1px solid #e8ecf0; flex-shrink: 0; }

/* Events timeline */
.gan-evt-card {
    padding: 8px 12px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 12px;
}
.gan-evt-card:hover { background: #f8fafc; }
.gan-evt-header {
    display: flex;
    align-items: center;
    gap: 6px;
}
.gan-evt-icon { font-size: 16px; flex-shrink: 0; }
.gan-evt-tipo { font-weight: 600; color: #263238; }
.gan-evt-fecha { color: #78909c; font-size: 11px; margin-left: auto; }
.gan-evt-detail {
    margin-top: 4px;
    padding-left: 26px;
    color: #546e7a;
    font-size: 11px;
}
.gan-evt-reverted { opacity: 0.4; text-decoration: line-through; }
.gan-evt-actions { margin-left: auto; }
.gan-evt-actions button {
    background: none; border: none; cursor: pointer;
    font-size: 11px; color: #90a4ae; padding: 2px 4px;
}
.gan-evt-actions button:hover { color: #e53935; }

/* Event type picker (wizard step 1) */
.gan-evt-picker {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 12px;
}
.gan-evt-picker-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 12px 8px;
    border: 1px solid #e0e7ef;
    border-radius: 8px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
    color: #546e7a;
    transition: all 0.12s;
}
.gan-evt-picker-card:hover { border-color: #2a9d8f; color: #2a9d8f; background: rgba(42,157,143,0.04); }
.gan-evt-picker-icon { font-size: 24px; }

/* Event form (wizard step 2) */
.gan-evt-form {
    padding: 12px 14px;
}
.gan-evt-form .prod-field {
    margin-bottom: 12px;
}
.gan-evt-form .prod-field label {
    margin-bottom: 4px;
}
.gan-evt-form-title {
    font-size: 13px;
    font-weight: 700;
    color: #263238;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.gan-evt-form-back {
    background: none; border: none; cursor: pointer;
    font-size: 16px; color: #78909c; padding: 0 4px;
}
.gan-evt-form-back:hover { color: #263238; }
.gan-nacimiento-row {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 6px;
}
.gan-nacimiento-row select {
    flex: 1; min-width: 0;
    padding: 5px 7px;
    font-size: 12px;
    border: 1px solid #cfd8dc;
    border-radius: 6px;
    background: #fff;
    color: #263238;
}
.gan-nacimiento-row input {
    width: 70px; flex-shrink: 0;
    padding: 5px 7px;
    font-size: 12px;
    border: 1px solid #cfd8dc;
    border-radius: 6px;
    background: #fff;
    color: #263238;
}
.gan-nacimiento-row .ge-nac-del {
    background: none; border: none; cursor: pointer;
    color: #c62828; font-size: 14px; padding: 2px 4px; opacity: 0.5;
    flex-shrink: 0;
}
.gan-nacimiento-row .ge-nac-del:hover { opacity: 1; }
.gan-evt-form .evt-add-btn {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 4px 0; color: #2a9d8f; font-size: 12px;
    font-weight: 600; cursor: pointer; border: none; background: none;
}
.gan-evt-form .evt-add-btn:hover { color: #1a7a6e; }

.gan-asset-form {
    padding: 12px; border: 1px solid #e0e7ef; border-radius: 8px;
    background: #f7fafd; margin-top: 8px;
}
.gan-asset-form.hidden { display: none; }
.gan-asset-form .prod-field { margin-bottom: 12px; }
.gan-asset-form select {
    width: 100%; padding: 6px 9px; font-size: 13px;
    border: 1px solid #cdd3da; border-radius: 5px;
}

.gan-rodeo-card {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px; border: 1px solid #e8ecf0; border-radius: 8px;
    margin-bottom: 8px; cursor: pointer; transition: border-color 0.15s;
}
.gan-rodeo-card:hover { border-color: #2a9d8f; }
.gan-rodeo-info { display: flex; flex-direction: column; gap: 2px; }
.gan-rodeo-nombre { font-size: 14px; font-weight: 600; color: #263238; }
.gan-rodeo-desc { font-size: 11px; color: #78909c; }
.gan-rodeo-meta { display: flex; gap: 4px; }
.gan-rodeo-actions { display: flex; gap: 2px; margin-left: 8px; flex-shrink: 0; }
.gan-action-btn {
    background: none; border: none; cursor: pointer; color: #b0bec5;
    font-size: 13px; padding: 2px 5px; border-radius: 3px; opacity: 0.7;
}
.gan-action-btn:hover { opacity: 1; background: #f0f4f8; }
.gan-lote-del:hover, .gan-rodeo-del:hover { background: #ffebee; color: #e53935; }
.gan-lote-actions { display: flex; gap: 2px; }

#ganaderia-detail-summary {
    padding: 12px 16px; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
.gan-summary {
    display: flex; gap: 16px; padding: 12px 16px;
    border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
.gan-summary-item { display: flex; flex-direction: column; }
.gan-summary-val { font-size: 18px; font-weight: 700; color: #263238; }
.gan-summary-label { font-size: 10px; color: #78909c; text-transform: uppercase; }
.gan-detail-summary-row { display: flex; align-items: center; gap: 12px; }
.gan-summary-tags { display: flex; gap: 6px; align-items: center; }

.gan-lote-card {
    border: 1px solid #e8ecf0; border-radius: 8px;
    padding: 10px 12px; margin-bottom: 8px;
    cursor: pointer; transition: border-color 0.15s;
}
.gan-lote-card:hover { border-color: #2a9d8f; }
.gan-lote-card.active { border-color: #2a9d8f; background: #f0faf9; }
.gan-lote-card.gan-lote-inactive { opacity: 0.5; border-style: dashed; }
.gan-lote-card.gan-lote-inactive:hover { opacity: 0.8; }
#ganaderia-lote-detail-summary {
    padding: 12px 16px; border-bottom: 1px solid #e8ecf0; flex-shrink: 0;
}
.gan-valorizacion {
    margin-top: 8px; padding: 12px; border: 1px solid #e8ecf0; border-radius: 8px;
    background: #fafbfc; font-size: 12px;
}
.gan-val-header {
    display: flex; justify-content: space-between; align-items: center;
    font-weight: 700; font-size: 13px; color: #263238; margin-bottom: 8px;
}
.gan-val-total { color: #2e7d32; }
.gan-val-item {
    display: flex; align-items: baseline; gap: 8px;
    padding: 2px 0; color: #546e7a;
}
.gan-val-cat { font-weight: 600; color: #263238; min-width: 100px; }
.gan-val-detail { flex: 1; font-size: 11px; }
.gan-val-sub { font-weight: 600; color: #263238; text-align: right; white-space: nowrap; }
.gan-val-footer { margin-top: 6px; font-size: 10px; color: #90a4ae; }

.gan-lote-cross-badge {
    font-size: 10px; padding: 1px 6px; border-radius: 8px;
    background: #e8ecf0; color: #546e7a; font-weight: 600;
}
.gan-lote-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 6px;
}
.gan-lote-title { font-size: 13px; font-weight: 600; color: #263238; }
/* .gan-lote-del and .gan-lote-edit now use .gan-action-btn */
.gan-lote-body {
    display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px;
    font-size: 12px; color: #546e7a;
}
.gan-lote-demand { grid-column: 1 / -1; font-weight: 600; color: #2e7d32; margin-top: 4px; }

.gan-conf-badge {
    font-size: 9px; padding: 1px 5px; border-radius: 6px;
    font-weight: 600; text-transform: uppercase; vertical-align: middle;
}
.gan-conf-media { background: #fff3e0; color: #e65100; }
.gan-conf-baja { background: #ffebee; color: #c62828; }
.gan-conf-muy_baja { background: #fce4ec; color: #880e4f; }

.gl-hint { font-size: 11px; color: #78909c; font-style: italic; }

/* ── Visor Geo panel ────────────────────────────────────────────────────────── */
#visor-geo-panel {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 600px; max-width: 90vw;
    height: 500px; max-height: 80vh;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    z-index: 1300;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
#visor-geo-panel.hidden { display: none; }
#visor-geo-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    background: #f0f4f8;
    border-bottom: 1px solid #d0dae6;
    flex-shrink: 0;
}
#visor-geo-title {
    font-size: 14px;
    font-weight: 700;
    color: #1a2635;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#visor-geo-summary {
    padding: 8px 14px;
    font-size: 12px;
    color: #546e7a;
    border-bottom: 1px solid #e8ecf0;
    flex-shrink: 0;
}
#visor-geo-map {
    flex: 1;
    position: relative;
    min-height: 200px;
}
.visor-geo-legend {
    position: absolute;
    bottom: 10px; right: 10px;
    background: rgba(255,255,255,0.92);
    border-radius: 6px;
    padding: 6px 8px;
    font-size: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    z-index: 5;
}
.visor-geo-legend-item {
    display: flex;
    align-items: center;
    gap: 4px;
    line-height: 1.4;
}
.visor-geo-legend-swatch {
    display: inline-block;
    width: 14px; height: 10px;
    border-radius: 2px;
    flex-shrink: 0;
}
.visor-geo-legend-unit {
    font-size: 9px;
    color: #78909c;
    text-align: center;
    margin-top: 2px;
}