/* North Planner v57 · barra flotante, selectores propios, recurrentes y correcciones de campo.
   Se carga después de rumbo.css. */

/* ---- Barra de navegación flotante (estilo iOS) ---- */
:root[data-theme] .nav{
  position:fixed!important;left:50%!important;right:auto!important;
  bottom:calc(10px + env(safe-area-inset-bottom))!important;
  transform:translateX(-50%)!important;
  width:min(calc(100% - 24px),460px)!important;max-width:none!important;margin:0!important;
  height:auto!important;min-height:66px;padding:6px!important;
  border:1px solid color-mix(in srgb,var(--ink) 13%,transparent)!important;
  border-radius:26px!important;
  background:color-mix(in srgb,var(--canvas) 70%,transparent)!important;
  -webkit-backdrop-filter:blur(24px) saturate(1.8)!important;backdrop-filter:blur(24px) saturate(1.8)!important;
  box-shadow:0 12px 36px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.07)!important;
  display:grid!important;grid-template-columns:1fr 1fr 60px 1fr 1fr;align-items:center;gap:2px;
}
:root[data-theme] .nav button{border-radius:18px!important;min-height:52px;padding:6px 0 5px!important}
:root[data-theme] .nav button.active:not(.nav-create){
  background:color-mix(in srgb,var(--accent) 17%,transparent)!important;color:var(--ink)!important}
:root[data-theme] .nav button.active:not(.nav-create):before{display:none}
:root[data-theme] .nav .nav-create{
  width:48px!important;height:48px!important;margin:0 auto!important;border-radius:17px!important;
  clip-path:none!important;min-height:0!important}
@keyframes rumboTabPop{0%{transform:scale(.82)}55%{transform:scale(1.14)}100%{transform:scale(1)}}
:root[data-theme] .nav button.active:not(.nav-create) .nav-icon{animation:rumboTabPop .42s cubic-bezier(.32,.72,0,1)}
:root[data-theme] .app{padding-bottom:calc(120px + env(safe-area-inset-bottom))}
html.rumbo-kb .nav{opacity:0;pointer-events:none}

/* ---- Texto: sin grises sueltos en Tareas ---- */
:root[data-theme] #tasksHub :is(.task-heading small,.task-recommend small,.task-recommend p,.task-stat span,.task-list-head span,#taskListLabel){color:var(--ink)!important}

/* ---- Iconos con contraste suficiente ---- */
:root[data-theme] .create-option.primary-create .create-ico{
  background:rgba(248,246,239,.16)!important;color:#F8F6EF!important;border-color:rgba(248,246,239,.45)!important}
:root[data-theme="dark"] .create-option.primary-create{background:#2F4A36!important;color:#F8F6EF!important}
:root[data-theme] :is(.task-sub-builder button,.add-circle){
  background:var(--accent)!important;color:var(--accent-ink)!important;border:0!important}
:root[data-theme="light"] :is(.task-sub-builder button,.add-circle){background:var(--r-forest)!important;color:var(--r-cream)!important}
:root[data-theme] :is(.task-sub-builder button,.add-circle) :is(svg,use){stroke:currentColor;color:inherit}
:root[data-theme] .category-select button{color:var(--accent)!important;background:transparent!important;border:1px solid var(--line)!important;border-radius:var(--r-m)!important}

/* ---- Apartados: chips legibles y con aire ---- */
:root[data-theme] .pocket-manage{gap:10px;margin:14px 0 18px;flex-wrap:wrap}
:root[data-theme] .pocket-manage button{
  min-height:44px;padding:0 16px;border-radius:var(--r-m);font-size:13px;font-weight:600;
  background:transparent!important;color:var(--ink)!important;border:1px solid var(--line)!important}
:root[data-theme] .pocket-manage .pocket-danger{color:var(--negative)!important;border-color:color-mix(in srgb,var(--negative) 50%,transparent)!important}
:root[data-theme] #saveDestinationField{margin-bottom:6px}

/* ---- Cuenta ---- */
:root[data-theme] #userProfile>.panel{margin-top:18px}
:root[data-theme] .north-cloud-actions{gap:12px}
:root[data-theme] .north-cloud-actions button{
  min-height:50px;border-radius:var(--r-m);border:1px solid var(--line);
  background:var(--surface2)!important;color:var(--ink)!important;font-weight:600;font-size:16px}
:root[data-theme] #northSyncNow{background:var(--accent)!important;color:var(--accent-ink)!important;border-color:transparent}
:root[data-theme="light"] #northSyncNow{background:var(--r-forest)!important;color:var(--r-cream)!important}
:root[data-theme] #northConflict{border-color:color-mix(in srgb,#D8973E 60%,var(--line))}

/* ---- Apariencia ---- */
:root[data-theme] .appearance-setting{display:grid!important;grid-template-columns:1fr!important;gap:14px;padding:6px 0 4px;border:0}
:root[data-theme] .appearance-setting .info small{display:block;font-size:13px;margin-top:4px;color:var(--muted)}
:root[data-theme] .appearance-setting .info b{font-size:18px}
:root[data-theme] .theme-options{width:100%}

/* ---- Requiere atención: tarjeta igual que las demás ---- */
:root[data-theme] #homeAttention .structure-link{
  width:100%;display:flex;align-items:center;gap:12px;padding:16px;
  background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:var(--r-m)!important;
  text-align:left;color:var(--ink)}
:root[data-theme] #homeAttention .structure-link span{flex:1;min-width:0}
:root[data-theme] #homeAttention .structure-link small{display:block;margin-top:2px;color:var(--muted)}
:root[data-theme] #homeAttention .structure-quiet{border:1px dashed var(--line);border-radius:var(--r-m);padding:18px;text-align:center;background:transparent}

/* ---- Menú de tareas: ventana anclada al botón, siempre visible ---- */
:root[data-theme] .rumbo-scrim{background:transparent}
:root[data-theme] .rumbo-pop{
  position:fixed;z-index:95;min-width:200px;max-width:min(280px,calc(100vw - 24px));
  padding:6px;border-radius:18px;
  background:color-mix(in srgb,var(--surface) 90%,transparent);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);
  border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);
  box-shadow:0 18px 50px rgba(0,0,0,.38);
  transform-origin:var(--ox,100%) var(--oy,0%);
  animation:rumboPop .26s cubic-bezier(.32,.72,0,1) both}
@keyframes rumboPop{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:none}}
:root[data-theme] .rumbo-pop button{
  display:flex;align-items:center;width:100%;min-height:50px;padding:0 16px;border:0;border-radius:13px;
  background:transparent;color:var(--ink);font-size:16px;font-weight:600;text-align:left}
:root[data-theme] .rumbo-pop button+button{border-top:1px solid var(--line);border-radius:0 0 13px 13px}
:root[data-theme] .rumbo-pop button:last-child{color:var(--negative)}

/* ---- Hojas y movimiento estilo iOS ---- */
@keyframes rumboFade{from{opacity:0}to{opacity:1}}
/* (v58) las hojas originales conservan su propia animación y su centrado */

:root[data-theme] #categoryBackdrop{z-index:110!important}
:root[data-theme] button,:root[data-theme] [role="button"],:root[data-theme] .structure-link{
  transition:transform .22s cubic-bezier(.32,.72,0,1),background-color .22s,opacity .22s}
:root[data-theme] button:active,:root[data-theme] [role="button"]:active{transform:scale(.97)}
:root[data-theme] .nav button:active{transform:scale(.94)}
@keyframes rumboRowIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  :root[data-theme] .page.active :is(.row,.bank-account,.task-card,.plan-card,.overview-card){
    animation:rumboRowIn .5s cubic-bezier(.32,.72,0,1) both}
  :root[data-theme] .page.active :is(.row,.bank-account,.task-card,.plan-card):nth-child(2){animation-delay:.04s}
  :root[data-theme] .page.active :is(.row,.bank-account,.task-card,.plan-card):nth-child(3){animation-delay:.08s}
  :root[data-theme] .page.active :is(.row,.bank-account,.task-card,.plan-card):nth-child(4){animation-delay:.12s}
  :root[data-theme] .page.active :is(.row,.bank-account,.task-card,.plan-card):nth-child(n+5){animation-delay:.16s}}


/* ---- Campo de fecha/hora propio ---- */
.rp-hidden{display:none!important}
:root[data-theme] .rp-field{
  width:100%;min-height:52px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--surface2)!important;color:var(--ink)!important;border:1px solid var(--line)!important;
  border-radius:var(--r-m)!important;font:inherit;font-size:16px;text-align:left}
:root[data-theme] .rp-field.empty .rp-text{color:var(--muted)}
:root[data-theme] .rp-field .rp-icon svg{width:22px;height:22px;fill:none;stroke:var(--accent);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.rp-backdrop{position:fixed;inset:0;z-index:130;display:flex;align-items:flex-end;justify-content:center;
  background:rgba(0,0,0,.5);animation:rumboFade .25s ease both}
.rp-sheet{width:min(100%,520px);max-height:92dvh;overflow:auto;padding:10px 20px calc(20px + env(safe-area-inset-bottom));
  background:var(--canvas);color:var(--ink);border-radius:26px 26px 0 0;border:1px solid var(--line);border-bottom:0}
.rp-handle{width:40px;height:5px;border-radius:3px;background:var(--line);margin:4px auto 14px}
.rp-title{font-size:18px;font-weight:800;letter-spacing:-.03em;margin-bottom:10px}
.rp-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.rp-cal-label{font-size:18px;font-weight:700}
.rp-nav{width:44px;height:44px;border-radius:14px;border:1px solid var(--line);background:transparent;display:grid;place-items:center;color:var(--ink)}
.rp-nav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rp-week,.rp-grid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.rp-week span{font-size:13px;font-weight:700;color:var(--muted);padding:6px 0}
.rp-grid{row-gap:4px}
.rp-day{height:46px;width:46px;border:0;border-radius:50%;background:transparent;color:var(--ink);font-size:16px;font-variant-numeric:tabular-nums;margin:0 auto}
.rp-day.today{box-shadow:inset 0 0 0 1.5px var(--accent)}
.rp-day.selected{background:var(--accent);color:var(--accent-ink);font-weight:700}
.rp-day:disabled{opacity:.3}
.rp-foot{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.rp-primary,.rp-secondary{min-height:50px;border-radius:var(--r-m);font:inherit;font-size:16px;font-weight:700}
.rp-primary{border:0;background:var(--accent);color:var(--accent-ink)}
.rp-secondary{border:1px solid var(--line);background:transparent;color:var(--ink)}
:root[data-theme="light"] .rp-primary,:root[data-theme="light"] .rp-day.selected{background:var(--r-forest);color:var(--r-cream)}
.rp-time{position:relative;height:220px;margin:6px 0}
.rp-band{position:absolute;left:0;right:0;top:88px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--ink) 9%,transparent);pointer-events:none}
.rp-cols{position:relative;display:flex;align-items:stretch;justify-content:center;gap:6px;height:100%}
.rp-wheel{width:84px;height:100%;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent)}
.rp-wheel::-webkit-scrollbar{display:none}
.rp-pad{height:88px}
.rp-item{height:44px;display:grid;place-items:center;scroll-snap-align:center;font-size:22px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.rp-item.on{color:var(--ink)}
.rp-colon{align-self:center;font-size:28px;font-weight:700}
.rp-seg{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--surface2);border:1px solid var(--line)}
.rp-seg-btn{flex:1;min-height:44px;padding:0 10px;border:0;border-radius:11px;background:transparent;color:var(--muted);font:inherit;font-size:16px;font-weight:600;
  transition:background .28s cubic-bezier(.32,.72,0,1),color .2s,box-shadow .28s}
.rp-seg-btn.on{background:var(--canvas);color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.22)}

/* ---- Editor de recurrentes ---- */
:root[data-theme] .rp-chips{display:flex;flex-wrap:wrap;gap:8px}
:root[data-theme] .rp-chip{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:16px;font-weight:600}
:root[data-theme] .rp-chip[aria-checked="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
:root[data-theme="light"] .rp-chip[aria-checked="true"]{background:var(--r-forest);border-color:var(--r-forest);color:var(--r-cream)}
.rc-block[hidden]{display:none!important}
.rc-preview{margin:4px 0;padding:12px 14px;border-radius:var(--r-m);background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--ink);font-size:16px;font-weight:600}
.rc-preview:empty{display:none}
.rc-note{font-size:13px;margin-top:6px}

/* ---- Pregunta «¿ya se cumplió?» ---- */
.rc-prompt-backdrop{position:fixed;inset:0;z-index:140;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.55);animation:rumboFade .25s ease both}
.rc-prompt{width:min(100%,520px);padding:10px 22px calc(22px + env(safe-area-inset-bottom));background:var(--canvas);color:var(--ink);
  border-radius:26px 26px 0 0;border:1px solid var(--line);border-bottom:0}
.rc-handle{width:40px;height:5px;border-radius:3px;background:var(--line);margin:4px auto 14px}
.rc-prompt small{color:var(--muted);font-size:13px}
.rc-prompt h3{font-size:28px;font-weight:800;letter-spacing:-.04em;margin:4px 0 10px}
.rc-prompt p{font-size:16px;line-height:1.5;margin:0 0 16px}
.rc-prompt button{display:block;width:100%;min-height:52px;margin-top:10px;border-radius:var(--r-m);font:inherit;font-size:16px;font-weight:700}
.rc-yes{border:0;background:var(--accent);color:var(--accent-ink)}
:root[data-theme="light"] .rc-yes{background:var(--r-forest);color:var(--r-cream)}
.rc-later{border:1px solid var(--line);background:transparent;color:var(--ink)}
.rc-skip{border:0;background:transparent;color:var(--muted);font-weight:600}

/* ---- Línea de tiempo ---- */
.rc-group{margin:20px 0 6px;font-size:13px;font-weight:800;letter-spacing:.02em;color:var(--muted)}
.rc-day{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.rc-date{display:grid;place-items:center;align-content:center;height:52px;border-radius:14px;background:var(--surface2)}
.rc-date small{font-size:11px;text-transform:uppercase;color:var(--muted);font-weight:700;line-height:1}
.rc-date b{font-size:18px;line-height:1.1}
.rc-items{display:grid;gap:10px}
.rc-item{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:center}
.rc-item small{display:block;color:var(--muted);font-size:13px}
.rc-item strong{font-variant-numeric:tabular-nums}
.rc-dot{width:10px;height:10px;border-radius:50%;background:var(--negative)}
.rc-dot.income{background:var(--positive)}
.rc-totals{display:flex;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:16px}
.rc-totals b{margin-left:6px;font-variant-numeric:tabular-nums}