/* Manual de marca, páginas 6 y 9. Los colores de estado conservan su significado clínico. */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');
@font-face {
  font-family:'Brand';
  src:url('../fonts/brand/Brand.otf') format('opentype'),url('../fonts/brand/Brand.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
:root, [data-theme="nut2"] {
  --brand-deep: #2D1A14;
  --brand-primary: #834A37;
  --brand-copper: #B58061;
  --brand-sand: #D8B9A4;
  --brand-cream: #F1E1D7;
  --brand-white: #FFFFFF;
  --brand-font: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --brand-font-display: 'Brand', 'Poppins', Georgia, serif;
  --bg: var(--brand-cream);
  --surface: var(--brand-white);
  --surface-2: #FCF8F5;
  --surface-3: var(--brand-cream);
  --line: var(--brand-sand);
  --line-strong: var(--brand-copper);
  --ink: var(--brand-deep);
  --ink-2: #594039;
  --ink-3: #705248;
  --accent: var(--brand-primary);
  --accent-strong: var(--brand-deep);
  --accent-soft: var(--brand-cream);
  --font: var(--brand-font);
  --font-display: var(--brand-font-display);
  --verde-salud: var(--brand-primary);
  --verde-profundo: var(--brand-cream);
  --verde-oscuro: var(--brand-white);
  --blanco-clinico: var(--brand-deep);
  --beige-calido: var(--ink-2);
  --coral-suave: var(--brand-primary);
  --coral-hover: var(--brand-deep);
  --menta-clinica: var(--brand-primary);
  --gris-subtil: var(--ink-3);
  --panel-bg: var(--brand-cream);
  --panel-surface: var(--brand-white);
  --panel-surface-2: #FCF8F5;
  --panel-text: var(--brand-deep);
  --panel-text-muted: var(--ink-2);
  --panel-accent: var(--brand-primary);
  --panel-sidebar-bg: var(--brand-deep);
  --panel-sidebar-text: var(--brand-white);
  --panel-sidebar-muted: var(--brand-cream);
  --panel-sidebar-active-ink: var(--brand-deep);
}
body, button, input, select, textarea { font-family: var(--brand-font); }
/* Poppins para lectura y controles; Brand para la jerarquía expresiva. */
body :is(p,label,button,input,select,textarea,th,td,.care-eyebrow,.care-status,.step-indicator) { font-family:var(--brand-font)!important; }
/* Esta prioridad también corrige estilos inline heredados en los paneles. */
html body :is(h1,h2,h3,h4,h5,h6,[role="heading"],.script,.script-top,.signature-name,.signature-line,.brand-heading,.brand-highlight,.app-header__name,.sidebar-title,.auth-brand-title,.option-title,.recipe-title,.notif-title,.cat-title,.marquee span,.sobre-txt .quote,.private-media-toolbar strong) {
  font-family:var(--brand-font-display)!important;
  font-weight:400;
  font-synthesis:none;
  letter-spacing:normal;
  text-shadow: 0 1px 2px rgba(45, 26, 20, 0.12);
}
html body :is(h1,h2,h3,h4,h5,h6) :is(em,strong,span) { font-family:inherit!important;font-synthesis:none; }
/* Sombra más pronunciada para títulos sobre fondos oscuros o con imágenes */
.hero h1, .care-hero h3, .brand-logo--on-dark, header.scrolled h1, .sec-hero h1 {
  text-shadow: 0 2px 6px rgba(20, 10, 6, 0.45), 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}
.care-hero .care-eyebrow {color:var(--brand-cream);}
.care-card :is(.btn-primario,.btn-action-primary) {background:var(--brand-primary);color:#fff!important;}
html[data-theme] body .prog-cta-outline {background:#fff!important;color:var(--brand-primary)!important;border-color:var(--brand-primary)!important;}
html[data-theme] body :is(.prog-cta-glow,.prog-cta-vip) {background:var(--brand-primary)!important;color:#fff!important;box-shadow:none!important;text-shadow:none!important;}
html[data-theme] body :is(.prog-cta-glow,.prog-cta-vip):hover {background:var(--brand-deep)!important;box-shadow:none!important;}
.testi-grid {grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));}
.metodo-img .badge {background:var(--brand-deep)!important;color:#fff!important;border:1px solid var(--brand-sand);box-shadow:0 8px 24px #2d1a1433;}
.metodo-img .badge .n {color:var(--brand-sand)!important;}
.metodo-img .badge>span:not(.n) {color:#fff!important;font-size:14px;line-height:1.6;opacity:1!important;}
/* Barras verticales y horizontales: arena, terracota y remates redondeados. */
html,* {scrollbar-color:#834A37 #F1E1D7;scrollbar-width:thin;}
::-webkit-scrollbar {width:12px;height:12px;}
::-webkit-scrollbar-track {background:#F1E1D7;border-radius:12px;}
::-webkit-scrollbar-thumb {background:linear-gradient(135deg,#B58061,#834A37);border:3px solid #F1E1D7;border-radius:12px;min-height:36px;}
::-webkit-scrollbar-thumb:hover {background:#2D1A14;}
::-webkit-scrollbar-corner {background:#F1E1D7;}
.brand-radar {position:fixed;left:0;top:0;width:34px;height:34px;pointer-events:none;z-index:2147483647;opacity:0;transition:opacity .15s;will-change:transform;}
.brand-radar::before {content:'';position:absolute;left:23px;top:22px;width:19px;height:15px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M2 9h5l3-6 4 12 3-6h5' fill='none' stroke='%23834A37' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.7;filter:drop-shadow(0 1px 1px #fff);}
@media(hover:hover) and (pointer:fine){body {cursor:auto;}a,button {cursor:pointer;}input,textarea {cursor:text;}}
@media(pointer:coarse),(prefers-reduced-motion:reduce){.brand-radar {display:none;}}
.brand-logo { display:block; width:clamp(175px,22vw,275px); height:auto; object-fit:contain; padding:8px 0; flex-shrink:0; }
.brand-symbol { display:block; width:38px; height:38px; object-fit:contain; flex-shrink:0; }
.brand-logo--compact { width:190px; }
.brand-logo--footer { width:225px; }
.brand-logo--on-dark { display:none; }
header#siteHeader .brand-logo--on-light { display:none; }
header#siteHeader .brand-logo--on-dark { display:block; }
.app-header__brand { display:flex; align-items:center; gap:10px; }
.bio-brand .brand-logo { width:min(280px,75vw); }
.bio-shell { color:var(--brand-deep); }
body:has(.bio-shell) { background:var(--brand-cream); }
.bio-hero,.bio-link,.bio-testimonials article { background:var(--brand-white); }
.bio-link--primary,.bio-cta { background:var(--brand-primary); color:var(--brand-white); border-color:var(--brand-primary); }
.bio-cta:hover,.bio-cta:focus-visible { background:var(--brand-deep); }
.bio-kicker,.bio-testimonials cite { color:var(--brand-primary); }
.bio-copy h1,.bio-testimonials h2 { font-family:var(--brand-font-display); letter-spacing:normal; }
.bio-copy p,.bio-brand small,.bio-shell footer { color:var(--ink-2); }
.admin-workspace { --panel-accent:var(--brand-primary); --panel-bg:var(--brand-cream); }
.admin-workspace input,.admin-workspace select,.admin-workspace textarea,.admin-workspace label { color:var(--brand-deep); }
.admin-workspace input[type=checkbox],.admin-workspace input[type=radio] { accent-color:var(--brand-primary); }
.admin-workspace .sidebar-title { font-family:var(--brand-font-display)!important; }
body.admin-workspace .sidebar { background:var(--brand-deep)!important; }
body.admin-workspace .main-content { background:var(--brand-cream)!important; }
body.admin-workspace .sidebar .menu-item.active i { color:var(--brand-primary)!important; }
.app-header__brand,.app-header__id { min-width:0; }
.app-header__name { overflow-wrap:anywhere; }
header .header-buttons .btn-primario { background:var(--brand-primary)!important; }
header .logo { min-width:0; }
@media(max-width:900px) { header nav.wrap {gap:12px;} header .logo {margin-right:auto;} header .brand-logo {width:min(225px,65vw);} }
@media(max-width:375px) { .bio-copy {padding:20px;} .bio-copy h1 {font-size:1.9rem;} .bio-link {padding:15px;overflow-wrap:anywhere;} .app-header__brand {gap:6px;} .app-header__brand .brand-symbol {width:30px;height:30px;} }
.bio-media { background:var(--brand-sand); }
:focus-visible { outline:3px solid var(--brand-primary); outline-offset:4px; }
@media(max-width:420px) { .brand-logo { width:175px; } .brand-logo--footer { width:195px; } }
@media(prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} *,*::before,*::after {animation-duration:.01ms!important;transition-duration:.01ms!important;} }

/* ==============================================================
   COMPONENTE UNIVERSAL: BRAND SEARCH BOX (YELIFIT PRO)
   Garantiza que la lupa NUNCA quede detrás del texto ni bloquee clics
   ============================================================== */
.brand-search-box {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 44px !important;
  background: #ffffff !important;
  border: 1px solid #d8b9a4 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(45, 26, 20, 0.04) !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
  overflow: hidden !important;
}

.brand-search-box:focus-within {
  border-color: var(--verde-salud, #2e7d32) !important;
  box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.14) !important;
}

.brand-search-box .search-icon,
.brand-search-box > i.bi-search {
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #8c7668 !important;
  font-size: 15px !important;
  line-height: 1 !important;
  pointer-events: none !important;
  z-index: 2 !important;
  transition: color 0.18s ease !important;
}

.brand-search-box:focus-within .search-icon,
.brand-search-box:focus-within > i.bi-search {
  color: var(--verde-salud, #2e7d32) !important;
}

.brand-search-box .brand-search-input,
.brand-search-box input[type="search"],
.brand-search-box input[type="text"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 10px 38px 10px 42px !important; /* 42px garantiza CERO solapamiento con la lupa */
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #2d1a14 !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  line-height: 1.4 !important;
}

.brand-search-box input::placeholder {
  color: #8c7668 !important;
  opacity: 1 !important;
}

.brand-search-box .search-clear-btn {
  position: absolute !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: transparent !important;
  border: 0 !important;
  color: #8c7668 !important;
  font-size: 15px !important;
  padding: 4px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
}

.brand-search-box .search-clear-btn:hover {
  color: #2d1a14 !important;
}

/* ==============================================================
   SISTEMA BASE DE BOTONES DE ACCIÓN (ESTÁNDAR UNIVERSAL YELIFIT)
   ============================================================== */
.btn-action-primary,
.btn-primario {
  background: var(--brand-primary, #834a37) !important;
  color: #ffffff !important;
  border: 1.5px solid var(--brand-primary, #834a37) !important;
  border-radius: 10px;
  font-family: var(--brand-font, 'Poppins', sans-serif) !important;
  font-weight: 600 !important;
  font-size: 13.5px;
  min-height: 40px;
  padding: 8px 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(131, 74, 55, 0.18);
  transition: all 0.2s ease;
  user-select: none;
}
.btn-action-primary:hover,
.btn-primario:hover {
  background: var(--brand-deep, #2d1a14) !important;
  border-color: var(--brand-deep, #2d1a14) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(45, 26, 20, 0.25);
  transform: translateY(-1px);
}
.btn-action-primary:active,
.btn-primario:active {
  transform: translateY(1px);
  box-shadow: 0 1px 3px rgba(45, 26, 20, 0.15);
}

.btn-action-outline,
.btn-action-edit {
  background: #ffffff !important;
  color: var(--brand-primary, #834a37) !important;
  border: 1.5px solid rgba(131, 74, 55, 0.4) !important;
  border-radius: 10px;
  font-family: var(--brand-font, 'Poppins', sans-serif) !important;
  font-weight: 600 !important;
  font-size: 13px;
  min-height: 38px;
  padding: 7px 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  text-decoration: none !important;
  transition: all 0.2s ease;
  user-select: none;
}
.btn-action-outline:hover,
.btn-action-edit:hover {
  background: var(--brand-primary, #834a37) !important;
  color: #ffffff !important;
  border-color: var(--brand-primary, #834a37) !important;
  box-shadow: 0 4px 12px rgba(131, 74, 55, 0.22);
  transform: translateY(-1px);
}
.btn-action-outline:active,
.btn-action-edit:active {
  transform: translateY(1px);
}

.btn-action-danger,
.btn-peligro {
  background: #fff8f6 !important;
  color: #b42318 !important;
  border: 1.5px solid rgba(180, 35, 24, 0.3) !important;
  border-radius: 10px;
  font-family: var(--brand-font, 'Poppins', sans-serif) !important;
  font-weight: 600 !important;
  font-size: 13px;
  min-height: 38px;
  padding: 7px 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  text-decoration: none !important;
  transition: all 0.2s ease;
  user-select: none;
}
.btn-action-danger:hover,
.btn-peligro:hover {
  background: #b42318 !important;
  color: #ffffff !important;
  border-color: #b42318 !important;
  box-shadow: 0 4px 12px rgba(180, 35, 24, 0.25);
  transform: translateY(-1px);
}
.btn-action-danger:active,
.btn-peligro:active {
  transform: translateY(1px);
}

.btn-action-ghost,
.btn-ghost {
  background: transparent !important;
  color: #653c2d !important;
  border: 1px solid rgba(158, 91, 60, 0.2) !important;
  border-radius: 10px;
  font-family: var(--brand-font, 'Poppins', sans-serif) !important;
  font-weight: 600 !important;
  font-size: 13px;
  min-height: 38px;
  padding: 7px 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  text-decoration: none !important;
  transition: all 0.2s ease;
  user-select: none;
}
.btn-action-ghost:hover,
.btn-ghost:hover {
  background: #f1e1d7 !important;
  color: var(--brand-deep, #2d1a14) !important;
  border-color: rgba(158, 91, 60, 0.35) !important;
}
.btn-action-ghost:active,
.btn-ghost:active {
  transform: translateY(1px);
}

/* Modificadores de Tamaño Compacto para Tablas y Listas */
.btn-small,
.btn-compact {
  font-size: 12px !important;
  min-height: 32px !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  gap: 5px !important;
}

/* Normalización de iconos dentro de botones */
:is(.btn-primario, .btn-action-primary, .btn-action-outline, .btn-action-edit, .btn-action-danger, .btn-peligro, .btn-action-ghost, .btn-ghost, .btn-small, .btn-compact) i {
  font-size: 13.5px !important;
  color: inherit !important;
  display: inline-block !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}
:is(.btn-primario, .btn-action-primary, .btn-action-outline, .btn-action-edit, .btn-action-danger, .btn-peligro, .btn-action-ghost, .btn-ghost, .btn-small, .btn-compact):focus-visible {
  outline: 3px solid var(--brand-primary, #834a37) !important;
  outline-offset: 2px !important;
}