/* ============================================================
   YOLIA — Sistema de diseño real (aprobado 3 de agosto 2026)
   Crema + verde oliva + naranja terracota, mucha iconografía.
   ============================================================ */
:root{
  --yolia-cream:#F6F1E4; --yolia-cream-2:#EFE7D2;
  --yolia-olive:#5C6B47; --yolia-olive-dark:#3B4530; --yolia-olive-light:#E7EDDC;
  --yolia-terracotta:#D9723F; --yolia-terracotta-light:#FBE4D3; --yolia-terracotta-dark:#A8541F;
  --yolia-ink:#2A2A22; --yolia-dim:#7C7A66; --yolia-line:#E3D9BE;
  --yolia-card:#FFFDF7;
}
.yolia-app{font-family:'Inter',sans-serif;background:var(--yolia-cream);color:var(--yolia-ink);display:flex;flex-direction:column;min-height:100vh}
.yolia-app .icon{display:inline-flex;align-items:center;justify-content:center}
.yolia-app .icon svg{width:1em;height:1em;display:block}

/* YOLIA_FIX_2026 (pedido de Eduardo): "el texto esta muy pequeño... si
   quiero subirle 1,2 punto al texto en general (<p></p>)". La mayoria de
   los parrafos de contenido (ej. los del recuadro "Leer completo" en
   Home) no traian NINGUN font-size propio -- ni de clase ni en linea --
   asi que heredaban el default del navegador y en pantallas chicas se
   sentian pequeños. Esta regla es a proposito muy simple (selector "p"
   sin clase), para que suba solo esos parrafos "genericos": cualquier
   <p> que ya declare su propio font-size mas especifico (leyendas de
   tarjeta, pie de pagina, etiquetas chicas, etc. -- todas via selectores
   con clase, ej. ".yolia-case p" o ".yolia-footer p") sigue ganando por
   especificidad de CSS y NO se ve afectado por este cambio. */
p{font-size:16.5px;line-height:1.7}

/* CONTROLES DE FORMULARIO — estilo base para CUALQUIER input/select/textarea
   del sitio, tenga o no la clase .yolia-field, para que ningún formulario se
   vea "sin terminar". Las reglas más específicas de abajo (.yolia-field, etc.)
   siguen pudiendo afinar casos puntuales. */
.yolia-app input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="file"]),
.yolia-app select,
.yolia-app textarea{
  width:100%;border:2px solid var(--yolia-olive-dark);background:var(--yolia-card);
  border-radius:10px;padding:11px 14px;font-size:14px;font-family:inherit;color:var(--yolia-ink);
  box-sizing:border-box;transition:border-color .15s ease,box-shadow .15s ease;
}
.yolia-app select{
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="9" viewBox="0 0 14 9"><path d="M1 1l6 6 6-6" stroke="%233B4530" stroke-width="2.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  background-repeat:no-repeat;background-position:right 16px center;padding-right:40px;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;
}
.yolia-app input:focus,.yolia-app select:focus,.yolia-app textarea:focus{
  outline:none;border-color:var(--yolia-terracotta);box-shadow:0 0 0 4px rgba(217,114,63,.16);
}
.yolia-app input:hover:not(:focus):not(:disabled),.yolia-app select:hover:not(:focus):not(:disabled),.yolia-app textarea:hover:not(:focus):not(:disabled){border-color:var(--yolia-olive)}
.yolia-app input::placeholder,.yolia-app textarea::placeholder{color:var(--yolia-dim);opacity:.75}
.yolia-app input:disabled,.yolia-app select:disabled,.yolia-app textarea:disabled{opacity:.55;cursor:not-allowed;background:var(--yolia-cream-2)}
/* Quita las flechitas del sistema operativo en los campos numéricos: se ven
   distintas en cada navegador y chocan con el borde redondeado del diseño. */
.yolia-app input[type="number"]{-moz-appearance:textfield}
.yolia-app input[type="number"]::-webkit-outer-spin-button,
.yolia-app input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* INTERRUPTOR (switch) — para preguntas de sí/no, alternativa a un checkbox suelto */
.yolia-switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--yolia-card);border:2px solid var(--yolia-line);border-radius:10px;padding:12px 14px;margin-bottom:8px}
.yolia-switch-row span{font-size:14px;font-weight:600;color:var(--yolia-ink)}
.yolia-switch{position:relative;display:inline-block;width:44px;height:26px;flex-shrink:0}
.yolia-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.yolia-switch .track{position:absolute;inset:0;background:var(--yolia-line);border-radius:999px;transition:background .15s ease}
.yolia-switch .track::before{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .15s ease;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.yolia-switch input:checked ~ .track{background:var(--yolia-terracotta)}
.yolia-switch input:checked ~ .track::before{transform:translateX(18px)}
.yolia-switch input:focus-visible ~ .track{box-shadow:0 0 0 3px rgba(217,114,63,.3)}

/* NAVBAR */
.yolia-topnav{background:var(--yolia-card);border-bottom:1px solid var(--yolia-line);padding:0 32px;display:flex;align-items:center;justify-content:space-between;height:66px;position:sticky;top:0;z-index:20}
.yolia-topnav-brand img{height:36px;width:auto;display:block}
.yolia-topnav-links{display:flex;gap:26px;font-size:13.5px;color:var(--yolia-dim);font-weight:500}
.yolia-topnav-links a{color:inherit;text-decoration:none}
.yolia-topnav-cta{display:flex;align-items:center;gap:12px}
.yolia-btn-ghost{border:2px solid var(--yolia-olive-dark);background:var(--yolia-card);color:var(--yolia-olive-dark);font-size:13px;font-weight:800;padding:11px 22px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:all .15s ease}
.yolia-btn-ghost:hover{background:var(--yolia-olive-light)}
.yolia-btn-solid{background:var(--yolia-terracotta);color:#fff;font-size:13px;font-weight:800;padding:12px 24px;border-radius:8px;cursor:pointer;border:2px solid var(--yolia-terracotta-dark);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:all .15s ease}
.yolia-btn-solid:hover{background:var(--yolia-terracotta-dark)}
.yolia-btn-solid:active,.yolia-btn-ghost:active{transform:scale(.98)}
.yolia-btn-icon{width:42px;height:42px;border-radius:8px;border:2px solid var(--yolia-olive-dark);background:var(--yolia-card);display:inline-flex;align-items:center;justify-content:center;color:var(--yolia-olive-dark);cursor:pointer}
.yolia-btn-icon:hover{background:var(--yolia-olive-light)}
.yolia-icon-btn{width:40px;height:40px;border-radius:12px;background:var(--yolia-card);border:1px solid var(--yolia-line);display:flex;align-items:center;justify-content:center;position:relative;color:var(--yolia-dim);font-size:18px}
.yolia-icon-btn .dot{position:absolute;top:7px;right:7px;width:7px;height:7px;background:var(--yolia-terracotta);border-radius:50%}
.yolia-avatar{width:40px;height:40px;border-radius:50%;background:var(--yolia-terracotta);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}

/* LAYOUT: sidebar + main */
.yolia-app-row{display:flex;flex:1}
.yolia-sidebar{width:236px;flex-shrink:0;background:var(--yolia-card);border-right:1px solid var(--yolia-line);padding:22px 16px;display:flex;flex-direction:column;position:sticky;top:66px;height:calc(100vh - 66px)}
.yolia-side-link{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;font-size:14px;font-weight:500;color:var(--yolia-dim);text-decoration:none;margin-bottom:2px}
.yolia-side-link .icon{font-size:18px;width:20px}
.yolia-side-link.active{background:var(--yolia-olive-light);color:var(--yolia-olive-dark);font-weight:600}
.yolia-side-link:hover:not(.active){background:var(--yolia-cream-2)}
.yolia-side-divider{height:1px;background:var(--yolia-line);margin:14px 6px}
.yolia-side-bottom{margin-top:auto}
.yolia-main{flex:1;padding:28px 36px;max-width:1160px}

/* HERO / TOPBAR de cada pantalla */
.yolia-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}
.yolia-eyebrow{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--yolia-terracotta-dark)}
.yolia-app h1{font-family:'Fraunces',serif;font-weight:600;font-size:28px;color:var(--yolia-olive-dark);margin-top:4px}

/* STAT CARDS */
.yolia-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:26px}
.yolia-stat{background:var(--yolia-card);border:1px solid var(--yolia-line);border-radius:16px;padding:18px}
.yolia-stat-icon{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:21px;margin-bottom:12px}
.yolia-stat .n{font-family:'Fraunces',serif;font-weight:600;font-size:26px}
.yolia-stat .l{font-size:12.5px;color:var(--yolia-dim);margin-top:2px}

/* PANELS de 2 columnas */
.yolia-grid2{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-bottom:26px}
.yolia-panel{background:var(--yolia-card);border:1px solid var(--yolia-line);border-radius:18px;padding:22px}
.yolia-panel h3{font-family:'Fraunces',serif;font-weight:600;font-size:16px;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.yolia-panel h3 .icon{color:var(--yolia-terracotta);font-size:18px}

/* Actividad reciente */
.yolia-activity{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--yolia-cream-2)}
.yolia-activity:last-child{border-bottom:none}
.yolia-activity-icon{width:36px;height:36px;border-radius:10px;background:var(--yolia-olive-light);color:var(--yolia-olive-dark);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:17px}
.yolia-activity .t{font-size:13.5px;font-weight:600}
.yolia-activity .s{font-size:12px;color:var(--yolia-dim)}
.yolia-activity .time{margin-left:auto;font-size:11px;color:var(--yolia-dim)}

/* Dona */
.yolia-donut-wrap{display:flex;align-items:center;justify-content:center;position:relative;margin:10px 0}
.yolia-donut{width:130px;height:130px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.yolia-donut-hole{width:78px;height:78px;border-radius:50%;background:var(--yolia-card);display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:inset 0 0 0 1px var(--yolia-line)}
.yolia-donut-hole .n{font-family:'Fraunces',serif;font-weight:600;font-size:22px;color:var(--yolia-ink)}
.yolia-donut-hole .l{font-size:10px;color:var(--yolia-dim)}
.yolia-legend{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.yolia-legend-item{display:flex;align-items:center;gap:8px;font-size:12.5px}
.yolia-legend-dot{width:9px;height:9px;border-radius:50%}

/* Franja de foto/estadísticas naranja translúcida */
.yolia-photo-stat-band{position:relative;border-radius:18px;overflow:hidden;margin-bottom:26px;background:linear-gradient(120deg,#C98A4A,#E8B36B 45%,#C98A4A)}
.yolia-photo-stat-band::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(90,50,10,.55),rgba(160,90,30,.35))}
.yolia-photo-stat-row{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;padding:22px 26px}
.yolia-photo-stat{display:flex;align-items:center;gap:12px;color:#fff}
.yolia-photo-stat-icon{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.yolia-photo-stat .n{font-family:'Fraunces',serif;font-weight:600;font-size:20px;line-height:1}
.yolia-photo-stat .l{font-size:11px;color:rgba(255,255,255,.85);margin-top:2px}

/* Banner de consejo */
.yolia-tip-banner{background:linear-gradient(135deg,var(--yolia-olive-dark),var(--yolia-olive));border-radius:16px;padding:18px 22px;color:#fff;display:flex;align-items:center;gap:14px;margin-bottom:26px}
.yolia-tip-banner .icon{font-size:22px;color:#D9E8C9;flex-shrink:0}

/* Secciones y tarjetas de caso */
.yolia-section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.yolia-section-title h3{font-family:'Fraunces',serif;font-weight:600;font-size:17px;display:flex;align-items:center;gap:8px}
.yolia-section-title h3 .icon{color:var(--yolia-terracotta)}
.yolia-section-title a{font-size:12.5px;color:var(--yolia-terracotta-dark);font-weight:600;text-decoration:none}
.yolia-cases{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.yolia-case{background:var(--yolia-card);border:1px solid var(--yolia-line);border-radius:16px;padding:16px}
.yolia-case-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.yolia-case-icon{width:38px;height:38px;border-radius:11px;background:var(--yolia-terracotta-light);color:var(--yolia-terracotta-dark);display:flex;align-items:center;justify-content:center;font-size:19px}
.yolia-case h4{font-size:14.5px;font-weight:700}
.yolia-case p{font-size:12px;color:var(--yolia-dim)}
.yolia-case-tag{display:inline-block;margin-top:10px;font-size:10.5px;font-weight:700;background:var(--yolia-olive-light);color:var(--yolia-olive-dark);padding:3px 9px;border-radius:999px}

/* Tablas dentro del sistema (para Admin y listas densas) */
.yolia-table-wrap{background:var(--yolia-card);border:1px solid var(--yolia-line);border-radius:16px;overflow:hidden}
.yolia-table{width:100%;border-collapse:collapse;font-size:13.5px}
.yolia-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--yolia-dim);font-weight:700;padding:12px 16px;background:var(--yolia-cream-2);border-bottom:1px solid var(--yolia-line)}
.yolia-table td{padding:12px 16px;border-bottom:1px solid var(--yolia-cream-2)}
.yolia-table tr:last-child td{border-bottom:none}

/* Formularios dentro del sistema */
.yolia-field{margin-bottom:16px}
.yolia-field label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--yolia-olive-dark);margin-bottom:6px}
.yolia-field small{color:var(--yolia-dim);font-weight:400}
.yolia-field input,.yolia-field textarea{width:100%;border:2px solid var(--yolia-olive-dark);background:var(--yolia-card);border-radius:8px;padding:11px 14px;font-size:14px;font-family:inherit;color:var(--yolia-ink);box-sizing:border-box}
.yolia-field select{width:100%;border:2px solid var(--yolia-olive-dark);background:var(--yolia-card) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="9" viewBox="0 0 14 9"><path d="M1 1l6 6 6-6" stroke="%233B4530" stroke-width="2.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat right 16px center;border-radius:8px;padding:11px 40px 11px 14px;font-size:14px;font-family:inherit;color:var(--yolia-ink);appearance:none;-webkit-appearance:none;cursor:pointer;box-sizing:border-box}
.yolia-field input:focus,.yolia-field select:focus,.yolia-field textarea:focus{outline:none;border-color:var(--yolia-terracotta)}
.yolia-field input::placeholder,.yolia-field textarea::placeholder{color:var(--yolia-dim);opacity:.75}
.yolia-select-standalone{border:2px solid var(--yolia-olive-dark);background:var(--yolia-card) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="9" viewBox="0 0 14 9"><path d="M1 1l6 6 6-6" stroke="%233B4530" stroke-width="2.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat right 16px center;border-radius:8px;padding:10px 40px 10px 14px;font-size:14px;font-family:inherit;color:var(--yolia-ink);appearance:none;-webkit-appearance:none;cursor:pointer}
.yolia-select-standalone:focus{outline:none;border-color:var(--yolia-terracotta)}
input[type="radio"],input[type="checkbox"]{accent-color:var(--yolia-terracotta);width:17px;height:17px;cursor:pointer;vertical-align:-3px}
.yolia-radio-row,.yolia-check-row{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--yolia-ink);background:var(--yolia-card);border:2px solid var(--yolia-line);border-radius:8px;padding:10px 14px;margin-bottom:8px;cursor:pointer}
.yolia-radio-row:has(input:checked),.yolia-check-row:has(input:checked){background:var(--yolia-olive-light);border-color:var(--yolia-olive-dark)}

/* FOOTER */
.yolia-footer{background:var(--yolia-olive-dark);color:#D9E0CE;padding:36px 36px 22px;margin-top:auto}
.yolia-footer-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;max-width:1160px}
.yolia-footer-brand img{height:34px;width:auto;display:block;margin-bottom:8px}
.yolia-footer p{font-size:12.5px;color:#AEBE9E;max-width:260px}
.yolia-footer-col h5{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#fff;margin-bottom:10px}
.yolia-footer-col a{display:block;font-size:12.5px;color:#AEBE9E;text-decoration:none;margin-bottom:7px}
.yolia-footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:24px;padding-top:16px;font-size:11.5px;color:#8CA079;max-width:1160px}

@media (max-width: 860px){
  .yolia-sidebar{display:none}
  .yolia-topnav-links{display:none}
  .yolia-stats{grid-template-columns:repeat(2,1fr)}
  .yolia-grid2{grid-template-columns:1fr}
  .yolia-main{padding:20px}
}