:root{
  --dgaia-bg:#f4faf8;
  --dgaia-panel:#ffffff;
  --dgaia-ink:#082b2d;
  --dgaia-muted:#647c7d;
  --dgaia-line:#dcebe8;
  --dgaia-soft:#eaf6f3;
  --dgaia-accent:#008f7a;
  --dgaia-blue:#2563eb;
  --dgaia-green:#0f9f5f;
  --dgaia-shadow:0 18px 42px rgba(8,43,45,.07);
}

body{
  background:var(--dgaia-bg)!important;
  color:var(--dgaia-ink)!important;
}

body > header,
.header,
.topbar{
  background:#fff!important;
  border-bottom:1px solid var(--dgaia-line)!important;
  box-shadow:0 8px 28px rgba(8,43,45,.06)!important;
}

main,
.container,
.page,
.content{
  max-width:1440px!important;
  width:calc(100% - 48px)!important;
  margin:0 auto!important;
}

.card,
.panel,
section{
  border:1px solid var(--dgaia-line)!important;
  border-radius:22px!important;
  background:var(--dgaia-panel)!important;
  box-shadow:var(--dgaia-shadow)!important;
}

button,
.btn{
  border-radius:13px!important;
  font-weight:850!important;
  min-height:40px!important;
  box-shadow:none!important;
}

input,
select,
textarea{
  border:1px solid #cbd8d6!important;
  border-radius:12px!important;
  min-height:40px!important;
  color:var(--dgaia-ink)!important;
}

.planning,
.planificacion,
.service-planning{
  max-width:1180px!important;
  margin:28px auto!important;
  padding:24px!important;
}

.planning > div,
.planificacion > div{
  gap:16px!important;
}

.inventory,
.inventory-list,
.stock-list{
  background:#fff!important;
  border-radius:18px!important;
}

.recipe-card,
.product-card,
.dish-card,
.item-card{
  border:1px solid var(--dgaia-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  padding:16px!important;
  box-shadow:0 10px 28px rgba(8,43,45,.045)!important;
}

.recipe-card:hover,
.product-card:hover,
.dish-card:hover,
.item-card:hover{
  border-color:rgba(0,143,122,.38)!important;
}

.badge,
.status,
.available{
  border-radius:999px!important;
  font-weight:900!important;
  padding:4px 9px!important;
}

@media(max-width:900px){
  main,
  .container,
  .page,
  .content{
    width:calc(100% - 24px)!important;
  }

  .planning,
  .planificacion,
  .service-planning{
    margin:18px auto!important;
    padding:18px!important;
  }

  .grid,
  .columns{
    grid-template-columns:1fr!important;
  }
}

/* Corrección Maquetador DGAIA: estados sin solapar texto */
.recipe-card,
.product-card,
.dish-card,
.item-card,
[class*="recipe"],
[class*="dish"],
[class*="plate"]{
  position:relative!important;
  overflow:hidden!important;
}

.recipe-card label,
.product-card label,
.dish-card label,
.item-card label{
  display:flex!important;
  align-items:flex-start!important;
  gap:9px!important;
  margin-bottom:10px!important;
  min-height:24px!important;
  line-height:1.35!important;
}

.recipe-card input[type="checkbox"],
.product-card input[type="checkbox"],
.dish-card input[type="checkbox"],
.item-card input[type="checkbox"]{
  flex:0 0 auto!important;
  width:16px!important;
  height:16px!important;
  min-height:16px!important;
  margin-top:2px!important;
}

.recipe-card .badge,
.product-card .badge,
.dish-card .badge,
.item-card .badge,
.recipe-card .status,
.product-card .status,
.dish-card .status,
.item-card .status,
.recipe-card .available,
.product-card .available,
.dish-card .available,
.item-card .available,
[class*="recipe"] .badge,
[class*="dish"] .badge,
[class*="plate"] .badge,
[class*="recipe"] .status,
[class*="dish"] .status,
[class*="plate"] .status,
[class*="recipe"] .available,
[class*="dish"] .available,
[class*="plate"] .available{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 0 8px 0!important;
  position:static!important;
  float:none!important;
  clear:both!important;
  font-size:11px!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  vertical-align:middle!important;
  z-index:auto!important;
}

.recipe-card p,
.product-card p,
.dish-card p,
.item-card p,
[class*="recipe"] p,
[class*="dish"] p,
[class*="plate"] p{
  display:block!important;
  clear:both!important;
  margin:6px 0 10px 0!important;
  line-height:1.45!important;
  color:#647c7d!important;
  overflow-wrap:anywhere!important;
}

.recipe-card select,
.product-card select,
.dish-card select,
.item-card select,
.recipe-card input[type="number"],
.product-card input[type="number"],
.dish-card input[type="number"],
.item-card input[type="number"]{
  width:100%!important;
  margin-top:8px!important;
}

/* Si las tarjetas están en una rejilla, darles aire suficiente */
[class*="grid"] .recipe-card,
[class*="grid"] .dish-card,
[class*="grid"] .product-card,
[class*="grid"] .item-card{
  min-height:178px!important;
}

/* Maquetador DGAIA: legibilidad cocina + ocultar selector visual de tema */
body{
  font-size:16px!important;
  line-height:1.45!important;
}

h1,h2,h3,h4,
.recipe-card strong,
.product-card strong,
.dish-card strong,
.item-card strong,
label{
  color:#061f24!important;
  font-weight:900!important;
  letter-spacing:-.01em!important;
}

.recipe-card,
.product-card,
.dish-card,
.item-card{
  padding:20px!important;
  min-height:215px!important;
}

.recipe-card p,
.product-card p,
.dish-card p,
.item-card p,
[class*="recipe"] p,
[class*="dish"] p,
[class*="plate"] p{
  color:#344b4e!important;
  font-size:14px!important;
  line-height:1.55!important;
  margin:10px 0 12px 0!important;
}

.badge,
.status,
.available,
[class*="available"],
[class*="disponible"]{
  background:#06784f!important;
  color:#ffffff!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  padding:6px 10px!important;
}

select,
input,
textarea{
  font-size:15px!important;
  color:#061f24!important;
  background:#fff!important;
}

/* Ocultar botones flotantes Claro/Oscuro solo en frontend */
.theme-toggle,
.theme-switcher,
.theme-buttons,
#themeToggle,
#themeSwitch,
#darkModeToggle,
#lightModeToggle,
button[onclick*="dark"],
button[onclick*="light"],
button[onclick*="theme"],
button[onclick*="oscuro"],
button[onclick*="claro"]{
  display:none!important;
}

/* Ocultar contenedor flotante inferior si solo contiene Claro/Oscuro */
body > div:last-child:has(button){
  display:none!important;
}
