/* Estilos del área inicio (datos reales): Inicio y Automatizaciones. */

/* ---------- Semáforo ---------- */
.ini-pills{display:flex;flex-wrap:wrap;gap:8px}
.ini-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 13px 7px 11px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:inherit;font:inherit;font-size:12.5px;white-space:nowrap;transition:border-color .15s,transform .15s var(--ease-out),box-shadow .15s}
button.ini-pill{cursor:pointer}
@media (hover:hover) and (pointer:fine){button.ini-pill:hover{border-color:var(--line-strong);box-shadow:0 6px 16px -12px rgba(16,32,80,.35)}}
button.ini-pill:active{transform:scale(.97)}
.ini-pill .ip-l{color:var(--ink-3)}
.ini-pill b{font-weight:600;font-variant-numeric:tabular-nums}
.ini-dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--line-strong)}
.good>.ini-dot,.ini-dot.good{background:var(--good);box-shadow:0 0 0 3px var(--good-wash)}
.warn>.ini-dot,.ini-dot.warn{background:var(--warn);box-shadow:0 0 0 3px var(--warn-wash)}
.bad>.ini-dot,.ini-dot.bad{background:var(--bad);box-shadow:0 0 0 3px var(--bad-wash)}
.ini-pill.bad{border-color:color-mix(in srgb,var(--bad) 35%,var(--line))}
.ini-pill.bad .ini-dot{animation:ini-pulse 1.8s ease-in-out infinite}
@keyframes ini-pulse{50%{box-shadow:0 0 0 6px transparent}}

/* ---------- Tarjeta protagonista como botón ---------- */
button.ini-hero{text-align:left;font:inherit;cursor:pointer;width:100%;transition:transform .2s var(--ease-out),box-shadow .2s}
@media (hover:hover) and (pointer:fine){button.ini-hero:hover{transform:translateY(-2px)}}
button.ini-hero:active{transform:scale(.99)}
.ini-hero .hh-big{overflow-wrap:anywhere}

/* ---------- Tu día ---------- */
.ini-day .day{min-width:0}
.ini-empty-line{padding:6px 0 4px}
.ini-more{justify-self:start;margin-top:4px}
.ini-more svg{width:15px;height:15px}

/* ---------- Todo en orden ---------- */
.ini-ok{display:flex;align-items:center;gap:14px;padding:16px 18px}
.ini-ok b{font:600 14.5px var(--display)}
.ini-ok-ico{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--good-wash);color:var(--good)}
.ini-ok-ico svg{width:18px;height:18px}

/* ---------- Actividad ---------- */
.ini-feed{list-style:none;margin:0;padding:0;display:grid}
.ini-feed li{position:relative}
.ini-feed li:not(:last-child)::before{content:"";position:absolute;left:3.5px;top:22px;bottom:-8px;width:1px;background:var(--line)}
.ini-ev{display:flex;align-items:flex-start;gap:12px;width:calc(100% + 16px);margin:0 -8px;padding:8px;border:0;border-radius:12px;background:none;color:inherit;font:inherit;text-align:left}
button.ini-ev{cursor:pointer}
@media (hover:hover) and (pointer:fine){button.ini-ev:hover{background:var(--surface-2)}}
.ini-ev-dot{width:8px;height:8px;border-radius:50%;flex:none;margin-top:6px;background:var(--line-strong);position:relative;z-index:1;box-shadow:0 0 0 3px var(--surface)}
.ini-ev-dot.good,.ini-ev-dot.accent{background:var(--good)} .ini-ev-dot.warn{background:var(--warn)} .ini-ev-dot.bad{background:var(--bad)} .ini-ev-dot.accent{background:var(--accent)}
.ini-ev-t{flex:1;min-width:0;display:grid}
.ini-ev-t b{font-weight:550;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ini-ev-t small{color:var(--ink-3);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ini-ev-at{font-size:12px;color:var(--ink-3);white-space:nowrap;padding-top:1px}

/* ---------- Negocios ---------- */
.ini-biz{display:grid}
.ini-biz-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.ini-biz-row:last-child{border-bottom:0}
.ini-biz-t{flex:1;min-width:0;display:grid}
.ini-biz-t b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ini-biz-t small{color:var(--ink-3);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ini-biz-debt{font:650 13px var(--display);font-variant-numeric:tabular-nums;white-space:nowrap}
.ini-biz-debt.warn{color:var(--warn)}
.ini-biz-none{font-size:12px;color:var(--ink-3);white-space:nowrap}
.ini-biz-go{flex:none}
.ini-biz-go svg{width:15px;height:15px}
.ini-foot{text-align:right}

/* ---------- Carga y error ---------- */
.ini-skel{display:grid;gap:18px}
.ini-sk{border-radius:18px;background:linear-gradient(90deg,var(--sunken) 0%,var(--surface-2) 40%,var(--sunken) 80%);background-size:300% 100%;animation:ini-shimmer 1.4s ease-in-out infinite}
.ini-sk.pill{width:150px;height:32px;border-radius:999px}
.ini-sk.hero{min-height:280px;border-radius:22px}
.ini-sk.st{min-height:80px}
.ini-sk.box{min-height:300px}
@keyframes ini-shimmer{from{background-position:100% 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.ini-sk,.ini-pill.bad .ini-dot{animation:none}}
.ini-error{display:flex;align-items:center;gap:14px;padding:16px 18px}
.ini-error .att-ico{background:var(--bad-wash);color:var(--bad)}
.ini-error b{font:600 14.5px var(--display)}

/* ================= Automatizaciones ================= */
.au-list{display:grid}
.au-row{display:flex;align-items:flex-start;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line)}
.au-row:last-child{border-bottom:0}
.au-ico{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--good-wash);color:var(--good)}
.au-ico svg{width:18px;height:18px}
.au-row.pending .au-ico{background:var(--sunken);color:var(--ink-3)}
.au-row.warn .au-ico{background:var(--warn-wash);color:var(--warn)}
.au-row.bad .au-ico{background:var(--bad-wash);color:var(--bad)}
.au-main{flex:1;min-width:0;display:grid;gap:3px}
.au-main>b{font:600 14.5px/1.3 var(--display)}
.au-main>p{margin:0;color:var(--ink-2);font-size:13px;line-height:1.5}
.au-ev{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:6px;font-size:12.5px;color:var(--ink-3)}
.au-ev span{display:inline-flex;align-items:center;gap:6px}
.au-ev b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.au-row .badge{flex:none;margin-top:2px}
.au-sec{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line)}
.au-sec h2{margin:0;font:650 15.5px var(--display);letter-spacing:-.02em}
.au-sec .sub{font-size:12.5px;color:var(--ink-3)}
.au-bk{width:100%;border-collapse:collapse;font-size:13px}
.au-bk th{font:600 11px var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:10px 20px;border-bottom:1px solid var(--line)}
.au-bk td{padding:11px 20px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}
.au-bk tr:last-child td{border-bottom:0}
.au-bk td:first-child{font-weight:600}
.au-bk .num{text-align:right}
.au-bk th.num{text-align:right}
.au-bar{display:block;height:6px;border-radius:99px;background:var(--sunken);overflow:hidden;min-width:60px}
.au-bar i{display:block;height:100%;border-radius:inherit;background:var(--accent)}
.au-scroll{overflow-x:auto}
.au-stack{display:grid;gap:18px}
@media (max-width:760px){
  .au-row{padding:14px 16px;flex-wrap:wrap}
  .au-row .badge{margin-left:52px}
  .au-sec{padding:14px 16px}
  .au-bk th,.au-bk td{padding:10px 14px}
  .au-hide-sm{display:none}
  .ini-pill{font-size:12px;padding:6px 11px 6px 9px}
  .ini-foot{text-align:left}
}
@media (max-width:760px){.ini-day .dr-prio{margin:0 6px 0 2px}.ini-day .dr-due{font-size:11.5px}}
.ini-hero-retry{background:rgba(255,255,255,.16);color:#fff;border-color:transparent}
.au-stack{grid-template-columns:minmax(0,1fr)}
.au-stack>.card{min-width:0}
@media (max-width:760px){
  .au-main{flex:1 1 calc(100% - 52px)}
  .au-row .badge{order:3}
  .au-ev{display:grid;gap:4px}
  .au-ev span{display:block}
  .au-bk td,.au-bk th{white-space:normal}
  .au-bk td:nth-child(2){white-space:nowrap}
}
