/* ===== Inicio · tablero personal ===== */
/* Todo va bajo .hm para no chocar con el CSS de los demás módulos. */

.hm-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.hm-cab h1{margin-top:2px}
.hm-cab .sub{color:var(--muted);font-size:13.5px;margin-top:4px}
.hm-cab .acc{display:flex;gap:8px;flex-wrap:wrap}

/* Seis columnas: una tarjeta chica ocupa dos, una mediana tres y una grande la fila entera. */
.hm-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;align-items:start}
.hm-w{grid-column:span 3;min-width:0;display:flex;flex-direction:column}
.hm-w.t-s{grid-column:span 2}
.hm-w.t-l{grid-column:span 6}
@media (max-width:1080px){.hm-w.t-s{grid-column:span 3}}
@media (max-width:720px){.hm-grid{grid-template-columns:minmax(0,1fr)}.hm-w,.hm-w.t-s,.hm-w.t-l{grid-column:1/-1}}

.hm-w .card-h{padding:12px 16px;min-height:50px}
.hm-w .card-h h3{display:flex;align-items:center;gap:8px}
.hm-w .card-h h3 svg{width:16px;height:16px;color:var(--green);flex:none}
.hm-w .card-h .ir{font-size:12.5px;color:var(--green-d);font-weight:600;white-space:nowrap}
.hm-w .card-h .ir:hover{text-decoration:underline;cursor:pointer}
.hm-w .card-b{padding:14px 16px}
.hm-vacio{color:var(--muted);font-size:13px;padding:6px 0}
.hm-err{color:var(--red-ink);font-size:13px}
.hm-carga{color:var(--muted-2);font-size:13px}

/* ----- Modo personalizar ----- */
.hm-edit .hm-w{outline:2px dashed var(--line-2);outline-offset:3px;border-radius:var(--r)}
.hm-edit .hm-w.arrastra{opacity:.45}
.hm-edit .hm-w.sobre{outline-color:var(--green);outline-style:solid}
.hm-edit .hm-w .card-h{cursor:grab;background:var(--surface-2)}
.hm-ctl{display:flex;align-items:center;gap:4px}
.hm-ctl button{width:28px;height:28px;border-radius:6px;display:grid;place-items:center;color:var(--muted)}
.hm-ctl button:hover{background:var(--line);color:var(--ink)}
.hm-ctl button:disabled{opacity:.3;cursor:default;background:none}
.hm-ctl svg{width:15px;height:15px}
.hm-ctl .seg button{width:auto;height:auto;padding:3px 8px;font-size:11.5px}
.hm-bandeja{background:var(--surface);border:1px dashed var(--line-2);border-radius:var(--r);padding:12px 14px;margin-bottom:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.hm-bandeja b{font-size:12.5px;color:var(--muted);font-weight:600;margin-right:4px}
.hm-bandeja .chip{cursor:pointer}
.hm-bandeja .chip:hover{border-color:var(--green);color:var(--green-d)}
.hm-bandeja .chip svg{color:var(--green)}

/* ----- Indicadores ----- */
.hm-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line)}
.hm-kpis>button{background:var(--surface);padding:12px 16px;text-align:left;border-left:3px solid transparent}
.hm-kpis>button:hover{background:var(--surface-2)}
.hm-kpis .kl{display:block;font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);font-weight:600}
.hm-kpis .kv{display:block;font:600 26px/1.1 var(--fd);margin-top:6px;font-variant-numeric:tabular-nums}
.hm-kpis .kf{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.hm-kpis .a{border-left-color:var(--amber)}.hm-kpis .r{border-left-color:var(--red)}
.hm-kpis .b{border-left-color:var(--blue)}.hm-kpis .g{border-left-color:var(--green)}

/* ----- Clima ----- */
.hm-clima-lugar{font-size:12px;color:var(--muted)}
.hm-dias{display:grid;grid-template-columns:repeat(7,minmax(74px,1fr));gap:6px;overflow-x:auto;padding-bottom:2px}
.hm-dia{border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 6px;text-align:center;background:var(--surface);min-width:0}
.hm-dia.hoy{border-color:var(--green-line);background:var(--green-soft)}
.hm-dia .d{font-size:11.5px;font-weight:600;color:var(--ink-2)}
.hm-dia svg{width:30px;height:30px;margin:4px auto 2px;display:block}
.hm-dia .t{font:600 14px var(--fd);font-variant-numeric:tabular-nums}
.hm-dia .t small{color:var(--muted);font-weight:500;font-size:12px}
.hm-dia .ll{font-size:11px;color:var(--blue-ink);min-height:15px}
.hm-dia .ap{margin-top:5px;font-size:10.5px;font-weight:600;border-radius:99px;padding:1px 6px;display:inline-block}
.hm-dia .ap.si{background:var(--green-soft);color:var(--green-d)}
.hm-dia .ap.poco{background:var(--amber-soft);color:var(--amber-ink)}
.hm-dia .ap.no{background:var(--surface-2);color:var(--muted)}
.hm-dia.helada{border-color:#E3B4AD}
.hm-dia .hel{font-size:10.5px;font-weight:700;color:var(--red-ink);margin-top:3px}
.hm-clima-pie{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:12px;color:var(--muted)}
.hm-clima-pie b{color:var(--ink);font-weight:600}
.hm-ahora{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;margin-bottom:10px;font-size:12.5px;color:var(--muted)}
.hm-ahora .tt{font:600 24px var(--fd);color:var(--ink)}

/* ----- Listas (eventos, órdenes, avisos) ----- */
.hm-lista{list-style:none}
.hm-lista li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line)}
.hm-lista li:last-child{border-bottom:none}
.hm-lista li.clic{cursor:pointer;border-radius:6px}
.hm-lista li.clic:hover{background:var(--surface-2)}
.hm-lista .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none;background:var(--green-soft);color:var(--green-d)}
.hm-lista .ic svg{width:15px;height:15px}
.hm-lista .ic.a{background:var(--amber-soft);color:var(--amber-ink)}
.hm-lista .ic.r{background:var(--red-soft);color:var(--red-ink)}
.hm-lista .ic.b{background:var(--blue-soft);color:var(--blue-ink)}
.hm-lista .ic.p{background:var(--purple-soft);color:var(--purple-ink)}
.hm-lista .tx{flex:1;min-width:0}
.hm-lista .t1{font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-lista .t2{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-lista .cu{color:var(--muted);font-size:11.5px;white-space:nowrap;text-align:right}
.hm-lista li.nueva .t1::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold-br);margin-right:6px;vertical-align:middle}

.hm-fases{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.hm-fases .badge{cursor:pointer}

/* ----- Calendario de cumplimientos ----- */
.hm-cal{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:18px}
@media (max-width:900px){.hm-cal{grid-template-columns:minmax(0,1fr)}}
.hm-mes-h{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.hm-mes-h b{font:600 14px var(--fd);flex:1}
.hm-mes-h button{width:28px;height:28px;border-radius:6px;display:grid;place-items:center;color:var(--muted)}
.hm-mes-h button:hover{background:var(--surface-2);color:var(--ink)}
.hm-mes-h svg{width:15px;height:15px}
.hm-mes{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.hm-mes .dn{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);font-weight:600;text-align:center;padding-bottom:3px}
.hm-mes .c{min-height:48px;border-radius:6px;padding:3px 4px;font-size:12px;background:var(--surface-2);text-align:left;display:flex;flex-direction:column;gap:2px;border:1px solid transparent}
.hm-mes .c.fuera{background:transparent;color:var(--muted-2)}
.hm-mes .c.hoy{border-color:var(--green)}
.hm-mes .c.hoy .n{color:var(--green-d);font-weight:700}
.hm-mes .c.sel{background:var(--green-soft);border-color:var(--green-line)}
.hm-mes .c .n{font-variant-numeric:tabular-nums}
.hm-mes .c .pts{display:flex;flex-wrap:wrap;gap:2px}
.hm-mes .c .pts i{width:6px;height:6px;border-radius:50%;display:block}
.hm-mes .c.con{cursor:pointer}
.hm-mes .c.con:hover{border-color:var(--line-2)}
.hm-ley{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:11.5px;color:var(--muted)}
.hm-ley span{display:inline-flex;align-items:center;gap:5px}
.hm-ley i{width:8px;height:8px;border-radius:50%;display:inline-block}
.hm-prox h4{font:600 12px var(--fd);color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:0 0 4px}
.hm-prox .fe{font-size:11.5px;font-weight:600;color:var(--ink-2);margin-top:10px}
.hm-prox .fe.venc{color:var(--red-ink)}
.hm-prox .hm-lista li{padding:6px 0}
.hm-prox .hm-lista .ic{width:8px;height:8px;border-radius:50%;margin-top:6px}

/* ----- Accesos rápidos ----- */
.hm-atajos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.hm-atajos button{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);font-size:13px;font-weight:500;text-align:left}
.hm-atajos button:hover{border-color:var(--green-line);background:var(--green-soft);color:var(--green-d)}
.hm-atajos button svg{width:14px;height:14px;color:var(--green);flex:none}
.hm-atajos-sel{max-height:50vh;overflow:auto;border:1px solid var(--line);border-radius:var(--r-sm)}
.hm-atajos-sel h5{font:600 11px var(--fd);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:8px 12px 4px;background:var(--surface-2);position:sticky;top:0}
.hm-atajos-sel label{display:flex;align-items:center;gap:8px;padding:6px 12px;font-size:13px;cursor:pointer}
.hm-atajos-sel label:hover{background:var(--surface-2)}