/* ── Good Mood Lipe Tour — component styles ────────────────────────────
   Every component in components/ is styled here so hover / press / focus
   states are real CSS states. Values come from tokens only. */

/* Button */
.gm-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:var(--control-h);padding:0 var(--space-6);border:var(--border-w) solid transparent;border-radius:var(--radius-pill);font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--weight-semibold);line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;transition:var(--transition-control)}
.gm-btn--sm{height:var(--control-h-sm);padding:0 var(--space-4);font-size:var(--text-sm)}
.gm-btn--lg{height:var(--control-h-lg);padding:0 var(--space-7);font-size:var(--text-lead)}
.gm-btn.is-block{width:100%}
.gm-btn--primary{background:var(--brand);color:var(--text-on-brand);box-shadow:var(--shadow-sm)}
.gm-btn--primary:hover{background:var(--brand-strong);box-shadow:var(--shadow-card);transform:var(--lift-hover)}
.gm-btn--primary:active{background:var(--sea-600);transform:var(--press-scale);box-shadow:var(--shadow-xs)}
.gm-btn--secondary{background:var(--paper);color:var(--brand-strong);border-color:var(--border-strong)}
.gm-btn--secondary:hover{background:var(--brand-tint);border-color:var(--sea-300)}
.gm-btn--secondary:active{background:var(--sea-100);transform:var(--press-scale)}
.gm-btn--sand{background:var(--accent-sand);color:var(--text-on-sand)}
.gm-btn--sand:hover{background:var(--sand-400);transform:var(--lift-hover)}
.gm-btn--sand:active{background:var(--sand-500);transform:var(--press-scale)}
.gm-btn--ghost{background:transparent;color:var(--brand-strong)}
.gm-btn--ghost:hover{background:var(--brand-tint)}
.gm-btn--ghost:active{background:var(--sea-100);transform:var(--press-scale)}
.gm-btn--danger{background:var(--state-danger);color:#fff}
.gm-btn--danger:hover{background:var(--coral-400)}
.gm-btn[disabled],.gm-btn.is-disabled{opacity:.45;pointer-events:none;box-shadow:none}
.gm-btn__spinner{width:15px;height:15px;border-radius:var(--radius-pill);border:2px solid currentColor;border-top-color:transparent;animation:gm-spin .7s linear infinite}
@keyframes gm-spin{to{transform:rotate(360deg)}}

/* IconButton */
.gm-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:var(--control-h);height:var(--control-h);border-radius:var(--radius-pill);border:var(--border-w) solid transparent;background:transparent;color:var(--text-heading);cursor:pointer;transition:var(--transition-control)}
.gm-iconbtn--sm{width:var(--control-h-sm);height:var(--control-h-sm)}
.gm-iconbtn:hover{background:var(--brand-tint);color:var(--brand-strong)}
.gm-iconbtn:active{transform:var(--press-scale)}
.gm-iconbtn--outline{border-color:var(--border-hairline);background:var(--paper)}
.gm-iconbtn--solid{background:var(--brand);color:var(--text-on-brand)}
.gm-iconbtn--solid:hover{background:var(--brand-strong);color:#fff}
.gm-iconbtn--glass{background:var(--glass);backdrop-filter:var(--glass-blur);color:var(--brand-deep);box-shadow:var(--shadow-sm)}

/* Badge */
.gm-badge{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:var(--weight-semibold);line-height:1;white-space:nowrap}
.gm-badge--brand{background:var(--brand);color:#fff}
.gm-badge--info{background:var(--state-info-soft);color:var(--sea-700)}
.gm-badge--success{background:var(--state-success-soft);color:var(--palm-600)}
.gm-badge--warning{background:var(--state-warning-soft);color:var(--sand-700)}
.gm-badge--danger{background:var(--state-danger-soft);color:var(--coral-500)}
.gm-badge--sand{background:var(--surface-sand);color:var(--text-on-sand)}
.gm-badge--outline{background:transparent;border:var(--border-w) solid var(--border-hairline);color:var(--text-muted)}
.gm-badge__dot{width:6px;height:6px;border-radius:var(--radius-pill);background:currentColor}

/* Tag / filter chip */
.gm-tag{display:inline-flex;align-items:center;gap:var(--space-2);height:34px;padding:0 var(--space-4);border-radius:var(--radius-pill);border:var(--border-w) solid var(--border-soft);background:var(--paper);color:var(--text-body);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:var(--transition-control)}
.gm-tag:hover{border-color:var(--sea-200);background:var(--brand-tint)}
.gm-tag.is-selected{background:var(--brand-soft);border-color:var(--sea-300);color:var(--sea-700)}
.gm-tag.is-static{cursor:default}
.gm-tag__x{display:inline-flex;opacity:.55}
.gm-tag__x:hover{opacity:1}

/* Card */
.gm-card{background:var(--surface-card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden}
.gm-card--flat{box-shadow:none;border:var(--border-w) solid var(--border-soft)}
.gm-card--sunk{box-shadow:none;background:var(--surface-sunk)}
.gm-card--interactive{cursor:pointer;transition:box-shadow var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.gm-card--interactive:hover{box-shadow:var(--shadow-lift);transform:var(--lift-hover)}
.gm-card--interactive:active{transform:var(--press-scale)}
.gm-card__body{padding:var(--space-6)}
.gm-card__title{font-family:var(--font-display);font-size:var(--text-h4);color:var(--text-heading);margin:0 0 var(--space-2)}
.gm-card__meta{font-size:var(--text-sm);color:var(--text-muted)}

/* PhotoPlaceholder — stands in for brand photography (none supplied) */
.gm-photo{position:relative;display:flex;align-items:flex-end;border-radius:var(--radius-photo);background:linear-gradient(160deg,var(--sea-100),var(--sand-200) 68%,var(--sand-300));overflow:hidden}
.gm-photo::after{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.5) 0 2px,transparent 2px 9px);opacity:.5}
.gm-photo--deep{background:linear-gradient(160deg,var(--sea-400),var(--sea-800))}
.gm-photo--sand{background:linear-gradient(160deg,var(--sand-200),var(--sand-400))}
.gm-photo__label{position:relative;z-index:1;margin:var(--space-3);padding:4px 10px;border-radius:var(--radius-pill);background:var(--glass);backdrop-filter:var(--glass-blur);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--brand-deep)}
.gm-photo--flush{border-radius:0}

/* Fields (Input / Select) */
.gm-field{display:flex;flex-direction:column;gap:6px}
.gm-field__label{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-heading)}
.gm-field__label span{color:var(--state-danger);margin-inline-start:2px}
.gm-field__hint{font-size:var(--text-xs);color:var(--text-muted)}
.gm-field.is-error .gm-field__hint{color:var(--state-danger)}
.gm-input,.gm-select{height:var(--control-h);width:100%;padding:0 var(--space-4);border:var(--border-w) solid var(--border-hairline);border-radius:var(--radius-sm);background:var(--paper);color:var(--text-body);font-family:var(--font-body);font-size:var(--text-base);box-shadow:var(--shadow-inset-sunk);transition:var(--transition-control)}
.gm-input::placeholder{color:var(--text-faint)}
.gm-input:hover,.gm-select:hover{border-color:var(--sea-200)}
.gm-input:focus,.gm-select:focus{outline:none;border-color:var(--border-focus);box-shadow:var(--ring-focus)}
.gm-field.is-error .gm-input,.gm-field.is-error .gm-select{border-color:var(--state-danger)}
.gm-input--textarea{height:auto;min-height:110px;padding:var(--space-3) var(--space-4);line-height:var(--text-base-lh);resize:vertical}
.gm-input-wrap{position:relative;display:flex;align-items:center}
.gm-input-wrap .gm-input{padding-inline-start:42px}
.gm-input-wrap__icon{position:absolute;inset-inline-start:14px;display:flex;color:var(--text-faint);pointer-events:none}
.gm-select{appearance:none;padding-inline-end:38px;background-image:linear-gradient(45deg,transparent 49%,var(--ink-500) 50%),linear-gradient(-45deg,transparent 49%,var(--ink-500) 50%);background-size:6px 6px,6px 6px;background-position:calc(100% - 20px) 20px,calc(100% - 14px) 20px;background-repeat:no-repeat}

/* Checkbox */
.gm-check{display:inline-flex;align-items:flex-start;gap:var(--space-3);cursor:pointer;font-size:var(--text-base);color:var(--text-body)}
.gm-check__box{flex:none;width:22px;height:22px;margin-top:2px;border-radius:var(--radius-xs);border:var(--border-w-strong) solid var(--border-hairline);background:var(--paper);display:flex;align-items:center;justify-content:center;color:#fff;transition:var(--transition-control)}
.gm-check:hover .gm-check__box{border-color:var(--sea-300)}
.gm-check.is-checked .gm-check__box{background:var(--brand);border-color:var(--brand)}
.gm-check.is-disabled{opacity:.45;pointer-events:none}
.gm-check__tick{width:12px;height:12px}

/* Switch */
.gm-switch{display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:var(--text-base)}
.gm-switch__track{position:relative;width:46px;height:26px;border-radius:var(--radius-pill);background:var(--ink-100);transition:background-color var(--dur-base) var(--ease-out)}
.gm-switch__knob{position:absolute;top:3px;inset-inline-start:3px;width:20px;height:20px;border-radius:var(--radius-pill);background:var(--paper);box-shadow:var(--shadow-sm);transition:transform var(--dur-base) var(--ease-out)}
.gm-switch.is-on .gm-switch__track{background:var(--brand)}
.gm-switch.is-on .gm-switch__knob{transform:translateX(20px)}
.gm-switch.is-disabled{opacity:.45;pointer-events:none}

/* Tabs */
.gm-tabs{display:flex;gap:var(--space-1);padding:5px;border-radius:var(--radius-pill);background:var(--surface-sunk)}
.gm-tab{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:38px;padding:0 var(--space-5);border:none;border-radius:var(--radius-pill);background:transparent;color:var(--text-muted);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--weight-semibold);cursor:pointer;transition:var(--transition-control)}
.gm-tab:hover{color:var(--text-heading)}
.gm-tab.is-active{background:var(--paper);color:var(--brand-strong);box-shadow:var(--shadow-sm)}
.gm-tabs--underline{background:transparent;padding:0;gap:var(--space-6);border-bottom:var(--border-w) solid var(--border-hairline);border-radius:0}
.gm-tabs--underline .gm-tab{flex:none;height:44px;padding:0;border-radius:0;box-shadow:none;background:transparent}
.gm-tabs--underline .gm-tab.is-active{color:var(--brand-strong);box-shadow:inset 0 -2px 0 var(--brand)}

/* Dialog */
.gm-dialog-backdrop{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:var(--space-6);background:var(--surface-overlay);backdrop-filter:blur(3px);z-index:60;animation:gm-fade var(--dur-base) var(--ease-out)}
.gm-dialog{width:100%;max-width:460px;background:var(--surface-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-modal);padding:var(--space-7);animation:gm-rise var(--dur-base) var(--ease-out)}
.gm-dialog__title{font-family:var(--font-display);font-size:var(--text-d3);color:var(--text-heading);margin:0 0 var(--space-2)}
.gm-dialog__body{color:var(--text-body)}
.gm-dialog__actions{display:flex;gap:var(--space-3);justify-content:flex-end;margin-top:var(--space-6)}
@keyframes gm-fade{from{opacity:0}}
@keyframes gm-rise{from{opacity:0;transform:translateY(14px)}}

/* Toast */
.gm-toast{display:flex;align-items:flex-start;gap:var(--space-3);max-width:400px;padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);background:var(--surface-deep);color:#fff;box-shadow:var(--shadow-lift);font-size:var(--text-sm);animation:gm-rise var(--dur-base) var(--ease-bounce)}
.gm-toast--success{background:var(--palm-500)}
.gm-toast--warning{background:var(--sun-400);color:var(--sea-900)}
.gm-toast--danger{background:var(--state-danger)}
.gm-toast__title{font-weight:var(--weight-semibold);display:block}
.gm-toast__close{margin-inline-start:auto;background:none;border:none;color:inherit;opacity:.7;cursor:pointer}
.gm-toast__close:hover{opacity:1}

/* Tooltip */
.gm-tip{position:relative;display:inline-flex}
.gm-tip__bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);padding:6px 10px;border-radius:var(--radius-xs);background:var(--sea-900);color:#fff;font-size:var(--text-xs);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--dur-fast) var(--ease-out)}
.gm-tip:hover .gm-tip__bubble,.gm-tip:focus-within .gm-tip__bubble{opacity:1}

/* TourCard */
.gm-tour{display:flex;flex-direction:column;background:var(--surface-card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden;transition:box-shadow var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.gm-tour:hover{box-shadow:var(--shadow-lift);transform:var(--lift-hover)}
.gm-tour__media{position:relative;height:176px}
.gm-tour__badges{position:absolute;top:var(--space-3);inset-inline-start:var(--space-3);display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 60px);z-index:2}
.gm-tour__fav{position:absolute;top:var(--space-2);inset-inline-end:var(--space-2);z-index:2}
.gm-tour__body{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-5)}
.gm-tour__title{font-family:var(--font-display);font-size:var(--text-h4);line-height:1.35;color:var(--text-heading);margin:0}
.gm-tour__meta{display:flex;flex-wrap:wrap;gap:var(--space-4);font-size:var(--text-sm);color:var(--text-muted)}
.gm-tour__meta span{display:inline-flex;align-items:center;gap:6px}
.gm-tour__foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-3);margin-top:var(--space-2);padding-top:var(--space-4);border-top:var(--border-w) solid var(--border-soft)}
.gm-tour__price{font-family:var(--font-display);font-size:22px;color:var(--brand-deep);line-height:1.1}
.gm-tour__price s{font-family:var(--font-body);font-size:var(--text-sm);color:var(--text-faint);margin-inline-end:6px}
.gm-tour__unit{font-size:var(--text-xs);color:var(--text-muted);display:block}

/* ItineraryStep */
.gm-step{display:grid;grid-template-columns:auto 1fr;gap:var(--space-4);position:relative;padding-bottom:var(--space-6)}
.gm-step:not(.is-last)::before{content:"";position:absolute;inset-inline-start:17px;top:38px;bottom:0;width:2px;background:repeating-linear-gradient(to bottom,var(--sea-200) 0 6px,transparent 6px 12px)}
.gm-step__dot{width:36px;height:36px;border-radius:var(--radius-pill);background:var(--brand-soft);color:var(--sea-700);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:500}
.gm-step.is-highlight .gm-step__dot{background:var(--brand);color:#fff}
.gm-step__time{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--brand-strong);letter-spacing:.02em}
.gm-step__title{font-family:var(--font-display);font-size:var(--text-h4);color:var(--text-heading);margin:2px 0 4px}
.gm-step__text{font-size:var(--text-sm);color:var(--text-body);margin:0}

/* InfoCallout */
.gm-callout{display:flex;gap:var(--space-4);padding:var(--space-5);border-radius:var(--radius-md);background:var(--state-info-soft);color:var(--sea-800)}
.gm-callout--tip{background:var(--surface-sand);color:var(--text-on-sand)}
.gm-callout--warning{background:var(--state-warning-soft);color:var(--sand-700)}
.gm-callout--success{background:var(--state-success-soft);color:var(--palm-600)}
.gm-callout__icon{flex:none;margin-top:2px}
.gm-callout__title{font-weight:var(--weight-semibold);margin:0 0 4px}
.gm-callout p{margin:0;font-size:var(--text-sm)}

/* StatPill — sea state, ferry time, budget, temperature */
.gm-stat{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--paper);border:var(--border-w) solid var(--border-soft)}
.gm-stat__icon{width:34px;height:34px;flex:none;border-radius:var(--radius-pill);background:var(--brand-tint);color:var(--brand-strong);display:flex;align-items:center;justify-content:center}
.gm-stat__label{display:block;font-size:var(--text-xs);color:var(--text-muted);line-height:1.3}
.gm-stat__value{display:block;font-family:var(--font-display);font-size:var(--text-base);color:var(--text-heading);line-height:1.3}
.gm-stat--calm .gm-stat__icon{background:var(--state-success-soft);color:var(--sea-calm)}
.gm-stat--moderate .gm-stat__icon{background:var(--state-warning-soft);color:var(--sand-700)}
.gm-stat--rough .gm-stat__icon{background:var(--state-danger-soft);color:var(--sea-rough)}
.gm-stat--plain{background:transparent;border-color:transparent;padding:0}
