/* Agua y Riego · tema v2 — colores y tipografía de aguayriego.mx; estilo limpio con tarjetas y barra lateral */
:root{
--az:#0095BF;--az-h:#0083a8;--az-o:#005066;--az2:#00bbf0;--az-50:#f5fdff;--az-100:#e0f8ff;--az-200:#b8efff;
--marino:#0E1932;--marino2:#222D46;--fondo:#F5F7FA;--sup:#fff;--sup2:#EEF2F6;--borde:#E2E7ED;--borde2:#C5CDD8;
--txt:#111418;--gris:#566070;--verde:#1F7A4D;--verde-s:#E3F4EA;--rojo:#E53E3E;--ambar:#FFC20E;
--sombra:0 8px 24px -10px rgba(16,24,40,.14);--sombra-s:0 1px 2px rgba(16,24,40,.05);
--r:16px;--r-s:10px;--lat:248px}
*{box-sizing:border-box}
body{margin:0;font-family:Roboto,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--fondo);color:var(--txt);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--az);text-underline-offset:2px}a:hover{color:var(--az-h)}
h1,h2,h3{font-family:Roboto,sans-serif;letter-spacing:-.01em;color:var(--marino)}
h1{font-size:1.6rem;font-weight:700;margin:.4em 0 .6em}h2{font-size:1.2rem;font-weight:700}h3{font-size:1.05rem;font-weight:600;margin:1em 0 .4em}
/* --- Barra lateral (escritorio) / barra superior (móvil) --- */
.top{background:var(--sup);color:var(--txt);display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem;position:sticky;top:0;z-index:1000;flex-wrap:wrap;border-bottom:1px solid var(--borde)}
.marca{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--marino);font-weight:700}
.marca .logo{height:38px;width:auto;display:block}
.marca small{font-weight:500;font-size:.78rem;color:var(--gris);background:var(--sup2);padding:.15rem .55rem;border-radius:999px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top nav{display:flex;gap:.15rem;flex-wrap:wrap}
.top nav a{color:var(--gris);text-decoration:none;padding:.55rem .8rem;border-radius:var(--r-s);font-size:.95rem;font-weight:500;display:flex;align-items:center;gap:.55rem}
.top nav a:hover{background:var(--sup2);color:var(--marino)}
.top nav a.act{background:var(--az-100);color:var(--az-o);font-weight:700}
.top nav a.salir{color:var(--rojo)}
.nav-tit{display:none;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--borde2);padding:.6rem .8rem .2rem}
.nav-sep{flex:1}
.avatar{width:28px;height:28px;border-radius:999px;background:var(--az);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;flex:none}
.menu-btn{display:none;background:var(--sup2);border:0;color:var(--marino);font-size:1.3rem;width:42px;height:42px;border-radius:12px;cursor:pointer}
@media(min-width:861px){
 body.con-menu{padding-left:var(--lat)}
 body.con-menu .top{position:fixed;left:0;top:0;bottom:0;width:var(--lat);flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;border-bottom:0;border-right:1px solid var(--borde);padding:1.1rem .8rem;overflow-y:auto}
 body.con-menu .marca{flex-direction:column;align-items:flex-start;gap:.5rem;padding:0 .4rem 1rem;border-bottom:1px solid var(--borde);margin-bottom:.6rem}
 body.con-menu .marca .logo{height:52px}
 body.con-menu .top nav{flex-direction:column;flex-wrap:nowrap;flex:1;gap:.1rem}
 body.con-menu .nav-tit{display:block}
 body.con-menu .top nav a.usr{border-top:1px solid var(--borde);border-radius:0;padding-top:.9rem;margin-top:.4rem}
}
@media(max-width:860px){.menu-btn{display:block}.top nav{display:none;width:100%;flex-direction:column;padding:.5rem 0 .3rem}.top nav.abierto{display:flex}.top nav a{padding:.8rem}.nav-sep{display:none}.marca .logo{height:32px}}
.cont{max-width:1180px;margin:0 auto;padding:1.4rem 1.2rem}
@media(max-width:600px){.cont{padding:1rem .8rem}h1{font-size:1.35rem}}
/* --- Tarjetas --- */
.card{background:var(--sup);border:1px solid var(--borde);border-radius:var(--r);box-shadow:var(--sombra-s);padding:1.2rem;margin-bottom:1rem}
.card>h2:first-child,.card>h3:first-child{margin-top:0}
.angosta{max-width:580px;margin-left:auto;margin-right:auto}
body.sin-menu{min-height:100vh;background:radial-gradient(1200px 500px at 50% -10%,var(--az-100),transparent 70%),var(--fondo);background-attachment:fixed}
.login{max-width:420px;margin:2.5rem auto;padding:2rem 1.6rem;box-shadow:var(--sombra)}
.login-marca{text-align:center;margin-bottom:.4rem}.login-marca img{height:72px;width:auto}
.login h1{text-align:center;color:var(--marino);font-size:1.35rem}.login h1 small{display:block;font-size:.9rem;font-weight:400;color:var(--gris);margin-top:.3rem}
/* --- Formularios --- */
label{display:block;margin:.7rem 0;font-weight:600;font-size:.9rem;color:var(--marino2)}label small{font-weight:400;color:var(--gris)}
input,select,textarea{width:100%;padding:.7rem .8rem;border:1px solid var(--borde2);border-radius:12px;font-size:1rem;margin-top:.3rem;font-family:inherit;background:#fff;color:var(--txt);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--az);box-shadow:0 0 0 4px rgba(0,149,191,.15)}
textarea{min-height:80px}fieldset{border:0;padding:0;margin:0}
/* --- Botones (píldora) --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;background:var(--az);color:#fff;border:0;border-radius:999px;padding:.68rem 1.25rem;font-size:.98rem;font-weight:600;cursor:pointer;text-decoration:none;margin:.2rem 0;font-family:inherit;box-shadow:0 1px 2px rgba(0,80,102,.2);transition:background .15s,transform .05s}
.btn:hover{background:var(--az-h);color:#fff}.btn:active{transform:translateY(1px)}
.btn.chico{padding:.38rem .8rem;font-size:.85rem}.btn.grande{width:100%;padding:.95rem;font-size:1.08rem}
.btn.gris{background:var(--sup2);color:var(--marino2);box-shadow:none}.btn.gris:hover{background:var(--borde)}
.btn.verde{background:var(--verde)}.btn.verde:hover{background:#17603c}.btn.rojo{background:var(--rojo)}.btn.rojo:hover{background:#c53030}
.acciones{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:.6rem 0}.acciones input{width:auto;flex:1;min-width:180px}
.inline{display:inline}.inline input{width:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:700px){.grid2{grid-template-columns:1fr}}
/* --- Avisos y etiquetas --- */
.aviso{background:var(--az-50);border:1px solid var(--az-200);color:var(--az-o);padding:.85rem 1rem;border-radius:12px;margin-bottom:1rem}.aviso pre{white-space:pre-wrap;background:#fff;padding:.5rem;border-radius:8px}
.error{background:#FDECEC;color:#9B1C1C;border:1px solid #F8C9C9;padding:.7rem .9rem;border-radius:12px;margin:.5rem 0}
.banner{padding:.7rem 1rem;text-align:center;font-size:.93rem;border-bottom:1px solid var(--borde)}.banner.gracia{background:#FFF7DB}.banner.solo_lectura,.banner.pausada{background:#FDECEC}.banner.pendiente{background:var(--az-100)}.banner.activa{background:var(--verde-s)}
.etq{display:inline-block;padding:.15rem .6rem;border-radius:999px;font-size:.76rem;font-weight:600;background:var(--sup2);color:var(--marino2)}.etq.pagado,.etq.activa{background:var(--verde-s);color:var(--verde)}.etq.pendiente,.etq.gracia{background:#FFF3C4;color:#7a5a00}.etq.pausada,.etq.solo_lectura{background:#FDE0E0;color:#9B1C1C}
.mini{font-size:.85rem;color:var(--gris)}.centro{text-align:center}
/* --- Listas --- */
.lista .item{display:block;text-decoration:none;color:inherit;margin-bottom:.6rem;transition:border-color .15s,box-shadow .15s}
.lista a.item:hover{border-color:var(--az-200);box-shadow:var(--sombra)}
.item.hecha{border-left:5px solid var(--verde)}.item.inactivo{opacity:.55}
.fila-tit{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.4rem}.fila-tit h1{margin:.2em 0}
.filtros{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}.filtros input,.filtros select{width:auto;flex:1;min-width:140px;margin-top:0}
.dias{display:flex;gap:.35rem;flex-wrap:wrap;margin:.3rem 0}.chip{display:inline-flex;align-items:center;gap:.3rem;background:var(--sup2);border:1px solid var(--borde);padding:.38rem .7rem;border-radius:999px;font-weight:500;margin:0}.chip input{width:auto;margin:0}
.chk{display:flex;align-items:center;gap:.5rem}.chk input{width:auto;margin:0;accent-color:var(--az)}.chk.grande{background:var(--sup2);padding:.8rem;border-radius:12px;font-size:1rem}.checks{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
input[type=checkbox],input[type=radio]{accent-color:var(--az)}
.mapa{height:320px;border-radius:14px;margin:.5rem 0;z-index:1;border:1px solid var(--borde)}.mapa.grande{height:420px}
/* --- Tablas --- */
table{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem}th,td{padding:.6rem .55rem;border-bottom:1px solid var(--borde);text-align:left;vertical-align:top}
th{background:var(--sup2);color:var(--gris);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}th:first-child{border-top-left-radius:10px}th:last-child{border-top-right-radius:10px}
tbody tr:hover td{background:var(--az-50)}
.tabla-scroll{overflow-x:auto}td.mal,tr.mal td{color:var(--rojo);font-weight:600}tr.sin td{color:#999}.mal{color:var(--rojo)}
/* --- Indicadores --- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.9rem;margin-bottom:1rem}
.kpi{background:var(--sup);border:1px solid var(--borde);border-radius:var(--r);padding:1.1rem 1.2rem;box-shadow:var(--sombra-s);color:var(--gris);font-size:.88rem;font-weight:500;position:relative;overflow:hidden}
.kpi:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--az)}
.kpi b{display:block;font-size:1.75rem;font-weight:700;color:var(--marino);letter-spacing:-.02em}.kpi a{text-decoration:none;color:inherit}
.barras{display:flex;gap:.5rem;height:150px;align-items:flex-end}.barra{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;text-decoration:none;color:var(--gris);font-size:.8rem}.barra span{width:100%;background:linear-gradient(180deg,var(--az2),var(--az));border-radius:8px 8px 3px 3px;min-height:3px}
.alerta{background:#FFF8E1;border:1px solid #FDE7A6;border-radius:12px;padding:.6rem .8rem;margin:.35rem 0}
.semana{display:grid;grid-template-columns:repeat(6,1fr);gap:.6rem}@media(max-width:900px){.semana{grid-template-columns:1fr 1fr}}@media(max-width:480px){.semana{grid-template-columns:1fr}}
.dia h3{margin-top:0}.pild{display:block;border-left:4px solid;background:var(--sup2);padding:.45rem .6rem;margin:.35rem 0;border-radius:10px;text-decoration:none;color:var(--txt);font-size:.9rem}.pild small{display:block;color:var(--gris)}
.asig{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.asig select{width:auto}
.paradas{padding-left:1.2rem}.paradas li{padding:.3rem .4rem;border-radius:8px}.paradas li.hecha{border-left:4px solid var(--verde);background:var(--verde-s)}
.lecturas{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}@media(max-width:600px){.lecturas{grid-template-columns:1fr 1fr}}
input.fuera{border-color:var(--rojo);background:#fff3f3}
.dosis{background:var(--verde-s);border:1px solid #C6E8D3;border-radius:14px;padding:.9rem;margin:.6rem 0}
.quim{display:grid;grid-template-columns:2fr 2fr 1fr 1fr;gap:.35rem;margin:.3rem 0}@media(max-width:600px){.quim{grid-template-columns:1fr 1fr}}
.previas{display:flex;flex-wrap:wrap;gap:.45rem}.previas figure{margin:0;position:relative}.previas img{width:90px;height:90px;object-fit:cover;border-radius:12px}.previas figcaption{font-size:.7rem;text-align:center}
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}.galeria img{width:100%;height:150px;object-fit:cover;border-radius:12px}.galeria figure{margin:0}.galeria figcaption{font-size:.8rem;color:var(--gris)}
.lect-tabla tr.bien td:nth-child(2){color:var(--verde);font-weight:600}.resumen{background:var(--verde-s);padding:.8rem;border-radius:12px}.checklist{list-style:none;padding:0}
.publico{max-width:720px;margin:1rem auto}
.tabs{display:inline-flex;gap:.2rem;margin-bottom:.9rem;background:var(--sup2);padding:.25rem;border-radius:999px;flex-wrap:wrap}.tabs a{padding:.42rem 1rem;border-radius:999px;text-decoration:none;color:var(--gris);font-weight:500}.tabs a.act{background:var(--sup);color:var(--az-o);box-shadow:var(--sombra-s);font-weight:700}
.log code{font-size:.75rem;word-break:break-all}.cambios{max-width:420px}
.terminos{background:var(--sup2);padding:.7rem;border-radius:12px;font-size:.9rem}
.pie{text-align:center;color:var(--gris);font-size:.8rem;padding:1.5rem}.pie-logo{height:26px;opacity:.7;margin-bottom:.3rem}
