/* Ticket Del Mundo — component classes.
   Components are className-driven so hover/press/focus states live in one place.
   Every value resolves to a token; no raw colors below. */

/* ---------- Button ---------- */
.tdm-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);font-family:var(--font-sans);font-weight:var(--weight-semibold);letter-spacing:0.01em;border:var(--border-hairline) solid transparent;border-radius:var(--radius-control);cursor:pointer;text-decoration:none;white-space:nowrap;transition:var(--transition-control),transform var(--duration-instant) var(--ease-out)}
.tdm-btn:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.tdm-btn:active:not(:disabled){transform:translateY(1px)}
.tdm-btn:disabled{cursor:not-allowed;opacity:0.45}
.tdm-btn--sm{height:var(--control-height-sm);padding:0 var(--space-5);font-size:var(--text-sm)}
.tdm-btn--md{height:var(--control-height-md);padding:0 var(--space-7);font-size:var(--text-base)}
.tdm-btn--lg{height:var(--control-height-lg);padding:0 var(--space-9);font-size:var(--text-md)}
.tdm-btn--block{width:100%}
.tdm-btn--primary{background:var(--sienna-500);color:var(--text-on-brand);box-shadow:var(--shadow-xs)}
.tdm-btn--primary:hover:not(:disabled){background:var(--sienna-600)}
.tdm-btn--primary:active:not(:disabled){background:var(--sienna-700)}
.tdm-btn--secondary{background:var(--surface-card);color:var(--text-brand);border-color:var(--border-default);box-shadow:var(--shadow-xs)}
.tdm-btn--secondary:hover:not(:disabled){background:var(--sienna-50);border-color:var(--sienna-300)}
.tdm-btn--secondary:active:not(:disabled){background:var(--sienna-100)}
.tdm-btn--sage{background:var(--sage-500);color:#f4f8f6}
.tdm-btn--sage:hover:not(:disabled){background:var(--sage-600)}
.tdm-btn--ghost{background:transparent;color:var(--text-body)}
.tdm-btn--ghost:hover:not(:disabled){background:var(--warm-100);color:var(--text-heading)}
.tdm-btn--gold{background:var(--gold-300);color:var(--warm-900)}
.tdm-btn--gold:hover:not(:disabled){background:var(--gold-400)}
.tdm-btn--danger{background:var(--red-500);color:#fff6f5}
.tdm-btn--danger:hover:not(:disabled){filter:brightness(0.92)}
.tdm-btn--whatsapp{background:var(--whatsapp);color:#08301a}
.tdm-btn--whatsapp:hover:not(:disabled){filter:brightness(0.94)}

/* ---------- IconButton ---------- */
.tdm-iconbtn{display:inline-flex;align-items:center;justify-content:center;border:var(--border-hairline) solid transparent;background:transparent;color:var(--text-muted);border-radius:var(--radius-control);cursor:pointer;transition:var(--transition-control)}
.tdm-iconbtn:hover:not(:disabled){background:var(--warm-100);color:var(--text-heading)}
.tdm-iconbtn:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.tdm-iconbtn:disabled{opacity:0.4;cursor:not-allowed}
.tdm-iconbtn--outline{border-color:var(--border-default);background:var(--surface-card)}
.tdm-iconbtn--solid{background:var(--sienna-500);color:var(--text-on-brand)}
.tdm-iconbtn--solid:hover:not(:disabled){background:var(--sienna-600);color:var(--text-on-brand)}
.tdm-iconbtn--sm{width:32px;height:32px}
.tdm-iconbtn--md{width:40px;height:40px}
.tdm-iconbtn--lg{width:48px;height:48px}
.tdm-iconbtn--round{border-radius:var(--radius-pill)}

/* ---------- Icon (Lucide via CSS mask, tinted with currentColor) ---------- */
.tdm-icon{display:inline-block;flex:none;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}

/* ---------- Card ---------- */
.tdm-card{background:var(--surface-card);border:var(--border-hairline) solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-sm);transition:var(--transition-surface),border-color var(--duration-fast) var(--ease-out)}
.tdm-card--flat{box-shadow:none}
.tdm-card--raised{box-shadow:var(--shadow-md)}
.tdm-card--interactive{cursor:pointer}
.tdm-card--interactive:hover{transform:translateY(var(--hover-lift));box-shadow:var(--shadow-lg);border-color:var(--border-default)}
.tdm-card--interactive:active{transform:translateY(0);box-shadow:var(--shadow-sm)}
.tdm-card--paper{background-color:var(--surface-ticket);background-image:var(--texture-paper);background-size:var(--texture-paper-size);border-color:var(--brand-tan)}

/* ---------- Badge / Tag ---------- */
.tdm-badge{display:inline-flex;align-items:center;gap:var(--space-3);font-family:var(--font-sans);font-size:var(--text-2xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-caps);text-transform:uppercase;padding:3px var(--space-4);border-radius:var(--radius-xs);border:var(--border-hairline) solid transparent}
.tdm-badge--neutral{background:var(--warm-100);color:var(--text-muted);border-color:var(--border-subtle)}
.tdm-badge--brand{background:var(--sienna-500);color:var(--text-on-brand)}
.tdm-badge--gold{background:var(--gold-200);color:var(--sienna-700)}
.tdm-badge--sage{background:var(--sage-100);color:var(--sage-700)}
.tdm-badge--success{background:var(--status-success-bg);color:var(--status-success-fg)}
.tdm-badge--warning{background:var(--status-warning-bg);color:var(--status-warning-fg)}
.tdm-badge--danger{background:var(--status-danger-bg);color:var(--status-danger-fg)}
.tdm-badge--info{background:var(--status-info-bg);color:var(--status-info-fg)}
.tdm-badge--outline{background:transparent;color:var(--text-body);border-color:var(--border-default)}
.tdm-tag{display:inline-flex;align-items:center;gap:var(--space-4);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-body);background:var(--surface-card);border:var(--border-hairline) solid var(--border-default);border-radius:var(--radius-pill);padding:var(--space-2) var(--space-5);transition:var(--transition-control)}
.tdm-tag--clickable{cursor:pointer}
.tdm-tag--clickable:hover{border-color:var(--sienna-300);color:var(--text-brand)}
.tdm-tag--selected{background:var(--sienna-500);border-color:var(--sienna-500);color:var(--text-on-brand)}
.tdm-tag__x{display:inline-flex;opacity:0.55;cursor:pointer}
.tdm-tag__x:hover{opacity:1}

/* ---------- Form controls ---------- */
.tdm-field{display:flex;flex-direction:column;gap:var(--space-3)}
.tdm-field__label{font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-muted)}
.tdm-field__hint{font-size:var(--text-xs);color:var(--text-subtle)}
.tdm-field__error{font-size:var(--text-xs);color:var(--status-danger-fg);font-weight:var(--weight-medium)}
.tdm-input{width:100%;height:var(--control-height-md);font-family:var(--font-sans);font-size:var(--text-base);color:var(--text-body);background:var(--surface-card);border:var(--border-hairline) solid var(--border-default);border-radius:var(--radius-control);padding:0 var(--space-5);transition:var(--transition-control)}
.tdm-input::placeholder{color:var(--text-subtle)}
.tdm-input:hover:not(:disabled){border-color:var(--border-strong)}
.tdm-input:focus{outline:none;border-color:var(--focus-ring);box-shadow:var(--ring-focus)}
.tdm-input:disabled{background:var(--surface-sunken);color:var(--text-subtle);cursor:not-allowed}
.tdm-input--invalid{border-color:var(--status-danger-fg)}
.tdm-input--lg{height:var(--control-height-lg);font-size:var(--text-md)}
.tdm-input--textarea{height:auto;padding:var(--space-5);line-height:var(--leading-normal);resize:vertical}
.tdm-input-wrap{position:relative;display:flex;align-items:center}
.tdm-input-wrap__icon{position:absolute;left:var(--space-5);color:var(--text-subtle);pointer-events:none}
.tdm-input-wrap__icon + .tdm-input{padding-left:calc(var(--space-6) + var(--space-8))}
.tdm-select{appearance:none;background-image:none}
.tdm-select-wrap{position:relative;display:flex;align-items:center}
.tdm-select-wrap__caret{position:absolute;right:var(--space-5);color:var(--text-muted);pointer-events:none}
.tdm-check{display:inline-flex;align-items:flex-start;gap:var(--space-5);cursor:pointer;font-size:var(--text-base);color:var(--text-body)}
.tdm-check__box{flex:none;width:20px;height:20px;margin-top:2px;border:var(--border-medium) solid var(--border-strong);border-radius:var(--radius-xs);background:var(--surface-card);display:flex;align-items:center;justify-content:center;color:transparent;transition:var(--transition-control)}
.tdm-check:hover .tdm-check__box{border-color:var(--sienna-400)}
.tdm-check--checked .tdm-check__box{background:var(--sienna-500);border-color:var(--sienna-500);color:var(--text-on-brand)}
.tdm-check--radio .tdm-check__box{border-radius:var(--radius-pill)}
.tdm-check--radio.tdm-check--checked .tdm-check__box{background:var(--surface-card);border-color:var(--sienna-500)}
.tdm-check__dot{width:10px;height:10px;border-radius:var(--radius-pill);background:var(--sienna-500)}
.tdm-check--disabled{opacity:0.45;cursor:not-allowed}
.tdm-switch{display:inline-flex;align-items:center;gap:var(--space-5);cursor:pointer}
.tdm-switch__track{position:relative;width:44px;height:24px;border-radius:var(--radius-pill);background:var(--warm-300);transition:background-color var(--duration-base) var(--ease-out)}
.tdm-switch__knob{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:var(--radius-pill);background:#fff;box-shadow:var(--shadow-sm);transition:transform var(--duration-base) var(--ease-out)}
.tdm-switch--on .tdm-switch__track{background:var(--sage-500)}
.tdm-switch--on .tdm-switch__knob{transform:translateX(20px)}
.tdm-switch--disabled{opacity:0.45;cursor:not-allowed}
.tdm-stepper{display:inline-flex;align-items:center;border:var(--border-hairline) solid var(--border-default);border-radius:var(--radius-control);background:var(--surface-card);overflow:hidden}
.tdm-stepper__btn{width:36px;height:36px;border:none;background:transparent;color:var(--text-brand);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition-control)}
.tdm-stepper__btn:hover:not(:disabled){background:var(--sienna-50)}
.tdm-stepper__btn:disabled{color:var(--text-subtle);cursor:not-allowed}
.tdm-stepper__value{min-width:40px;text-align:center;font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-base);color:var(--text-heading)}

/* ---------- Feedback ---------- */
.tdm-alert{display:flex;gap:var(--space-5);padding:var(--space-6);border-radius:var(--radius-md);border-left:var(--rule-brand) solid currentColor;font-size:var(--text-sm)}
.tdm-alert__body{color:var(--text-body)}
.tdm-alert__title{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-base);color:var(--text-heading);margin-bottom:var(--space-2)}
.tdm-alert--info{background:var(--status-info-bg);color:var(--status-info-fg)}
.tdm-alert--success{background:var(--status-success-bg);color:var(--status-success-fg)}
.tdm-alert--warning{background:var(--status-warning-bg);color:var(--status-warning-fg)}
.tdm-alert--danger{background:var(--status-danger-bg);color:var(--status-danger-fg)}
.tdm-toast{display:flex;align-items:center;gap:var(--space-5);background:var(--warm-900);color:var(--warm-100);padding:var(--space-5) var(--space-6);border-radius:var(--radius-md);box-shadow:var(--shadow-overlay);font-size:var(--text-sm);animation:tdm-toast-in var(--duration-base) var(--ease-out)}
@keyframes tdm-toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tdm-tooltip{position:relative;display:inline-flex}
.tdm-tooltip__bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--warm-900);color:var(--warm-100);font-size:var(--text-xs);padding:var(--space-3) var(--space-5);border-radius:var(--radius-sm);white-space:nowrap;box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:opacity var(--duration-fast) var(--ease-out)}
.tdm-tooltip:hover .tdm-tooltip__bubble{opacity:1}
.tdm-dialog__scrim{position:fixed;inset:0;background:var(--surface-overlay);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:var(--space-8);z-index:50;animation:tdm-fade var(--duration-base) var(--ease-out)}
@keyframes tdm-fade{from{opacity:0}to{opacity:1}}
.tdm-dialog{background:var(--surface-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-overlay);width:100%;max-width:480px;overflow:hidden;animation:tdm-dialog-in var(--duration-base) var(--ease-out)}
@keyframes tdm-dialog-in{from{opacity:0;transform:translateY(12px) scale(0.99)}to{opacity:1;transform:none}}
.tdm-dialog__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-6);padding:var(--space-8) var(--space-8) var(--space-5)}
.tdm-dialog__body{padding:0 var(--space-8) var(--space-8);color:var(--text-body);font-size:var(--text-sm)}
.tdm-dialog__foot{display:flex;justify-content:flex-end;gap:var(--space-5);padding:var(--space-6) var(--space-8);background:var(--surface-sunken);border-top:var(--border-hairline) solid var(--border-subtle)}

/* ---------- Navigation ---------- */
.tdm-tabs{display:flex;gap:var(--space-8);border-bottom:var(--border-hairline) solid var(--border-subtle)}
.tdm-tabs__tab{position:relative;background:none;border:none;padding:var(--space-5) 0;font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--text-muted);cursor:pointer;transition:var(--transition-control)}
.tdm-tabs__tab:hover{color:var(--text-heading)}
.tdm-tabs__tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:var(--rule-brand);background:var(--sienna-500);transform:scaleX(0);transform-origin:left;transition:transform var(--duration-base) var(--ease-out)}
.tdm-tabs__tab--active{color:var(--text-heading)}
.tdm-tabs__tab--active::after{transform:scaleX(1)}
.tdm-tabs--pill{border-bottom:none;gap:var(--space-2);background:var(--surface-sunken);padding:var(--space-2);border-radius:var(--radius-pill)}
.tdm-tabs--pill .tdm-tabs__tab{padding:var(--space-4) var(--space-7);border-radius:var(--radius-pill);font-size:var(--text-sm)}
.tdm-tabs--pill .tdm-tabs__tab::after{display:none}
.tdm-tabs--pill .tdm-tabs__tab--active{background:var(--surface-card);color:var(--text-heading);box-shadow:var(--shadow-xs)}
.tdm-crumbs{display:flex;align-items:center;gap:var(--space-4);font-size:var(--text-sm);color:var(--text-muted)}
.tdm-crumbs a{color:var(--text-muted);text-decoration:none}
.tdm-crumbs a:hover{color:var(--text-brand);text-decoration:underline}
.tdm-crumbs__sep{color:var(--warm-400)}
.tdm-crumbs__current{color:var(--text-heading);font-weight:var(--weight-semibold)}

/* ---------- Commerce ---------- */
.tdm-event{display:flex;flex-direction:column;overflow:hidden}
.tdm-event__media{position:relative;aspect-ratio:16/10;background:var(--warm-200);overflow:hidden}
.tdm-event__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--duration-slow) var(--ease-out)}
.tdm-event--interactive:hover .tdm-event__media img{transform:scale(1.03)}
.tdm-event__scrim{position:absolute;inset:0;background:var(--scrim-bottom)}
.tdm-event__media-badges{position:absolute;top:var(--space-5);left:var(--space-5);display:flex;gap:var(--space-3)}
.tdm-event__date{position:absolute;bottom:var(--space-5);left:var(--space-5);color:var(--warm-50);font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase}
.tdm-event__body{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6)}
.tdm-event__title{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-lg);line-height:var(--leading-snug);color:var(--text-heading)}
.tdm-event__meta{display:flex;align-items:center;gap:var(--space-4);font-size:var(--text-sm);color:var(--text-muted)}
.tdm-event__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-5);padding:var(--space-5) var(--space-6);border-top:var(--border-hairline) solid var(--border-subtle);background:var(--surface-card)}
.tdm-price{display:flex;flex-direction:column;gap:0}
.tdm-price__label{font-size:var(--text-2xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-subtle)}
.tdm-price__row{display:flex;align-items:baseline;gap:var(--space-4)}
.tdm-price__value{font-family:var(--type-price-family);font-weight:var(--type-price-weight);color:var(--text-price);line-height:1}
.tdm-price__value--sm{font-size:var(--text-lg)}
.tdm-price__value--md{font-size:var(--text-xl)}
.tdm-price__value--lg{font-size:var(--text-2xl)}
.tdm-price__was{font-size:var(--text-sm);color:var(--text-subtle);text-decoration:line-through}
.tdm-stub{position:relative;display:flex;background-color:var(--surface-ticket);background-image:var(--texture-paper);background-size:var(--texture-paper-size);border:var(--border-medium) solid var(--brand-espresso);border-radius:var(--radius-ticket);color:var(--brand-espresso);overflow:hidden}
.tdm-stub__main{flex:1;padding:var(--space-7);display:flex;flex-direction:column;gap:var(--space-4)}
.tdm-stub__tear{width:0;border-left:var(--border-medium) dashed var(--brand-espresso);opacity:0.5}
.tdm-stub__side{width:104px;padding:var(--space-6) var(--space-5);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);text-align:center}
.tdm-stub__event{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-lg);line-height:var(--leading-snug)}
.tdm-stub__row{display:flex;gap:var(--space-8);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-wide)}
.tdm-stub__k{opacity:0.6;display:block}
.tdm-stub__v{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-base);letter-spacing:0}
.tdm-stub__code{font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:var(--tracking-wide)}
.tdm-stub__notch{position:absolute;width:14px;height:14px;border-radius:var(--radius-pill);background:var(--surface-page);border:var(--border-medium) solid var(--brand-espresso)}

/* ---------- Layout helpers used by kits ---------- */
.tdm-stack{display:flex;flex-direction:column}
.tdm-row{display:flex;align-items:center}
.tdm-container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter-desktop)}
.tdm-rule{height:var(--border-hairline);background:var(--border-subtle);border:0}