/* ═══════════════════════════════════════════════════
   SIEMBRA — Paleta institucional
   ═══════════════════════════════════════════════════ */
:root {
    --sb-verde1:    #007853;   /* Pantone 341 C  — principal */
    --sb-verde1dk:  #005c3e;   /* hover / active  */
    --sb-verde3:    #76bc21;   /* Pantone 368 C  — acento */
    --sb-verde4:    #c2d500;   /* Pantone 382 C  — lima */
    --sb-aqua:      #00af9a;   /* Pantone 3275 C — aguamarina */
    --sb-blanco:    #ffffff;
    --sb-gris-bg:   #f4f6f4;
    --sb-gris-brd:  #dde8e3;
    --sb-texto:     #1a2e24;
    --sidebar-w:    240px;
}

/* ═══════════════ BASE ═══════════════════════════════ */
html { font-size: 14px; }
@media (min-width: 768px) { html { font-size: 15px; } }

body {
    background-color: var(--sb-gris-bg);
    color: var(--sb-texto);
    margin: 0;
    font-family: 'Segoe UI', system-ui, sans-serif;
}

/* ═══════════════ TOPBAR ═════════════════════════════ */
.sb-topbar {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 56px;
    background: var(--sb-verde1);
    display: flex;
    align-items: center;
    padding: 0 1rem;
    z-index: 1040;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.sb-topbar .brand {
    color: var(--sb-blanco);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: .5px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
}
.sb-topbar .brand span.dot {
    display: inline-block;
    width: 10px; height: 10px;
    background: var(--sb-verde4);
    border-radius: 50%;
}
.sb-topbar .user-info {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: .75rem;
    color: rgba(255,255,255,.88);
    font-size: .875rem;
}
.sb-topbar .user-info .avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    background: var(--sb-verde3);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700;
    font-size: .8rem;
}
.sb-topbar .btn-logout {
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.3);
    color: #fff;
    font-size: .8rem;
    padding: .25rem .75rem;
    border-radius: 20px;
    cursor: pointer;
    transition: background .2s;
}
.sb-topbar .btn-logout:hover { background: rgba(255,255,255,.28); }

/* ═══════════════ SIDEBAR ════════════════════════════ */
.sb-sidebar {
    position: fixed;
    top: 56px; left: 0; bottom: 0;
    width: var(--sidebar-w);
    background: var(--sb-verde1);
    overflow-y: auto;
    z-index: 1030;
    transition: transform .25s ease;
}
.sb-sidebar::-webkit-scrollbar { width: 4px; }
.sb-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 4px; }

.sb-nav-section {
    padding: .6rem 1rem .2rem;
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255,255,255,.45);
    font-weight: 600;
}
.sb-nav-item {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .55rem 1.25rem;
    color: rgba(255,255,255,.85);
    text-decoration: none;
    font-size: .88rem;
    border-left: 3px solid transparent;
    transition: background .15s, border-color .15s, color .15s;
}
.sb-nav-item:hover {
    background: rgba(255,255,255,.1);
    color: #fff;
    border-left-color: var(--sb-verde3);
}
.sb-nav-item.active {
    background: rgba(255,255,255,.15);
    color: #fff;
    border-left-color: var(--sb-verde4);
    font-weight: 600;
}
.sb-nav-divider {
    border-color: rgba(255,255,255,.12);
    margin: .4rem 1rem;
}

/* ═══════════════ CONTENIDO PRINCIPAL ════════════════ */
.sb-content {
    margin-left: var(--sidebar-w);
    margin-top: 56px;
    padding: 1.5rem;
    min-height: calc(100vh - 56px);
}

/* ═══════════════ CARDS ══════════════════════════════ */
.card {
    border: 1px solid var(--sb-gris-brd);
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,80,40,.07);
}
.card-header-siembra {
    background: var(--sb-verde1);
    color: #fff;
    border-radius: 10px 10px 0 0;
    padding: .85rem 1.25rem;
    font-weight: 600;
}

/* ═══════════════ BOTONES ════════════════════════════ */
.btn-siembra {
    background: var(--sb-verde1);
    border-color: var(--sb-verde1);
    color: #fff;
}
.btn-siembra:hover, .btn-siembra:focus {
    background: var(--sb-verde1dk);
    border-color: var(--sb-verde1dk);
    color: #fff;
}
.btn-siembra-aqua {
    background: var(--sb-aqua);
    border-color: var(--sb-aqua);
    color: #fff;
}
.btn-siembra-aqua:hover {
    background: #009080;
    border-color: #009080;
    color: #fff;
}

/* ═══════════════ FOCUS / FORMS ══════════════════════ */
.form-control:focus, .form-select:focus {
    border-color: var(--sb-verde3);
    box-shadow: 0 0 0 .2rem rgba(118,188,33,.25);
}
.btn:focus { box-shadow: 0 0 0 .2rem rgba(0,120,83,.3); }

/* ═══════════════ BADGES / PILLS ═════════════════════ */
.badge-siembra  { background-color: var(--sb-verde1); color: #fff; }
.badge-acento   { background-color: var(--sb-verde3); color: #fff; }
.badge-lima     { background-color: var(--sb-verde4); color: var(--sb-texto); }
.badge-aqua     { background-color: var(--sb-aqua);   color: #fff; }

/* ═══════════════ TABLAS ═════════════════════════════ */
.table thead th {
    background: var(--sb-verde1);
    color: #fff;
    border-color: var(--sb-verde1dk);
    font-weight: 600;
}

/* ═══════════════ HOME DASHBOARD ═════════════════════ */
.hd-home {
    max-width: 820px;
}

/* Tarjeta de bienvenida con logo */
.hd-welcome-card {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: var(--sb-verde1);
    border-radius: 14px;
    padding: 1.75rem 2rem;
    margin-bottom: 2rem;
    color: #fff;
    box-shadow: 0 4px 16px rgba(0,80,40,.18);
}
.hd-welcome-logo img {
    height: 64px;
    width: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);  /* logo blanco sobre verde */
}
.hd-logo-fallback {
    width: 64px; height: 64px;
    background: rgba(255,255,255,.15);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.hd-welcome-text h1 {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 .25rem;
}
.hd-welcome-text p {
    margin: 0;
    opacity: .8;
    font-size: .9rem;
}
.hd-welcome-text strong { color: var(--sb-verde4); }

/* Tiles de acceso rápido */
.hd-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}
.hd-tile {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border: 1px solid var(--sb-gris-brd);
    border-radius: 12px;
    padding: 1.1rem 1.25rem;
    text-decoration: none;
    color: var(--sb-texto);
    transition: box-shadow .18s, transform .15s, border-color .18s;
    box-shadow: 0 1px 4px rgba(0,80,40,.07);
}
.hd-tile:hover {
    box-shadow: 0 6px 20px rgba(0,80,40,.13);
    transform: translateY(-2px);
    border-color: var(--sb-verde3);
    color: var(--sb-texto);
    text-decoration: none;
}
.hd-tile-icon {
    width: 52px; height: 52px;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.hd-tile-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .15rem;
}
.hd-tile-title {
    font-weight: 700;
    font-size: .95rem;
}
.hd-tile-sub {
    font-size: .78rem;
    color: #6b8a78;
}
.hd-tile-arrow {
    color: var(--sb-gris-brd);
    flex-shrink: 0;
    transition: color .15s;
}
.hd-tile:hover .hd-tile-arrow { color: var(--sb-verde3); }

/* Pie versión */
.hd-version {
    font-size: .75rem;
    color: #9ab4a4;
    margin-top: .5rem;
}
.hd-version span { color: var(--sb-verde3); font-weight: 600; }

/* ═══════════════ RESPONSIVE ═════════════════════════ */
@media (max-width: 768px) {
    .sb-sidebar { transform: translateX(-100%); }
    .sb-sidebar.open { transform: translateX(0); }
    .sb-content { margin-left: 0; }
    .hd-welcome-card { flex-direction: column; text-align: center; }
    .hd-tiles { grid-template-columns: 1fr; }
}

/* ═══════════════ RADIO CARDS (formulario servicios) ══════════ */
.hd-radio-card {
    border: 1.5px solid var(--sb-gris-brd);
    border-radius: 8px;
    padding: .55rem .85rem;
    transition: border-color .15s, background .15s;
    cursor: pointer;
}
.hd-radio-card:has(input:checked) {
    border-color: var(--sb-verde1);
    background: rgba(0,120,83,.06);
}
.hd-radio-card:hover {
    border-color: var(--sb-verde3);
    background: rgba(118,188,33,.06);
}
.hd-radio-card .form-check-input {
    margin-top: .2rem;
}
.hd-radio-card .form-check-label {
    cursor: pointer;
    font-size: .875rem;
    line-height: 1.3;
}

/* ═══════════════ QA — RADIO PRIORIDAD ══════════════════ */
.hd-radio-prioridad {
    display: inline-flex;
    align-items: center;
    padding: .45rem 1.1rem;
    border: 2px solid #dee2e6;
    border-radius: 20px;
    cursor: pointer;
    font-size: .875rem;
    transition: border-color .15s, background .15s;
}
.hd-radio-prioridad:hover {
    opacity: .85;
}
