/* Tastee Bakeree - local JAMstack build.
   Brand tokens, type and component colors are ported verbatim from
   ../website/mu-plugins/tastee-brand.php. The layout rules below stand in for
   GeneratePress + the Gutenberg block stylesheet, which the live site loads
   from WordPress. Same visual result, no WordPress. */

:root{
  --tb-white:#FFFFFF; --tb-warm-white:#FFFAF7; --tb-cream:#F3E6DD; --tb-tan:#CFBAAB; --tb-mocha:#AF917D;
  --tb-slate:#566174; --tb-slate-muted:#737C89; --tb-gray:#9499A1; --tb-silver:#C0C2C6; --tb-light-gray:#F2F2F2;
  --tb-off-white:#F9F9F9; --tb-pale-sage:#DEE4DD; --tb-sage:#BECDBA; --tb-green:#96AE90; --tb-deep-green:#729369;
  --tb-content:1200px;
  /* GeneratePress theme defaults that win over the mu-plugin on the live site */
  --gp-accent:#1e73be; --gp-contrast:#222222; --gp-base-2:#f7f8f9; --gp-base-3:#ffffff;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--gp-base-2); color:var(--gp-contrast);
  font-family:'Lato',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:17px; line-height:1.7;
}
h1,h2,h3,h4,h5,h6,.main-title{ font-family:'Lobster',cursive; font-weight:400; letter-spacing:.4px; margin:0 0 .5em; line-height:1.2; }
p{ margin:0 0 1.5em; }
a{ color:var(--tb-deep-green); text-decoration:none; }
a:hover{ color:var(--tb-green); text-decoration:underline; }
img{ max-width:100%; height:auto; }
.screen-reader-text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }
.skip-link:focus{ position:fixed; top:8px; left:8px; width:auto; height:auto; clip:auto; z-index:99;
  background:var(--tb-white); color:var(--tb-slate); padding:10px 16px; border-radius:6px; }
.grid-container{ max-width:var(--tb-content); margin-left:auto; margin-right:auto; }

/* ---------- Header ---------- */
.site-header{ background:var(--tb-white); border-bottom:1px solid var(--tb-cream); }
.inside-header{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 40px; flex-wrap:wrap; }
.site-branding-container{ display:flex; align-items:center; gap:14px; }
.site-logo .header-image{ max-height:66px; width:auto; height:auto; display:block; }
.main-title{ margin:0; font-size:30px; }
/* GP's `.main-title a{color:var(--contrast)}` lands after the mu-plugin's mocha rule
   at equal specificity, so the live header title renders near-black, not mocha. */
.main-title a{ font-family:'Lobster',cursive; font-weight:400; color:var(--gp-contrast); letter-spacing:.5px; text-decoration:none; }
.main-title a:hover{ color:var(--gp-contrast); text-decoration:none; }
.main-navigation .menu{ display:flex; gap:6px; list-style:none; margin:0; padding:0; }
.main-navigation a{ display:block; padding:12px 16px; font-family:'Lato',sans-serif; font-weight:600;
  font-size:16px; letter-spacing:.2px; color:var(--tb-slate); text-decoration:none; }
/* Likewise GP's `.main-navigation .main-nav ul li[class*="current-menu-"] > a`
   outranks the mu-plugin, so the active/hover nav item is the theme accent blue. */
.main-navigation a:hover,.main-navigation .current-menu-item > a{ color:var(--gp-accent); text-decoration:none; }
.menu-toggle{ display:none; background:none; border:0; font-size:26px; color:var(--tb-slate); cursor:pointer; padding:8px 12px; }

@media (max-width:768px){
  .inside-header{ padding:14px 24px; }
  .menu-toggle{ display:block; }
  .main-navigation{ flex-basis:100%; display:none; }
  .main-navigation.toggled{ display:block; }
  .main-navigation .menu{ flex-direction:column; gap:0; }
  .main-navigation a{ border-top:1px solid var(--tb-cream); }
}

/* ---------- Content shell ---------- */
/* GP separate-containers: `.site-main{margin:20px}` with the left/right zeroed
   for no-sidebar, and `.inside-article{padding:40px}`. */
.site.container{ padding:0; }
.site-main{ margin:20px 0; }
.entry-content{ background:var(--gp-base-3); padding:40px; }
@media (max-width:768px){ .entry-content{ padding:30px; } }
.entry-content > *:first-child{ margin-top:0; }

/* ---------- Gutenberg blocks ---------- */
.no-sidebar .entry-content .alignfull{
  margin-left:calc(-100vw / 2 + 100% / 2); margin-right:calc(-100vw / 2 + 100% / 2);
  max-width:100vw; width:auto; }
.alignwide{ margin-left:-40px; width:calc(100% + 80px); max-width:calc(100% + 80px); }
@media (max-width:768px){
  .alignwide{ margin-left:-30px; width:calc(100% + 60px); max-width:calc(100% + 60px); }
}
.has-text-align-center{ text-align:center; }
.has-text-align-left{ text-align:left; }
.has-text-align-right{ text-align:right; }

.wp-block-cover{ position:relative; display:flex; align-items:center; justify-content:center;
  overflow:hidden; padding:2em 1em; box-sizing:border-box; }
.wp-block-cover__image-background{ position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; margin:0; z-index:0; }
.wp-block-cover__background{ position:absolute; inset:0; z-index:1; }
.has-background-dim{ opacity:.5; }
.has-background-dim-0{ opacity:0; } .has-background-dim-10{ opacity:.1; } .has-background-dim-20{ opacity:.2; }
.has-background-dim-30{ opacity:.3; } .has-background-dim-40{ opacity:.4; } .has-background-dim-50{ opacity:.5; }
.has-background-dim-60{ opacity:.6; } .has-background-dim-70{ opacity:.7; } .has-background-dim-80{ opacity:.8; }
.has-background-dim-90{ opacity:.9; } .has-background-dim-100{ opacity:1; }
.wp-block-cover__inner-container{ position:relative; z-index:2; width:100%; max-width:var(--tb-content);
  margin:0 auto; padding:0 20px; }
.wp-block-cover h1,.wp-block-cover h2,.wp-block-cover p{ margin-bottom:.4em; }

.wp-block-buttons{ display:flex; flex-wrap:wrap; gap:12px; margin:1.2em 0 0; }
.wp-block-buttons.is-content-justification-center,
.wp-block-cover .wp-block-buttons{ justify-content:center; }
.wp-block-button__link,.wp-element-button{ display:inline-block; background-color:var(--tb-deep-green);
  color:var(--tb-white); border:0; border-radius:8px; padding:14px 36px; font-family:'Lato',sans-serif;
  font-weight:700; font-size:18px; line-height:1.2; text-decoration:none; cursor:pointer;
  transition:background-color .15s ease; }
.wp-block-button__link:hover,.wp-element-button:hover{ background-color:var(--tb-green);
  color:var(--tb-white); text-decoration:none; }

.wp-block-group{ margin:0 auto; }
.wp-block-spacer{ display:block; }
.wp-block-image{ margin:0 0 1em; }
.wp-block-image img{ display:block; border-radius:6px; }

.wp-block-gallery{ display:grid; gap:14px; margin:1em 0 0; padding:0; }
.wp-block-gallery.columns-3{ grid-template-columns:repeat(3,1fr); }
.wp-block-gallery.columns-2{ grid-template-columns:repeat(2,1fr); }
.wp-block-gallery figure{ margin:0; }
.wp-block-gallery.is-cropped img{ width:100%; height:100%; aspect-ratio:1/1; object-fit:cover; border-radius:6px; }
@media (max-width:768px){ .wp-block-gallery.columns-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .wp-block-gallery.columns-3{ grid-template-columns:1fr; } }

/* ---------- Footer ---------- */
.site-info{ background:var(--tb-slate); color:var(--tb-warm-white); text-align:center; padding:20px;
  font-family:'Lato',sans-serif; font-size:13px; line-height:1.9; }
.tb-footer-legal{ display:block; margin-bottom:6px; }
.tb-footer-legal a{ color:var(--tb-pale-sage); font-family:'Lato',sans-serif; font-size:14px; margin:0 2px; }
.tb-footer-legal a:hover{ color:var(--tb-white); }

/* ---------- Forms ----------
   Colors, radii and the button treatment are the Gravity Forms brand overrides
   from the mu-plugin, reapplied to plain markup. */
/* Only the "Loading form..." placeholder is italic - the rendered form is a child
   of this element and must not inherit it. */
.tb-form-mount{ color:var(--tb-slate-muted); font-style:italic; }
.tb-form,.tb-checkout,.tb-confirmation{ font-style:normal; color:var(--tb-slate); }
.tb-form{ max-width:820px; margin:0 auto; font-family:'Lato',sans-serif; text-align:left;
  color:var(--tb-slate); }
.tb-fieldset{ border:0; margin:0 0 8px; padding:0; }
.tb-section{ font-family:'Lobster',cursive; font-size:28px; color:var(--tb-mocha);
  margin:32px 0 4px; padding-bottom:8px; border-bottom:1px solid var(--tb-cream); }
.tb-section:first-child{ margin-top:0; }
.tb-field{ margin:0 0 22px; }
.tb-field[hidden]{ display:none !important; }
.tb-label{ display:block; color:var(--tb-slate); font-weight:600; font-size:15px; margin-bottom:6px; }
.tb-required{ color:var(--tb-mocha); margin-left:2px; }
.tb-desc{ color:var(--tb-slate-muted); font-size:14px; margin:4px 0 8px; line-height:1.5; }
.tb-field input[type=text],.tb-field input[type=email],.tb-field input[type=tel],
.tb-field input[type=date],.tb-field input[type=number],.tb-field textarea,.tb-field select{
  width:100%; border:1px solid var(--tb-tan); border-radius:8px; background:var(--tb-white);
  color:var(--tb-slate); padding:10px 12px; font-family:'Lato',sans-serif; font-size:16px; }
.tb-field textarea{ min-height:130px; resize:vertical; }
.tb-field input:focus,.tb-field textarea:focus,.tb-field select:focus{
  border-color:var(--tb-deep-green); outline:none; box-shadow:0 0 0 3px rgba(114,147,105,.18); }
.tb-choices{ display:flex; flex-direction:column; gap:8px; }
.tb-choice{ display:flex; align-items:flex-start; gap:10px; cursor:pointer; font-size:16px; line-height:1.5; }
.tb-choice input{ margin-top:5px; flex:0 0 auto; accent-color:var(--tb-deep-green); }
.tb-error{ color:#b3261e; font-size:14px; margin-top:6px; }
.tb-field.tb-invalid input,.tb-field.tb-invalid textarea,.tb-field.tb-invalid select{ border-color:#b3261e; }

.tb-totals{ background:var(--tb-cream); border-radius:10px; padding:18px 22px; margin:0 0 22px; }
.tb-total-row{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; font-size:17px; }
.tb-total-row + .tb-total-row{ margin-top:10px; padding-top:10px; border-top:1px solid var(--tb-tan); }
.tb-total-row .tb-total-label{ font-weight:600; }
.tb-total-row .tb-total-value{ font-family:'Lobster',cursive; font-size:26px; color:var(--tb-mocha); }
.tb-total-row.tb-deposit .tb-total-value{ color:var(--tb-deep-green); }

.tb-submit{ background-color:var(--tb-deep-green); color:var(--tb-white); border:none; border-radius:8px;
  font-family:'Lato',sans-serif; font-weight:700; font-size:17px; padding:14px 40px; cursor:pointer;
  transition:background-color .15s ease; }
.tb-submit:hover:not(:disabled){ background-color:var(--tb-green); }
.tb-submit:disabled{ opacity:.6; cursor:not-allowed; }
.tb-form-footer{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:8px; }
.tb-form-note{ color:var(--tb-slate-muted); font-size:14px; }
.tb-confirmation{ color:var(--tb-slate); font-size:18px; padding:8px 0; }
.tb-form-error{ background:#fdecea; border:1px solid #f5c6c3; color:#7f1d1a; border-radius:8px;
  padding:12px 16px; margin:0 0 18px; font-size:15px; }

/* ---------- Stripe checkout ---------- */
.tb-checkout{ margin:8px 0 0; }
/* A photo that would not upload is a heads-up, not an error - the order is fine. */
.tb-photo-warning{ background:var(--tb-cream); border:1px solid var(--tb-tan); color:var(--tb-slate);
  border-radius:8px; padding:12px 16px; margin:0 0 18px; font-size:15px; }
#tb-stripe-checkout{ min-height:320px; }
.tb-pay-note{ color:var(--tb-slate-muted); font-size:14px; text-align:center; margin-top:14px; }
.tb-back{ background:none; border:0; color:var(--tb-deep-green); font-family:'Lato',sans-serif;
  font-size:15px; text-decoration:underline; cursor:pointer; padding:0; }

/* ---------- Order confirmation page ---------- */
.tb-return-page{ max-width:820px; margin:0 auto; padding:48px 0; }
.tb-h1{ font-size:48px; color:var(--tb-mocha); }
.tb-lead{ font-size:19px; }
.tb-receipt{ background:var(--tb-cream); border-radius:10px; padding:22px; margin:24px 0; }
.tb-receipt dl{ display:grid; grid-template-columns:auto 1fr; gap:8px 20px; margin:0; font-size:16px; }
.tb-receipt dt{ font-weight:600; color:var(--tb-slate); }
.tb-receipt dd{ margin:0; }
.tb-cottage{ color:var(--tb-slate-muted); font-size:14px; font-style:italic; text-align:center;
  max-width:760px; margin:32px auto 0; }