/**
 * assets/calculadora.css
 * Estilos de la Calculadora de Carbohidratos e IG
 *
 * © 2026 Ramiro Lóizaga — ramiroloizaga.com.ar
 * Todos los derechos reservados.
 */

/* ── Variables ──────────────────────────────────────────────────────────────── */
:root {
  --cdm-ink:          #1a1a1a;
  --cdm-ink-mid:      #4a4a4a;
  --cdm-ink-light:    #888;
  --cdm-cream:        #f8f6f1;
  --cdm-white:        #ffffff;
  --cdm-sage:         #3d5a4a;
  --cdm-sage-light:   #5a7a68;
  --cdm-sage-pale:    #edf2ee;
  --cdm-border:       #ddd8ce;
  --cdm-border-light: #ede8df;
  --cdm-accent:       #2c4a3a;
  --cdm-orange:       #e07a30;
  --cdm-orange-dark:  #c4641a;
}

/* ── Reset acotado al widget ────────────────────────────────────────────────── */
/* Usamos prefijo .cdm- para no pisar estilos de Elementor/Astra */
#cdm-calc-v3 *,
#cdm-calc-v3 *::before,
#cdm-calc-v3 *::after,
.mode-tabs *,
.mode-panel * {
  box-sizing: border-box;
}

/* ── MODE TABS ──────────────────────────────────────────────────────────────── */
.mode-tabs {
  display: flex;
  margin-bottom: 28px;
  background: var(--cdm-white);
  border: 1px solid var(--cdm-border);
  border-radius: 8px;
  overflow: hidden;
  width: fit-content;
}

.mode-tab {
  padding: 12px 24px;
  font-size: .85rem;
  font-weight: 500;
  color: var(--cdm-ink-mid);
  cursor: pointer;
  border: none;
  background: transparent;
  font-family: inherit;
  transition: all .2s;
  border-right: 1px solid var(--cdm-border);
  white-space: nowrap;
}
.mode-tab:last-child   { border-right: none; }
.mode-tab.active       { background: var(--cdm-sage); color: var(--cdm-white); }
.mode-tab:hover:not(.active) { background: var(--cdm-sage-pale); color: var(--cdm-sage); }

.mode-panel            { display: none; }
.mode-panel.active     { display: block; }

/* ── WIDGET BASE ────────────────────────────────────────────────────────────── */
#cdm-calc-v3 {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  width: 100%;
  line-height: 1.6;
  color: #333;
  background: transparent;
}

#cdm-calc-v3 .cdm-wrap {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 0;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 28px rgba(0,0,0,.08);
  border: 1px solid var(--cdm-border);
}

/* ── SIDEBAR ────────────────────────────────────────────────────────────────── */
#cdm-calc-v3 .cdm-sidebar {
  background: linear-gradient(160deg, #2c4a3a 0%, #3d5a4a 60%, #5a7a68 100%);
  color: #fff;
  padding: 28px 22px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  position: relative;
  overflow: hidden;
}
#cdm-calc-v3 .cdm-sidebar::before {
  content: "";
  position: absolute;
  top: -80px; right: -80px;
  width: 220px; height: 220px;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  pointer-events: none;
}
#cdm-calc-v3 .cdm-sidebar::after {
  content: "";
  position: absolute;
  bottom: -60px; left: -60px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: rgba(255,255,255,.03);
  pointer-events: none;
}

#cdm-calc-v3 .cdm-brand h1      { font-family: 'Cormorant Garamond', serif; font-size: 1.15em; font-weight: 500; line-height: 1.3; margin-bottom: 5px; }
#cdm-calc-v3 .cdm-brand p       { font-size: .82em; opacity: .82; }
#cdm-calc-v3 .cdm-brand .cdm-credit { margin-top: 8px; font-size: .72em; opacity: .65; }
#cdm-calc-v3 .cdm-brand .cdm-credit a { color: #9abfad; text-decoration: none; }

#cdm-calc-v3 .cdm-section-title { font-size: .68em; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; opacity: .6; margin-bottom: 8px; }

#cdm-calc-v3 .cdm-ig-cards      { display: flex; flex-direction: column; gap: 7px; }
#cdm-calc-v3 .cdm-ig-card       { border-radius: 8px; padding: 9px 12px; display: flex; align-items: flex-start; gap: 9px; background: rgba(255,255,255,.09); }
#cdm-calc-v3 .cdm-ig-card .cdm-dot         { width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0; margin-top: 4px; }
#cdm-calc-v3 .cdm-ig-card .cdm-dot.verde   { background: #74b899; }
#cdm-calc-v3 .cdm-ig-card .cdm-dot.amarillo{ background: #d4a843; }
#cdm-calc-v3 .cdm-ig-card .cdm-dot.rojo    { background: #c0544e; }
#cdm-calc-v3 .cdm-ig-card strong { font-size: .85em; display: block; margin-bottom: 1px; }
#cdm-calc-v3 .cdm-ig-card span  { font-size: .76em; opacity: .8; }

#cdm-calc-v3 .cdm-cg-row        { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
#cdm-calc-v3 .cdm-cg-item       { background: rgba(255,255,255,.09); border-radius: 8px; padding: 9px 6px; text-align: center; }
#cdm-calc-v3 .cdm-cg-item .cdm-cg-num   { font-size: 1em; font-weight: 700; }
#cdm-calc-v3 .cdm-cg-item .cdm-cg-label { font-size: .68em; opacity: .75; margin-top: 2px; }
#cdm-calc-v3 .cdm-cg-item.b .cdm-cg-num { color: #74b899; }
#cdm-calc-v3 .cdm-cg-item.m .cdm-cg-num { color: #d4a843; }
#cdm-calc-v3 .cdm-cg-item.a .cdm-cg-num { color: #c0544e; }

#cdm-calc-v3 .cdm-tip-box        { background: rgba(255,255,255,.09); border-radius: 8px; padding: 12px; font-size: .79em; line-height: 1.6; }
#cdm-calc-v3 .cdm-tip-box strong { display: block; margin-bottom: 5px; font-size: .95em; }
#cdm-calc-v3 .cdm-tip-box .cdm-formula { font-family: monospace; background: rgba(0,0,0,.18); border-radius: 4px; padding: 5px 9px; font-size: .88em; margin: 7px 0; display: block; }
#cdm-calc-v3 .cdm-disclaimer-side { background: rgba(255,255,255,.07); border-radius: 8px; padding: 11px 13px; font-size: .73em; opacity: .85; line-height: 1.5; margin-top: auto; }

/* ── MAIN ───────────────────────────────────────────────────────────────────── */
#cdm-calc-v3 .cdm-main       { background: #fbfaf7; padding: 28px 26px; display: flex; flex-direction: column; gap: 0; overflow-y: auto; }
#cdm-calc-v3 .cdm-step-label { display: flex; align-items: center; gap: 9px; font-weight: 500; color: #2c4a3a; font-size: .92em; margin-bottom: 5px; }
#cdm-calc-v3 .cdm-step-num   { background: #3d5a4a; color: #fff; width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .78em; flex-shrink: 0; }
#cdm-calc-v3 .cdm-hint       { color: #888; font-size: .8em; margin-bottom: 5px; }
#cdm-calc-v3 .cdm-fg         { margin-bottom: 18px; }

#cdm-calc-v3 select,
#cdm-calc-v3 input[type="number"],
#cdm-calc-v3 input[type="text"] {
  width: 100%;
  padding: 10px 13px;
  border: 2px solid #d8d3c8;
  border-radius: 6px;
  font-size: .92em;
  background: #fff;
  color: #333;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color .2s;
  outline: none;
  font-family: inherit;
}
#cdm-calc-v3 select:focus,
#cdm-calc-v3 input[type="number"]:focus,
#cdm-calc-v3 input[type="text"]:focus {
  border-color: #5a7a68;
  box-shadow: 0 0 0 3px rgba(90,122,104,.12);
}

#cdm-calc-v3 .cdm-porcion-ref { margin-top: 6px; font-size: .82em; color: #3d5a4a; font-weight: 500; }

#cdm-calc-v3 .cdm-btn         { width: 100%; padding: 12px; border: none; border-radius: 6px; font-size: .92em; font-weight: 500; cursor: pointer; transition: all .2s; margin-bottom: 9px; font-family: inherit; letter-spacing: .01em; }
#cdm-calc-v3 .cdm-btn-primary  { background: linear-gradient(135deg, #2c4a3a, #5a7a68); color: #fff; }
#cdm-calc-v3 .cdm-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(44,74,58,.28); }
#cdm-calc-v3 .cdm-btn-secondary { background: #fff; color: #2c4a3a; border: 2px solid #5a7a68; }
#cdm-calc-v3 .cdm-btn-secondary:hover { background: #edf2ee; }

/* ── RESULTADOS ─────────────────────────────────────────────────────────────── */
#cdm-calc-v3 .cdm-result-carbs { background: #fff; border: 2px solid #5a7a68; border-radius: 10px; padding: 20px; text-align: center; display: none; margin-bottom: 11px; }
#cdm-calc-v3 .cdm-result-carbs h3 { color: #2c4a3a; font-size: .83em; margin-bottom: 5px; font-weight: 500; }
#cdm-calc-v3 .cdm-big-num      { font-size: 2.5em; font-weight: 700; color: #1a2e24; line-height: 1; font-family: 'Cormorant Garamond', serif; }
#cdm-calc-v3 .cdm-big-num span { font-size: .4em; font-weight: 400; color: #666; font-family: 'DM Sans', sans-serif; }
#cdm-calc-v3 .cdm-portion-info { font-size: .78em; color: #777; margin-top: 5px; }
#cdm-calc-v3 .cdm-fuente-badge         { display: inline-block; margin-top: 9px; background: #e8f4fd; border: 1px solid #bee3f8; border-radius: 20px; padding: 3px 11px; font-size: .7em; color: #2b6cb0; }
#cdm-calc-v3 .cdm-fuente-badge.local   { background: #edf2ee; border-color: #b5ccbf; color: #2c4a3a; }

#cdm-calc-v3 .cdm-result-ig    { background: #fff; border: 2px solid #d8d3c8; border-radius: 10px; padding: 20px; display: none; margin-bottom: 11px; }
#cdm-calc-v3 .cdm-result-ig h3 { font-size: .83em; color: #444; margin-bottom: 13px; font-weight: 500; }
#cdm-calc-v3 .cdm-ig-row       { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
#cdm-calc-v3 .cdm-ig-box       { text-align: center; padding: 13px 9px; border-radius: 8px; border: 1px solid #e2e8e4; }
#cdm-calc-v3 .cdm-ig-box .cdm-val  { font-size: 1.9em; font-weight: 700; font-family: 'Cormorant Garamond', serif; }
#cdm-calc-v3 .cdm-ig-box .cdm-lbl  { font-size: .73em; color: #666; margin-top: 3px; }
#cdm-calc-v3 .cdm-badge        { display: inline-block; padding: 3px 11px; border-radius: 20px; font-weight: 600; font-size: .78em; margin-top: 5px; }

#cdm-calc-v3 .bg-bajo   { background: #f0fdf4; border-color: #bbf7d0 !important; }
#cdm-calc-v3 .bg-medio  { background: #fffbeb; border-color: #fde68a !important; }
#cdm-calc-v3 .bg-alto   { background: #fff1f2; border-color: #fecdd3 !important; }
#cdm-calc-v3 .badge-bajo  { background: #d1fae5; color: #065f46; }
#cdm-calc-v3 .badge-medio { background: #fef3c7; color: #92400e; }
#cdm-calc-v3 .badge-alto  { background: #fee2e2; color: #991b1b; }

#cdm-calc-v3 .cdm-fuente-ig        { margin-top: 11px; padding: 7px 11px; background: #f0f4ff; border-left: 3px solid #7ba7c9; border-radius: 0 6px 6px 0; font-size: .73em; color: #2a4a6b; }
#cdm-calc-v3 .cdm-fuente-ig.local  { background: #edf2ee; border-color: #74b899; color: #2c4a3a; }
#cdm-calc-v3 .cdm-fuente-ig.sin-ig { background: #fff5f5; border-color: #c08080; color: #742a2a; }
#cdm-calc-v3 .cdm-fuente-ig.internacional { background: #f0f4ff; border-color: #7ba7c9; color: #2a4a6b; }

/* ── GLUCOSA ESTIMADOR ──────────────────────────────────────────────────────── */
#cdm-calc-v3 .cdm-gluc-box   { background: #fffbeb; border: 2px solid #dfc97a; border-radius: 8px; padding: 15px; margin-top: 11px; display: none; }
#cdm-calc-v3 .cdm-gluc-box h4  { color: #7a5a1a; font-size: .83em; margin-bottom: 9px; font-weight: 500; }
#cdm-calc-v3 .cdm-gluc-row    { display: flex; gap: 7px; }
#cdm-calc-v3 .cdm-gluc-row input { flex: 1; padding: 8px 11px; border: 2px solid #dfc97a; border-radius: 6px; font-size: .88em; background: #fff; color: #333; outline: none; font-family: inherit; }
#cdm-calc-v3 .cdm-gluc-row input:focus { border-color: #c4a030; }
#cdm-calc-v3 .cdm-gluc-btn   { padding: 8px 14px; background: #c4a030; border: none; border-radius: 6px; color: #fff; font-weight: 500; cursor: pointer; font-size: .88em; white-space: nowrap; font-family: inherit; }
#cdm-calc-v3 .cdm-gluc-btn:hover { background: #a88828; }
#cdm-calc-v3 .cdm-gluc-result { display: none; margin-top: 9px; background: #fff; border-radius: 6px; padding: 11px; font-size: .83em; }

/* ── TIPS ───────────────────────────────────────────────────────────────────── */
#cdm-calc-v3 .cdm-tips       { background: #f4f7f5; border-left: 4px solid #5a7a68; border-radius: 0 8px 8px 0; padding: 13px; font-size: .8em; margin-top: 11px; display: none; }
#cdm-calc-v3 .cdm-tips h4    { color: #2c4a3a; margin-bottom: 7px; font-size: .93em; font-weight: 500; }
#cdm-calc-v3 .cdm-tips-main  { background: #fff; border-radius: 6px; padding: 8px; margin-bottom: 7px; font-size: .93em; }
#cdm-calc-v3 .cdm-tips ul    { list-style: none; padding: 0; }
#cdm-calc-v3 .cdm-tips li    { padding: 5px 0; border-bottom: 1px solid #dde8e1; }
#cdm-calc-v3 .cdm-tips li:last-child { border-bottom: none; }
#cdm-calc-v3 .cdm-tips li::before { content: "– "; color: #5a7a68; font-weight: 600; }
#cdm-calc-v3 .cdm-no-ig      { color: #999; font-style: italic; font-size: .83em; padding: 7px; }
#cdm-calc-v3 .cdm-reset      { background: none; border: none; color: #aaa; font-size: .8em; cursor: pointer; text-decoration: underline; display: none; padding: 4px; font-family: inherit; }

/* ── FOOTER ─────────────────────────────────────────────────────────────────── */
#cdm-calc-v3 .cdm-footer     { background: #2c4a3a; color: rgba(255,255,255,.6); text-align: center; padding: 14px 22px; font-size: .76em; }
#cdm-calc-v3 .cdm-footer a   { color: #9abfad; text-decoration: none; }
#cdm-calc-v3 .cdm-footer a:hover { text-decoration: underline; }
#cdm-calc-v3 .cdm-sources-toggle { cursor: pointer; color: #9abfad; text-decoration: underline; font-size: .9em; margin-top: 5px; display: inline-block; }
#cdm-calc-v3 .cdm-sources-list  { display: none; text-align: left; margin-top: 11px; font-size: .86em; }
#cdm-calc-v3 .cdm-sources-list li { list-style: none; padding: 4px 0 4px 20px; position: relative; border-bottom: 1px solid rgba(255,255,255,.07); }
#cdm-calc-v3 .cdm-sources-list li::before { content: "—"; position: absolute; left: 0; opacity: .4; }
#cdm-calc-v3 select optgroup { font-weight: 600; font-size: .9em; }

/* ── SLOTS — Combinar + Día Completo ────────────────────────────────────────── */
.slots-layout { display: grid; grid-template-columns: 1fr 360px; gap: 24px; align-items: start; }

.slot-card             { background: #fff; border: 1px solid var(--cdm-border); border-radius: 8px; padding: 18px 20px; margin-bottom: 14px; position: relative; }
.slot-card.has-value   { border-color: #5a7a68; border-left: 3px solid #5a7a68; }
.slot-header           { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.slot-label            { font-size: .8rem; font-weight: 600; color: var(--cdm-sage); letter-spacing: .05em; text-transform: uppercase; }
.slot-clear            { background: none; border: none; color: #ccc; font-size: .78em; cursor: pointer; font-family: inherit; padding: 2px 6px; border-radius: 4px; transition: all .15s; }
.slot-clear:hover      { background: #fee2e2; color: #c0544e; }

.slot-items-list       { display: flex; flex-direction: column; gap: 8px; }
.slot-item-row         { display: grid; grid-template-columns: 1fr 1fr 54px 28px; gap: 6px; align-items: center; padding: 8px 10px; background: #faf9f6; border: 1px solid var(--cdm-border-light); border-radius: 6px; transition: border-color .15s; }
.slot-item-row:hover   { border-color: #b5ccbf; }
.slot-item-row select  { width: 100%; padding: 7px 9px; border: 1px solid #d8d3c8; border-radius: 5px; font-size: .82em; background: #fff; color: #333; -webkit-appearance: none; appearance: none; font-family: inherit; outline: none; }
.slot-item-row select:focus { border-color: #5a7a68; }
.slot-item-qty         { width: 100%; padding: 7px 6px; border: 1px solid #d8d3c8; border-radius: 5px; font-size: .82em; background: #fff; text-align: center; font-family: inherit; outline: none; }
.slot-item-qty:focus   { border-color: #5a7a68; }
.slot-item-del         { background: none; border: none; color: #ddd; cursor: pointer; font-size: 1em; padding: 4px; border-radius: 4px; line-height: 1; transition: all .15s; text-align: center; }
.slot-item-del:hover   { background: #fee2e2; color: #c0544e; }
.slot-item-result      { display: none; grid-column: 1 / -1; padding: 5px 8px; background: #edf2ee; border-radius: 4px; font-size: .78em; color: #2c4a3a; justify-content: space-between; align-items: center; }
.slot-item-result .sir-carbs { font-family: 'Cormorant Garamond', serif; font-size: 1.3em; font-weight: 600; }
.slot-item-result .sir-meta  { font-size: .82em; color: #666; }

.slot-add-item-btn     { margin-top: 9px; width: 100%; padding: 7px; background: transparent; border: 1.5px dashed #b5ccbf; border-radius: 6px; color: #5a7a68; font-size: .8em; font-weight: 500; cursor: pointer; font-family: inherit; transition: all .18s; display: flex; align-items: center; justify-content: center; gap: 5px; }
.slot-add-item-btn:hover { background: var(--cdm-sage-pale); border-color: #5a7a68; }

.slot-subtotal         { margin-top: 10px; padding: 8px 12px; background: #f4f7f5; border-radius: 6px; font-size: .82em; display: none; justify-content: space-between; align-items: center; }
.slot-subtotal-num     { font-family: 'Cormorant Garamond', serif; font-size: 1.35em; font-weight: 600; color: #2c4a3a; }
.slot-subtotal-meta    { font-size: .75em; color: #666; text-align: right; }

/* ── PANEL DE TOTALES ────────────────────────────────────────────────────────── */
.totals-panel          { background: #fff; border: 1px solid var(--cdm-border); border-radius: 8px; padding: 20px; position: sticky; top: 90px; }
.totals-title          { font-family: 'Cormorant Garamond', serif; font-size: 1.1rem; font-weight: 500; color: var(--cdm-ink); margin-bottom: 16px; padding-bottom: 10px; border-bottom: 1px solid var(--cdm-border); }
.totals-row            { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--cdm-border-light); }
.totals-row:last-of-type { border-bottom: none; }
.totals-key            { font-size: .82em; color: var(--cdm-ink-mid); }
.totals-val            { font-family: 'Cormorant Garamond', serif; font-size: 1.5em; font-weight: 600; color: var(--cdm-sage); }
.totals-val.small      { font-size: 1.1em; }
.totals-rec            { margin-top: 14px; padding: 12px; border-radius: 6px; font-size: .83em; font-weight: 500; text-align: center; line-height: 1.5; }
.totals-rec.verde      { background: #f0fdf4; color: #065f46; border: 1px solid #bbf7d0; }
.totals-rec.amarillo   { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.totals-rec.rojo       { background: #fff1f2; color: #991b1b; border: 1px solid #fecdd3; }
.totals-rec.empty      { background: #f8f6f1; color: #aaa; border: 1px solid var(--cdm-border); }
.chart-wrap            { margin-top: 16px; position: relative; height: 180px; }
.totals-name-row       { margin-bottom: 14px; }
.totals-name-row label { font-size: .78em; color: var(--cdm-ink-mid); display: block; margin-bottom: 4px; }
.totals-name-row input { width: 100%; padding: 8px 10px; border: 1px solid var(--cdm-border); border-radius: 5px; font-size: .85em; color: var(--cdm-ink); font-family: inherit; outline: none; background: #faf9f6; }
.totals-name-row input:focus { border-color: #5a7a68; }

/* ── GLUCOSA EN TOTALES ──────────────────────────────────────────────────────── */
.totals-gluc-box       { margin-top: 14px; padding: 14px; background: #fffbeb; border: 2px solid #dfc97a; border-radius: 8px; }
.totals-gluc-title     { font-size: .82em; font-weight: 600; color: #7a5a1a; margin-bottom: 3px; }
.totals-gluc-hint      { font-size: .74em; color: #a07830; margin-bottom: 10px; line-height: 1.5; }
.totals-gluc-row       { display: flex; gap: 7px; align-items: stretch; }
.totals-gluc-input     { flex: 1; padding: 8px 10px; border: 2px solid #dfc97a; border-radius: 6px; font-size: .83em; background: #fff; color: #333; outline: none; font-family: inherit; }
.totals-gluc-input:focus { border-color: #c4a030; }
.totals-gluc-btn       { padding: 8px 13px; background: #c4a030; border: none; border-radius: 6px; color: #fff; font-weight: 500; cursor: pointer; font-size: .83em; white-space: nowrap; font-family: inherit; transition: background .15s; }
.totals-gluc-btn:hover { background: #a88828; }
.totals-gluc-result    { margin-top: 10px; background: #fff; border-radius: 6px; padding: 11px; font-size: .82em; display: none; line-height: 1.6; }
.totals-gluc-result .tgr-range { font-size: 1.15em; font-weight: 700; margin: 4px 0; }
.totals-gluc-disclaimer { margin-top: 9px; font-size: .71em; color: #a07830; line-height: 1.5; border-top: 1px solid #f0d88a; padding-top: 8px; }

/* ── COLORES POR SLOT ────────────────────────────────────────────────────────── */
.slot-card[data-slot="0"] .slot-label { color: #2c7873; }
.slot-card[data-slot="1"] .slot-label { color: #3d5a4a; }
.slot-card[data-slot="2"] .slot-label { color: #7a5a1a; }
.slot-card[data-slot="3"] .slot-label { color: #5a3a6a; }
.slot-card[data-slot="4"] .slot-label { color: #2c4a3a; }
.slot-card[data-slot="5"] .slot-label { color: #c0544e; }

/* ── EXPORT FAB ──────────────────────────────────────────────────────────────── */
.export-fab            { position: fixed; bottom: 28px; right: 28px; z-index: 500; display: none; }
.export-fab.visible    { display: block; }
.export-fab-btn        { background: var(--cdm-orange); color: #fff; border: none; border-radius: 50px; padding: 14px 24px; font-size: .9rem; font-weight: 500; cursor: pointer; font-family: inherit; box-shadow: 0 4px 20px rgba(224,122,48,.45); transition: all .2s; display: flex; align-items: center; gap: 9px; white-space: nowrap; }
.export-fab-btn:hover  { background: var(--cdm-orange-dark); transform: translateY(-2px); box-shadow: 0 6px 24px rgba(224,122,48,.5); }
.export-menu           { position: absolute; bottom: calc(100% + 10px); right: 0; background: #fff; border: 1px solid var(--cdm-border); border-radius: 8px; box-shadow: 0 8px 28px rgba(0,0,0,.12); min-width: 210px; overflow: hidden; display: none; }
.export-menu.open      { display: block; }
.export-menu-item      { display: flex; align-items: center; gap: 11px; padding: 13px 16px; font-size: .85em; color: var(--cdm-ink-mid); cursor: pointer; transition: background .15s; border-bottom: 1px solid var(--cdm-border-light); }
.export-menu-item:last-child { border-bottom: none; }
.export-menu-item:hover { background: var(--cdm-sage-pale); color: var(--cdm-sage); }
.export-menu-item .ei  { font-size: 1.1em; }
.export-menu-item .et  { font-weight: 500; color: var(--cdm-ink); }
.export-menu-item .es  { font-size: .75em; display: block; margin-top: 1px; }
.export-name-box       { padding: 12px 16px; background: #faf9f6; border-bottom: 1px solid var(--cdm-border); }
.export-name-box label { font-size: .74em; color: #888; display: block; margin-bottom: 4px; font-weight: 500; letter-spacing: .03em; text-transform: uppercase; }
.export-name-box input { width: 100%; padding: 7px 9px; border: 1px solid var(--cdm-border); border-radius: 4px; font-size: .85em; font-family: inherit; color: var(--cdm-ink); background: #fff; outline: none; }
.export-name-box input:focus { border-color: #5a7a68; }

/* ── RESPONSIVE ──────────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .slots-layout           { grid-template-columns: 1fr; }
  .totals-panel           { position: static; }
}

@media (max-width: 768px) {
  #cdm-calc-v3 .cdm-wrap  { grid-template-columns: 1fr; }
  #cdm-calc-v3 .cdm-sidebar { padding: 22px 18px; }
  #cdm-calc-v3 .cdm-main  { padding: 22px 16px; }
  #cdm-calc-v3 .cdm-big-num { font-size: 2em; }
  #cdm-calc-v3 .cdm-gluc-row { flex-direction: column; }
  .mode-tabs              { width: 100%; overflow-x: auto; }
  .mode-tab               { padding: 10px 16px; font-size: .78rem; }
  .slot-item-row          { grid-template-columns: 1fr 1fr 54px 28px; }
}

@media (max-width: 600px) {
  .export-fab             { bottom: 16px; right: 16px; }
  /* En mobile, los selects de categoría y alimento se apilan en columna completa */
  .slot-item-row          { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .slot-item-row .sir-fam { flex: 1 1 100%; width: 100%; }
  .slot-item-row .sir-ali { flex: 1 1 100%; width: 100%; display: block !important; }
  .slot-item-qty          { width: 54px; flex-shrink: 0; }
  .slot-item-del          { width: 28px; flex-shrink: 0; }
  .slot-item-result       { flex: 1 1 100%; }
}