:root{
    --verde:#1f8f63;
    --verde-vivo:#2db34a;
    --verde-oscuro:#146346;
    --charcoal:#3d3d3d;
    --bg:#f0f4f1;
    --card:#fff;
    --border:#d9e3dc;
    --danger:#c0392b;
    --warn:#b9770e;
}

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

body{
    font-family:"Outfit", "Segoe UI", sans-serif;
    background:
        radial-gradient(ellipse at top left, rgba(45,179,74,.08), transparent 40%),
        var(--bg);
    color:var(--charcoal);
    min-height:100vh;
}

a{ color:inherit; text-decoration:none; }

.admin-wrap{
    width:min(1180px, 94%);
    margin:0 auto;
    padding:28px 0 60px;
}

.admin-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-bottom:28px;
    flex-wrap:wrap;
}

.admin-brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.admin-brand img{
    width:48px;
    height:48px;
    object-fit:contain;
    border-radius:50%;
    background:#fff;
    padding:6px;
    box-shadow:0 6px 16px rgba(20,99,70,.12);
}

.admin-brand strong{
    display:block;
    font-size:1.15rem;
}

.admin-brand small{
    color:#6b7870;
}

.admin-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:11px 18px;
    border-radius:999px;
    border:1px solid transparent;
    font-weight:600;
    font-size:.95rem;
    cursor:pointer;
    font-family:inherit;
    transition:.2s ease;
}

.btn-primary{
    background:var(--verde);
    color:#fff;
}

.btn-primary:hover{ background:var(--verde-oscuro); }

.btn-ghost{
    background:#fff;
    border-color:var(--border);
    color:var(--charcoal);
}

.btn-ghost:hover{ background:#eef6f0; }

.btn-danger{
    background:#fff;
    border-color:#f0c2bd;
    color:var(--danger);
}

.btn-danger:hover{ background:#fdf0ee; }

.btn-sm{
    padding:8px 12px;
    font-size:.85rem;
}

.panel{
    background:var(--card);
    border:1px solid var(--border);
    border-radius:18px;
    padding:22px;
    box-shadow:0 10px 28px rgba(16,40,28,.06);
    margin-bottom:20px;
}

.panel h1,
.panel h2{
    font-size:1.35rem;
    margin-bottom:6px;
    color:var(--verde-oscuro);
}

.panel .muted{
    color:#6b7870;
    margin-bottom:18px;
}

.filters{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:18px;
}

.filters select{
    padding:10px 12px;
    border-radius:12px;
    border:1px solid var(--border);
    font:inherit;
    background:#fff;
    min-width:160px;
}

.table-wrap{ overflow-x:auto; }

table{
    width:100%;
    border-collapse:collapse;
}

th, td{
    text-align:left;
    padding:12px 10px;
    border-bottom:1px solid #eef2ef;
    vertical-align:middle;
}

th{
    font-size:.82rem;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:#6b7870;
}

td .title{
    font-weight:600;
    color:var(--charcoal);
}

.badge{
    display:inline-block;
    padding:4px 10px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:600;
    background:#eef6f0;
    color:var(--verde-oscuro);
}

.badge-off{
    background:#f3f3f3;
    color:#777;
}

.badge-show{
    background:#eef3ff;
    color:#2f4f8a;
}

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

.empty{
    text-align:center;
    padding:40px 16px;
    color:#6b7870;
}

/* LOGIN */
.login-page{
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:24px;
}

.login-card{
    width:min(420px, 100%);
    background:#fff;
    border:1px solid var(--border);
    border-radius:22px;
    padding:32px 28px;
    box-shadow:0 16px 40px rgba(16,40,28,.1);
}

.login-card .logo{
    width:72px;
    height:72px;
    object-fit:contain;
    display:block;
    margin:0 auto 14px;
    border-radius:50%;
    background:#f7fbf8;
    padding:10px;
}

.login-card h1{
    text-align:center;
    font-size:1.4rem;
    margin-bottom:6px;
}

.login-card .subtitle{
    text-align:center;
    color:#6b7870;
    margin-bottom:22px;
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.form-grid .full{ grid-column:1 / -1; }

label{
    display:flex;
    flex-direction:column;
    gap:6px;
    font-size:.9rem;
    font-weight:600;
    color:#445048;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="url"],
select,
textarea{
    width:100%;
    padding:11px 12px;
    border-radius:12px;
    border:1px solid var(--border);
    font:inherit;
    font-weight:400;
    background:#fff;
}

textarea{ min-height:110px; resize:vertical; }

.checkbox-row{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:600;
}

.checkbox-row input{ width:auto; }

.alert{
    padding:12px 14px;
    border-radius:12px;
    margin-bottom:16px;
    font-size:.95rem;
}

.alert-error{
    background:#fdf0ee;
    color:var(--danger);
    border:1px solid #f0c2bd;
}

.alert-ok{
    background:#eef8f1;
    color:var(--verde-oscuro);
    border:1px solid #b9e0c5;
}

.form-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:8px;
}

.help{
    font-size:.8rem;
    font-weight:400;
    color:#7a8680;
}

.preview-img{
    max-width:180px;
    border-radius:12px;
    margin-top:8px;
    border:1px solid var(--border);
}

.salidas-block{
    margin-top:22px;
    padding-top:18px;
    border-top:1px solid var(--border);
}

.salidas-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:14px;
}

.salidas-head h2{
    font-size:1.15rem;
    color:var(--verde-oscuro);
    margin-bottom:4px;
}

.salida-row{
    display:grid;
    grid-template-columns:1.3fr 1.1fr .9fr auto;
    gap:10px;
    align-items:end;
    padding:12px;
    margin-bottom:10px;
    background:#f7faf8;
    border:1px solid var(--border);
    border-radius:14px;
}

.salida-row .remove-salida{
    margin-bottom:2px;
    min-width:40px;
}

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

@media(max-width:800px){
    .form-grid{ grid-template-columns:1fr; }
    th:nth-child(4),
    td:nth-child(4){ display:none; }
}