/* =====================================================================
   Bee Sharp SV - LARGE PRINT layer (v7.2.84.0, David 2026-10-10)
   Brings every public page to the Price List style: Cormorant Garamond,
   semi-bold, upright (no italics), bright text, and a size FLOOR so no
   text is ever smaller than the Price List body text (1.3rem).
   - Public pages only: index.html (all .page sections + footer) and the
     standalone pages with <body class="bs-lp bs-lp-page">.
   - admin.html never loads this file, so the admin panel is untouched.
   - The Service Menu / Price List (.bs-menu) keep their own sizes.
   - The top navigation bar (nav) keeps its own size so it never overflows.
   ===================================================================== */

body.bs-lp {
  --text: #f6f0e4;      /* brighter body text */
  --dim: #efe7d6;       /* "dim" text is now warm ivory, never grey */
  font-weight: 600;
  line-height: 1.5;
}

/* 1) One font everywhere, upright, lining numbers */
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page) *:not(.bs-menu, .bs-menu *, nav, nav *) {
  font-family: var(--display) !important;
  font-style: normal !important;
  font-variant-numeric: lining-nums;
}

/* 2) Size floor: nothing under 1.3rem; bigger text keeps its size */
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page)
  :is(p, li, td, th, dd, dt, label, a, span, div, strong, b, em, i, small, button,
      input, select, textarea, option, figcaption, blockquote, summary, legend, time):not(.bs-menu, .bs-menu *, nav *, .lp-keep, .lp-keep *,
       .price-badge, .order-h, #s-total, .pay-icon, .pay-step-num, .about-fact strong,
       [class*="qty-"], .sr-only, .visually-hidden) {
  font-size: max(1.3rem, 1em) !important;
}

/* 3) Body copy weight + comfortable line height */
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page)
  :is(p, li, td, dd, dt, figcaption, blockquote, small, label, input, select, textarea, option):not(.bs-menu *) {
  font-weight: 600 !important;
  line-height: 1.5;
}

/* 4) Headings to the Price List scale (:not(#lp-x) only raises specificity
      above old ID-scoped !important rules such as #tab-new-order .card h3) */
:is(body.bs-lp .page, body.bs-lp-page) h1:not(.bs-menu *):not(#lp-x) {
  font-size: clamp(2.6rem, 6.5vw, 3.8rem) !important; line-height: 1.12 !important; font-weight: 600 !important;
}
:is(body.bs-lp .page, body.bs-lp-page) h2:not(.bs-menu *):not(#lp-x) {
  font-size: clamp(2.1rem, 5vw, 2.9rem) !important; line-height: 1.18 !important; font-weight: 600 !important;
}
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page) h3:not(.bs-menu *):not(#lp-x) {
  font-size: max(1.65rem, 1em) !important; line-height: 1.25 !important; font-weight: 700 !important;
}
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page) :is(h4, h5, h6):not(.bs-menu *):not(#lp-x) {
  font-size: max(1.45rem, 1em) !important; line-height: 1.3 !important; font-weight: 700 !important;
}

/* 5) Buttons and form fields: big, clear, easy to tap */
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page) .btn:not(.bs-menu *, nav *):not(#lp-x) {
  font-weight: 700 !important; padding: 14px 28px; min-height: 52px; line-height: 1.25;
}
:is(body.bs-lp .page, body.bs-lp footer, body.bs-lp-page) .btn-sm:not(.bs-menu *):not(#lp-x) {
  padding: 10px 18px; min-height: 46px;
}
:is(body.bs-lp .page, body.bs-lp-page) :is(input, select, textarea) {
  padding: 14px 14px; min-height: 54px;
}
:is(body.bs-lp .page, body.bs-lp-page) :is(input[type="checkbox"], input[type="radio"]) {
  min-height: 0; width: 24px; height: 24px; padding: 0;
}
:is(body.bs-lp .page, body.bs-lp-page) label { letter-spacing: 0.02em; }

/* 6) Tables never squeeze the page on phones */
:is(body.bs-lp .page, body.bs-lp-page) table { font-size: inherit; }
@media (max-width: 760px) {
  :is(body.bs-lp .page, body.bs-lp-page) :is(p, li, td, a, span, div) { overflow-wrap: break-word; } /* v7.2.86.0: was "anywhere", which split prices like $25 into $2 / 5 in tables */
}
/* ===== end large print ===== */

/* 7) Forms: with large print, side-by-side fields get cramped, so each field
      takes the full width (Order, Login, Register, account forms). */
body.bs-lp .page .form-row { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: 0 !important; }
body.bs-lp .page .form-row > .form-group { width: 100%; }
@media (min-width: 769px) {
  body.bs-lp #tab-new-order .order-grid { grid-template-columns: minmax(0,1.45fr) minmax(0,1fr); }
}
body.bs-lp #tab-new-order .phone-row { grid-template-columns: minmax(170px, 210px) minmax(0,1fr); }
@media (max-width: 380px) { body.bs-lp #tab-new-order .phone-row { grid-template-columns: minmax(0,1fr); } }