/* ==========================================================================
   Saltfish: ocean palette over the Green Fig system
   The parent's colour tokens are redefined here, so every component turns blue.
   ========================================================================== */
:root {
	--fig-950: #061527;
	--fig-900: #0b2239;
	--fig-800: #12345a;
	--fig-700: #1a4672;
	--fig-600: #2b6a93;
	--sage-300: #9cc6d2;
	--sage-100: #e2eef1;
	--shell: #fbfaf7;
	--sand-100: #eef3f2;
	--sand-200: #dfe8e7;
	--sand-300: #c9d6d6;
	--ink: #13202f;
	--ink-soft: #384655;
	--ink-mute: #63707d;
	--line: rgba(19, 32, 47, .12);
	--lagoon: #5fb0c2;
	--coral: #e07a5f;
}
::selection { background: #bfe0e8; color: var(--fig-950); }

/* Overlays: deep-sea shadows instead of rainforest green */
.has-hero .gf-header::before { background: linear-gradient(180deg, rgba(4, 14, 28, .55), rgba(4, 14, 28, 0)); }
.gf-hero__shade {
	background:
		linear-gradient(180deg, rgba(4, 14, 28, .4) 0%, rgba(4, 14, 28, 0) 30%),
		linear-gradient(0deg, rgba(4, 14, 28, .82) 0%, rgba(4, 14, 28, .3) 42%, rgba(4, 14, 28, 0) 62%);
}
.gf-pagehero::after { background: linear-gradient(0deg, rgba(4, 14, 28, .78) 0%, rgba(4, 14, 28, .12) 55%), linear-gradient(180deg, rgba(4, 14, 28, .45), rgba(4, 14, 28, 0) 30%); }
.gf-band::after { background: radial-gradient(ellipse at center, rgba(4, 14, 28, .5), rgba(4, 14, 28, .22) 70%), linear-gradient(0deg, rgba(4, 14, 28, .4), transparent 50%); }
.gf-dialog::backdrop, .gf-scrim { background: rgba(4, 14, 28, .62); }
.gf-section--forest { background: var(--fig-900); }
.gf-section--forest .gf-menu__item, .gf-section--forest .gf-tabs { border-color: rgba(226, 238, 241, .16); }

/* Hero */
.sf-hero__hours { margin: 22px 0 0; font-size: .82rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: rgba(251, 250, 247, .85); }
.sf-hero .gf-hero__title { max-width: 16ch; }

/* ---------- Logo ---------- */
.sf-logo { display: grid; justify-items: center; gap: 2px; color: inherit; line-height: 1; text-decoration: none; }
.sf-logo .sf-fish { width: 46px; height: auto; color: var(--gold-500); margin-bottom: 4px; transition: color .4s; }
.sf-logo__word { font-family: var(--serif); font-size: 1.7rem; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; padding-left: .26em; }
.sf-logo__sub { margin-top: 5px; font-size: .55rem; font-weight: 600; letter-spacing: .34em; text-transform: uppercase; opacity: .85; padding-left: .34em; }
.sf-logo__at { margin-top: 10px; font-family: var(--serif); font-size: 1rem; font-style: italic; letter-spacing: .02em; color: var(--gold-400); }
.has-hero .gf-header:not(.is-solid) .sf-logo { filter: drop-shadow(0 1px 12px rgba(0, 0, 0, .35)); }
.has-hero .gf-header:not(.is-solid) .sf-logo .sf-fish { color: var(--gold-300); }
.gf-footer .sf-logo { justify-items: start; color: var(--sand-100); }
.gf-footer .sf-logo .sf-fish { width: 64px; color: var(--gold-500); }
.gf-footer .sf-logo__word { font-size: 2.1rem; padding-left: 0; }
.gf-footer .sf-logo__sub { padding-left: 0; }
@media (max-width: 600px) {
	.sf-logo .sf-fish { width: 36px; margin-bottom: 2px; }
	.sf-logo__word { font-size: 1.35rem; letter-spacing: .22em; }
	.sf-logo__sub { display: none; }
}

/* ---------- Reservation bar & dialog ---------- */
.sf-reserve .gf-book__submit .gf-icon--whatsapp { width: 20px; height: 20px; }
.sf-pop--time { width: min(560px, calc(100vw - 2 * var(--gutter))); }
.sf-slots + .sf-slots { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.sf-slots__meal { margin: 0 0 10px; font-family: var(--serif); font-size: 1.25rem; color: var(--ink); }
.sf-slots__list { display: flex; flex-wrap: wrap; gap: 8px; }
.sf-slot {
	min-width: 76px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 99px; background: transparent;
	font-size: .86rem; font-variant-numeric: tabular-nums; color: var(--ink); transition: background .2s, border-color .2s, color .2s;
}
.sf-slot:hover:not(:disabled) { border-color: var(--fig-700); }
.sf-slot.is-selected { background: var(--fig-800); border-color: var(--fig-800); color: var(--shell); }
.sf-slot:disabled { opacity: .3; text-decoration: line-through; cursor: default; }
.sf-cal.sf-cal--one { grid-template-columns: 1fr; }
.gf-book--bar .sf-cal:not(.sf-cal--one) { grid-template-columns: 1fr 1fr; }
.sf-reserve__error { margin: 12px 0 0; padding: 10px 14px; border-radius: var(--radius); background: #fbe9e4; color: #8a3520; font-size: .88rem; }
.gf-hero .sf-reserve__error, .gf-band .sf-reserve__error { max-width: 1040px; margin-inline: auto; }
.sf-reserve__more { display: grid; gap: 14px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.sf-reserve__more label { display: grid; gap: 6px; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-mute); }
.sf-reserve__more label span { font-weight: 400; letter-spacing: 0; text-transform: none; }
.sf-reserve__more input, .sf-reserve__more textarea {
	width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--shell);
	font: inherit; font-size: 1rem; letter-spacing: 0; text-transform: none; color: var(--ink);
}
.sf-reserve__more input:focus, .sf-reserve__more textarea:focus { outline: 2px solid var(--gold-500); outline-offset: 0; border-color: transparent; }
.gf-book--stack.sf-reserve .gf-book__fields { grid-template-columns: 1fr 1fr 1fr; }
.gf-book--stack.sf-reserve .gf-book__field--guests { display: grid; }
.gf-book--stack.sf-reserve .gf-book__submit { gap: 10px; }
.gf-book--stack .sf-pop--time { padding-top: 18px; }
@media (max-width: 860px) {
	.gf-book--bar.sf-reserve .gf-book__fields { grid-template-columns: 1fr 1fr; }
	.gf-book--stack.sf-reserve .gf-book__fields { grid-template-columns: 1fr 1fr; }
	.gf-book--stack.sf-reserve .gf-book__field--guests { grid-column: 1 / -1; border-top: 1px solid var(--line); }
	.gf-book--stack.sf-reserve .gf-book__field--guests::before { display: none; }
}

/* Signature dishes on the homepage */
.sf-signature .gf-menu__items { margin-top: 8px; }
.sf-hours-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 40px auto 0 !important; max-width: 900px !important; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.sf-hours-grid > * { margin: 0 !important; padding: 26px 20px; text-align: center; }
.sf-hours-grid > * + * { border-left: 1px solid var(--line); }
.sf-hours-grid h3 { margin: 0 0 6px; font-size: 1.5rem; }
.sf-hours-grid p { margin: 0; font-size: .95rem; color: var(--ink-soft); }
@media (max-width: 640px) { .sf-hours-grid { grid-template-columns: 1fr; } .sf-hours-grid > * + * { border-left: 0; border-top: 1px solid var(--line); } }
.sf-footer-hours li { display: grid; grid-template-columns: 6.5em 1fr; gap: 10px; }
.sf-footer-hours span { color: rgba(246, 240, 230, .5); }
