/* assets/css/store-framework.css — Phase A Bootstrap-compatible subset.
 *
 * Structural layer: CSS custom properties (:root), grid (container, row,
 * col-N, row-cols-N, g-N gutters), navbar + collapse, accordion. Every rule below is
 * copied verbatim (selectors + declarations, including SVG data-URIs and
 * var(--bs-*) custom properties) out of the self-hosted
 * assets/vendor/bootstrap/bootstrap.min.css (Bootstrap 5.3.2) — not
 * reconstructed from memory — filtered down to only the classes actually
 * used by index.php/cart.php/checkout.php/order_success.php/
 * includes/store_header.php/includes/store_footer.php/cart_indicator.php
 * per the Bootstrap removal audit.
 *
 * NOT linked from any page yet (Phase A only). bootstrap.min.css remains
 * the live stylesheet — see the audit's collision review for why these
 * three files stay unreferenced in HTML until a later phase.
 *
 * .navbar-light and .nav-item are used in the HTML but intentionally
 * produce zero rules here — Bootstrap 5.3.2 itself defines none for them
 * either (verified directly against bootstrap.min.css); both classes are
 * already inert no-ops today.
 */

:root,[data-bs-theme=light] {
  /* ===== MaxShop design tokens (Phase 2 — 2026-07; recolored 2026-07-26) =====
   * Single source of truth for brand color. Originally built around the
   * production green (#00aa5b, from max-shop.bg's .btn-primary) — replaced
   * site-wide with the logo's real orange (#f68424) per explicit
   * correction: green was visually wrong as the *navigational/brand*
   * color and is now reserved strictly for semantic success states
   * (in-stock, added-to-cart, valid-form) via --color-success, unchanged.
   *
   * --color-primary (#f68424) is the literal brand hex — reserved for
   * large/decorative fills (badges, icons, focus-ring base) where WCAG's
   * non-text 3:1 threshold applies. Verified, not assumed: raw #f68424
   * against white is only 2.55:1 — fails even the 3:1 non-text minimum,
   * let alone 4.5:1 text. So unlike the green system, the raw hex is NOT
   * safe even for large fills with white text (e.g. a solid button) —
   * every interactive/text use (buttons, links, focus rings, checked
   * states, badges) goes through --color-primary-dark (#ac5c19, verified
   * 4.88:1 both as text-on-white and white-on-fill) instead. See the
   * --bs-primary/--bs-link-color/etc. overrides below, which point at
   * -dark, never at the raw brand hex.
   */
  /* Semantic palette. The literal logo orange is intentionally separate
     from the darker WCAG-safe orange used for normal text and controls. */
  --color-brand:#f68424;
  --color-brand-hover:#a05617;
  --color-brand-active:#944f16;
  --color-brand-text:#ac5c19;
  --color-brand-on-light:#ac5c19;
  --color-brand-on-dark:#f68424;
  --color-brand-contrast:#ffffff;
  --color-brand-soft:#fff3e8;
  --color-brand-border:#fde0c8;
  --color-focus:#ac5c19;
  --color-focus-border:#fcd4b2;
  --color-focus-ring:rgba(172,92,25,.25);
  --color-focus-ring-subtle:rgba(172,92,25,.18);
  --color-focus-ring-strong:rgba(172,92,25,.5);
  --color-brand-border-translucent:rgba(172,92,25,.3);
  --color-brand-shadow:rgba(172,92,25,.2);
  --color-brand-shadow-hover:rgba(172,92,25,.28);
  --color-brand-text-rgb:172,92,25;
  --color-brand-hover-rgb:160,86,23;

  /* Compatibility aliases for existing templates. New component work uses
     the semantic names above; these prevent a risky all-at-once migration. */
  --color-primary:var(--color-brand);
  --color-primary-hover:#df7119;
  --color-primary-dark:var(--color-brand-text);
  --color-primary-darker:var(--color-brand-hover);
  --color-primary-darkest:var(--color-brand-active);
  --color-primary-soft:var(--color-brand-soft);
  --color-primary-focus-border:var(--color-focus-border);
  --color-primary-focus-ring:var(--color-focus-ring);
  --color-primary-border-subtle:var(--color-brand-border);

  --color-accent:#f8303d;
  --color-accent-dark:#c81e29;
  --color-accent-soft:#fff0f1;

  --color-heading:#111827;
  --color-text:#1f2937;
  --color-text-muted:#667085;

  --color-background:#ffffff;
  --color-surface:#f8f9fb;
  --color-surface-alt:#f3f4f6;
  --color-border:#e5e7eb;
  --color-border-strong:#8a94a3;

  --color-success:#198754;
  --color-success-hover:#157347;
  --color-success-active:#146c43;
  --color-success-active-border:#13653f;
  --color-success-text:#146c43;
  --color-success-surface:#d1e7dd;
  --color-success-contrast:#ffffff;
  --color-success-rgb:25,135,84;
  --color-success-focus-rgb:60,153,110;
  --color-warning:#b7791f;
  --color-warning-on:#101828;
  --color-danger:#dc3545;
  --color-danger-text:#842029;
  --color-danger-surface:#f8d7da;
  --color-danger-border:#f1aeb5;
  --color-danger-contrast:#ffffff;
  --color-danger-rgb:220,53,69;

  --radius-small:6px;
  --radius-medium:10px;
  --radius-large:16px;

  --shadow-small:0 1px 3px rgba(16,24,40,.08);
  --shadow-medium:0 6px 18px rgba(16,24,40,.10);

  --container-width:1440px;
  /* Unified side-padding for .container, scaled by viewport (Phase 13
     layout correction) — kept as its own variable, separate from
     --bs-gutter-x (which stays 1.5rem for the internal .row/.col grid
     gutters), so widening the outer page margin never also widens the
     gap between grid columns. */
  --container-pad:16px;

  --bs-blue:#0d6efd;
  --bs-indigo:#6610f2;
  --bs-purple:#6f42c1;
  --bs-pink:#d63384;
  --bs-red:var(--color-danger);
  --bs-orange:#fd7e14;
  --bs-yellow:#ffc107;
  --bs-green:var(--color-success);
  --bs-teal:#20c997;
  --bs-cyan:#0dcaf0;
  --bs-black:#000;
  --bs-white:#fff;
  --bs-gray:#6c757d;
  --bs-gray-dark:#343a40;
  --bs-gray-100:#f8f9fa;
  --bs-gray-200:#e9ecef;
  --bs-gray-300:#dee2e6;
  --bs-gray-400:#ced4da;
  --bs-gray-500:#adb5bd;
  --bs-gray-600:#6c757d;
  --bs-gray-700:#495057;
  --bs-gray-800:#343a40;
  --bs-gray-900:#212529;
  --bs-primary:var(--color-brand-text);
  --bs-secondary:#6c757d;
  --bs-success:var(--color-success);
  --bs-info:#0dcaf0;
  --bs-warning:#b7791f;
  --bs-danger:var(--color-danger);
  --bs-light:#f8f9fa;
  --bs-dark:#212529;
  --bs-primary-rgb:var(--color-brand-text-rgb);
  --bs-secondary-rgb:108,117,125;
  --bs-success-rgb:var(--color-success-rgb);
  --bs-info-rgb:13,202,240;
  --bs-warning-rgb:183,121,31;
  --bs-danger-rgb:var(--color-danger-rgb);
  --bs-light-rgb:248,249,250;
  --bs-dark-rgb:33,37,41;
  --bs-primary-text-emphasis:#5c3410;
  --bs-secondary-text-emphasis:#2b2f32;
  --bs-success-text-emphasis:#0a3622;
  --bs-info-text-emphasis:#055160;
  --bs-warning-text-emphasis:#5c3d10;
  --bs-danger-text-emphasis:#58151c;
  --bs-light-text-emphasis:#495057;
  --bs-dark-text-emphasis:#495057;
  --bs-primary-bg-subtle:var(--color-brand-soft);
  --bs-secondary-bg-subtle:#e2e3e5;
  --bs-success-bg-subtle:var(--color-success-surface);
  --bs-info-bg-subtle:#cff4fc;
  --bs-warning-bg-subtle:#fbf0dd;
  --bs-danger-bg-subtle:var(--color-danger-surface);
  --bs-light-bg-subtle:#fcfcfd;
  --bs-dark-bg-subtle:#ced4da;
  --bs-primary-border-subtle:var(--color-brand-border);
  --bs-secondary-border-subtle:#c4c8cb;
  --bs-success-border-subtle:#a3cfbb;
  --bs-info-border-subtle:#9eeaf9;
  --bs-warning-border-subtle:#eecd97;
  --bs-danger-border-subtle:var(--color-danger-border);
  --bs-light-border-subtle:#e9ecef;
  --bs-dark-border-subtle:#adb5bd;
  --bs-white-rgb:255,255,255;
  --bs-black-rgb:0,0,0;
  /* Native UI typography: no external request, no font swap and no font
   * metric-driven layout shift. macOS/iOS use San Francisco through
   * -apple-system; current Windows uses Segoe UI Variable, with stable
   * platform fallbacks everywhere else. */
  --bs-font-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI Variable","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
  --bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  --font-weight-body:400;
  --font-weight-heading-1:700;
  --font-weight-heading-2:400;
  --font-weight-heading-3:600;
  --font-weight-heading-compact:500;
  --bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family:var(--bs-font-sans-serif);
  --bs-body-font-size:1.0625rem;
  --bs-body-font-weight:var(--font-weight-body);
  --bs-body-line-height:1.6;
  --bs-body-color:#1f2937;
  --bs-body-color-rgb:31,41,55;
  --bs-body-bg:#fff;
  --bs-body-bg-rgb:255,255,255;
  --bs-emphasis-color:#111827;
  --bs-emphasis-color-rgb:17,24,39;
  --bs-secondary-color:rgba(31, 41, 55, 0.75);
  --bs-secondary-color-rgb:31,41,55;
  --bs-secondary-bg:#f3f4f6;
  --bs-secondary-bg-rgb:243,244,246;
  --bs-tertiary-color:rgba(31, 41, 55, 0.5);
  --bs-tertiary-color-rgb:31,41,55;
  --bs-tertiary-bg:#f8f9fb;
  --bs-tertiary-bg-rgb:248,249,251;
  --bs-heading-color:#111827;
  --bs-link-color:var(--color-brand-on-light);
  --bs-link-color-rgb:var(--color-brand-text-rgb);
  --bs-link-decoration:underline;
  --bs-link-hover-color:var(--color-brand-hover);
  --bs-link-hover-color-rgb:var(--color-brand-hover-rgb);
  --bs-code-color:#d63384;
  --bs-highlight-color:#212529;
  --bs-highlight-bg:#fff3cd;
  --bs-border-width:1px;
  --bs-border-style:solid;
  --bs-border-color:var(--color-border);
  --bs-border-color-translucent:rgba(0, 0, 0, 0.175);
  --bs-border-radius:0.375rem;
  --bs-border-radius-sm:0.25rem;
  --bs-border-radius-lg:0.5rem;
  --bs-border-radius-xl:1rem;
  --bs-border-radius-xxl:2rem;
  --bs-border-radius-2xl:var(--bs-border-radius-xxl);
  --bs-border-radius-pill:50rem;
  --bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width:0.25rem;
  --bs-focus-ring-opacity:0.25;
  --bs-focus-ring-color:var(--color-focus-ring);
  --bs-form-valid-color:var(--color-success);
  --bs-form-valid-border-color:var(--color-success);
  --bs-form-invalid-color:var(--color-danger);
  --bs-form-invalid-border-color:var(--color-danger);
  --bs-breakpoint-xs:0;
  --bs-breakpoint-sm:576px;
  --bs-breakpoint-md:768px;
  --bs-breakpoint-lg:992px;
  --bs-breakpoint-xl:1200px;
  --bs-breakpoint-xxl:1400px;
}

/* Minimal reboot slice (hand-picked, not class-extracted — these are bare
   element selectors, invisible to the class-token extractor above): every
   grid, form and button box-model calculation below assumes border-box
   sizing, Bootstrap's own body/link/svg/form-control resets, or it
   silently drifts from the real Bootstrap render (confirmed by an actual
   pixel A/B — the plain `body{}` rule below is what a real headless-Chrome
   comparison caught missing: without it the page falls back to the
   browser's UA stylesheet body margin/font, which measurably changed the
   total page height). Inert today (bootstrap.min.css still loaded and
   still supplies its own copy of each of these rules) — kept here only so
   this file is self-sufficient once Phase C actually unlinks Bootstrap. */
*,
*::before,
*::after {
  box-sizing: border-box;
}
body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}
a {
  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
  text-decoration: underline;
}
a:hover {
  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
}
img,
svg {
  vertical-align: middle;
}
/* Bare <hr> falls back to the browser's default 3D inset/groove border
   (a visibly dark, heavy line) with nothing above overriding it — flagged
   in the Phase 12 visual correction ("without a heavy black horizontal
   line"). Real light-gray token divider instead. */
hr {
  margin: 1rem 0;
  color: inherit;
  border: 0;
  border-top: 1px solid var(--color-border);
  opacity: 1;
}
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
dl,
ol,
ul {
  margin-top: 0;
  margin-bottom: 1rem;
}
ol,
ul {
  padding-left: 2rem;
}
/* Bare h1-h6 margin/weight/line-height reset — real production case is
   index.php:944 "h2 class=accordion-header", which carries no .h4/.h5/.h6
   utility class, so only the bare-element half of Bootstrap's combined
   ".h1..h6,h1..h6{...}" rule reaches it. Found by the pixel A/B: without
   this, the accordion grew ~48px taller than the real Bootstrap render
   (unreset UA-stylesheet h2 margin). */
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  margin-bottom: .5rem;
  line-height: 1.2;
  color: var(--bs-heading-color);
}
h1 { font-weight: var(--font-weight-heading-1); }
h2 { font-weight: var(--font-weight-heading-2); }
h3 { font-weight: var(--font-weight-heading-3); }
h4,
h5,
h6 { font-weight: var(--font-weight-heading-compact); }
/* Without this, <label class="form-label"> falls back to the browser's
   default `display:inline`, which silently ate exactly 8px (the .form-label
   margin-bottom) per field group in the pixel A/B — inline-block is what
   lets that margin actually push the following control down. */
label {
  display: inline-block;
}
/* Real production case: checkout.php:602 renders the Econt office <select>
   disabled until a city is chosen. Without this, the browser's default
   :disabled dimming (~0.7 opacity) applies instead of Bootstrap's own
   opacity:1 override — found as a solid (non-shifted) diff region in the
   pixel A/B, isolated to exactly this element. */
select:disabled {
  opacity: 1;
}
/* Without border-collapse:collapse, <table> falls back to the browser
   default border-collapse:separate (2px border-spacing), adding a few px
   of extra height per row boundary — found in the pixel A/B as a steady
   +4px on the cart table (cart.php's table-responsive). th text-align is
   along for the ride from the same reboot block, not independently found
   as a visual diff (our <th> cells already carry explicit
   text-center/text-end where alignment matters). */
table {
  caption-side: bottom;
  border-collapse: collapse;
}
th {
  text-align: inherit;
  text-align: -webkit-match-parent;
}

/* ===== Grid / Navbar / Collapse / Accordion ===== */

/* ---- grid ---- */
/* Fluid site container (Phase 13 layout correction, 2026-07-26): replaces
   Bootstrap's stock fixed-step ladder (540/720/960/1140/1320px), which
   snapped to reference widths per breakpoint but left only a fixed 12px
   gutter as the real edge padding at every one of them — at exactly
   1440px viewport that meant content sat just 12px from the glass, the
   "залепен до краищата" bug. The container's own width is now always
   `100% minus 2x the responsive pad`, capped at --container-width, so
   the edge padding is deliberate and consistent at every viewport, not
   just at the handful of widths Bootstrap's ladder happened to define. */
.container {
  --bs-gutter-x:1.5rem;
  --bs-gutter-y:0;
  width:min(100% - (var(--container-pad) * 2), var(--container-width));
  margin-right:auto;
  margin-left:auto;
  padding-right:0;
  padding-left:0;
}
@media (min-width:576px) {
  :root { --container-pad:20px; }
}
@media (min-width:768px) {
  :root { --container-pad:24px; }
}
@media (min-width:1024px) {
  :root { --container-pad:32px; }
}
@media (min-width:1440px) {
  :root { --container-pad:48px; }
}
.row {
  --bs-gutter-x:1.5rem;
  --bs-gutter-y:0;
  display:flex;
  flex-wrap:wrap;
  margin-top:calc(-1 * var(--bs-gutter-y));
  margin-right:calc(-.5 * var(--bs-gutter-x));
  margin-left:calc(-.5 * var(--bs-gutter-x));
}
.row>* {
  flex-shrink:0;
  width:100%;
  max-width:100%;
  padding-right:calc(var(--bs-gutter-x) * .5);
  padding-left:calc(var(--bs-gutter-x) * .5);
  margin-top:var(--bs-gutter-y);
}
.col {
  flex:1 0 0%;
}
.row-cols-1>* {
  flex:0 0 auto;
  width:100%;
}
.col-6 {
  flex:0 0 auto;
  width:50%;
}
.col-12 {
  flex:0 0 auto;
  width:100%;
}
.g-2 {
  --bs-gutter-x:0.5rem;
}
.g-2 {
  --bs-gutter-y:0.5rem;
}
.g-3 {
  --bs-gutter-x:1rem;
}
.g-3 {
  --bs-gutter-y:1rem;
}
.g-4 {
  --bs-gutter-x:1.5rem;
}
.g-4 {
  --bs-gutter-y:1.5rem;
}
@media (min-width:576px) {
  .row-cols-sm-2>* {
    flex:0 0 auto;
    width:50%;
  }
}
@media (min-width:768px) {
  .col-md-3 {
    flex:0 0 auto;
    width:25%;
  }
  .col-md-6 {
    flex:0 0 auto;
    width:50%;
  }
  .col-md-9 {
    flex:0 0 auto;
    width:75%;
  }
}
@media (min-width:992px) {
  .row-cols-lg-3>* {
    flex:0 0 auto;
    width:33.33333333%;
  }
  .row-cols-lg-4>* {
    flex:0 0 auto;
    width:25%;
  }
  .col-lg-3 {
    flex:0 0 auto;
    width:25%;
  }
  .col-lg-4 {
    flex:0 0 auto;
    width:33.33333333%;
  }
  .col-lg-5 {
    flex:0 0 auto;
    width:41.66666667%;
  }
  .col-lg-7 {
    flex:0 0 auto;
    width:58.33333333%;
  }
  .col-lg-8 {
    flex:0 0 auto;
    width:66.66666667%;
  }
}
@media (min-width:1200px) {
  /* Added Phase 12 (2026-07-26 correction) — the listing grid needs a
     4th breakpoint (3 columns beside the sidebar at laptop widths, 4 once
     there's enough real room next to it at wider desktop) now that the
     sidebar is a fixed ~290px instead of a 25%-of-container column. */
  .row-cols-xl-4>* {
    flex:0 0 auto;
    width:25%;
  }
}

/* ---- navbar-collapse ---- */
.collapse:not(.show) {
  display:none;
}
.collapsing {
  height:0;
  overflow:hidden;
  transition:height .35s ease;
}
@media (prefers-reduced-motion:reduce) {
  .collapsing {
    transition:none;
  }
}
.nav-link {
  display:block;
  padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size:var(--bs-nav-link-font-size);
  font-weight:var(--bs-nav-link-font-weight);
  color:var(--bs-nav-link-color);
  text-decoration:none;
  background:0 0;
  border:0;
  transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}
@media (prefers-reduced-motion:reduce) {
  .nav-link {
    transition:none;
  }
}
.nav-link:focus,.nav-link:hover {
  color:var(--bs-nav-link-hover-color);
}
.nav-link:focus-visible {
  outline:0;
  box-shadow:0 0 0 .25rem var(--color-focus-ring);
}
.nav-link.disabled,.nav-link:disabled {
  color:var(--bs-nav-link-disabled-color);
  pointer-events:none;
  cursor:default;
}
.navbar {
  --bs-navbar-padding-x:0;
  --bs-navbar-padding-y:0.5rem;
  --bs-navbar-color:rgba(var(--bs-emphasis-color-rgb), 0.65);
  --bs-navbar-hover-color:rgba(var(--bs-emphasis-color-rgb), 0.8);
  --bs-navbar-disabled-color:rgba(var(--bs-emphasis-color-rgb), 0.3);
  --bs-navbar-active-color:rgba(var(--bs-emphasis-color-rgb), 1);
  --bs-navbar-brand-padding-y:0.3125rem;
  --bs-navbar-brand-margin-end:1rem;
  --bs-navbar-brand-font-size:1.25rem;
  --bs-navbar-brand-color:rgba(var(--bs-emphasis-color-rgb), 1);
  --bs-navbar-brand-hover-color:rgba(var(--bs-emphasis-color-rgb), 1);
  --bs-navbar-nav-link-padding-x:0.5rem;
  --bs-navbar-toggler-padding-y:0.25rem;
  --bs-navbar-toggler-padding-x:0.75rem;
  --bs-navbar-toggler-font-size:1.25rem;
  --bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2833, 37, 41, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  --bs-navbar-toggler-border-color:rgba(var(--bs-emphasis-color-rgb), 0.15);
  --bs-navbar-toggler-border-radius:var(--bs-border-radius);
  --bs-navbar-toggler-focus-width:0.25rem;
  --bs-navbar-toggler-transition:box-shadow 0.15s ease-in-out;
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x);
}
.navbar>.container {
  display:flex;
  flex-wrap:inherit;
  align-items:center;
  justify-content:space-between;
}
.navbar-nav {
  --bs-nav-link-padding-x:0;
  --bs-nav-link-padding-y:0.5rem;
  --bs-nav-link-font-weight:;
  --bs-nav-link-color:var(--bs-navbar-color);
  --bs-nav-link-hover-color:var(--bs-navbar-hover-color);
  --bs-nav-link-disabled-color:var(--bs-navbar-disabled-color);
  display:flex;
  flex-direction:column;
  padding-left:0;
  margin-bottom:0;
  list-style:none;
}
.navbar-nav .nav-link.active,.navbar-nav .nav-link.show {
  color:var(--bs-navbar-active-color);
}
.navbar-collapse {
  flex-basis:100%;
  flex-grow:1;
  align-items:center;
}
.navbar-toggler {
  padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
  font-size:var(--bs-navbar-toggler-font-size);
  line-height:1;
  color:var(--bs-navbar-color);
  background-color:transparent;
  border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);
  border-radius:var(--bs-navbar-toggler-border-radius);
  transition:var(--bs-navbar-toggler-transition);
}
@media (prefers-reduced-motion:reduce) {
  .navbar-toggler {
    transition:none;
  }
}
.navbar-toggler:hover {
  text-decoration:none;
}
.navbar-toggler:focus {
  text-decoration:none;
  outline:0;
  box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width);
}
.navbar-toggler-icon {
  display:inline-block;
  width:1.5em;
  height:1.5em;
  vertical-align:middle;
  background-image:var(--bs-navbar-toggler-icon-bg);
  background-repeat:no-repeat;
  background-position:center;
  background-size:100%;
}
@media (min-width:992px) {
  .navbar-expand-lg {
    flex-wrap:nowrap;
    justify-content:flex-start;
  }
  .navbar-expand-lg .navbar-nav {
    flex-direction:row;
  }
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-right:var(--bs-navbar-nav-link-padding-x);
    padding-left:var(--bs-navbar-nav-link-padding-x);
  }
  .navbar-expand-lg .navbar-collapse {
    display:flex!important;
    flex-basis:auto;
  }
  .navbar-expand-lg .navbar-toggler {
    display:none;
  }
}
.sticky-top {
  position:-webkit-sticky;
  position:sticky;
  top:0;
  z-index:1020;
}

/* ---- accordion ---- */
.accordion {
  --bs-accordion-color:var(--bs-body-color);
  --bs-accordion-bg:var(--bs-body-bg);
  --bs-accordion-transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;
  --bs-accordion-border-color:var(--bs-border-color);
  --bs-accordion-border-width:var(--bs-border-width);
  --bs-accordion-border-radius:var(--bs-border-radius);
  --bs-accordion-inner-border-radius:calc(var(--bs-border-radius) - (var(--bs-border-width)));
  --bs-accordion-btn-padding-x:1.25rem;
  --bs-accordion-btn-padding-y:1rem;
  --bs-accordion-btn-color:var(--bs-body-color);
  --bs-accordion-btn-bg:var(--bs-accordion-bg);
  --bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-icon-width:1.25rem;
  --bs-accordion-btn-icon-transform:rotate(-180deg);
  --bs-accordion-btn-icon-transition:transform 0.2s ease-in-out;
  --bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%235c3410'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-focus-border-color:var(--color-focus-border);
  --bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem var(--color-focus-ring);
  --bs-accordion-body-padding-x:1.25rem;
  --bs-accordion-body-padding-y:1rem;
  --bs-accordion-active-color:var(--bs-primary-text-emphasis);
  --bs-accordion-active-bg:var(--bs-primary-bg-subtle);
}
.accordion-button {
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  padding:var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
  font-size:1rem;
  color:var(--bs-accordion-btn-color);
  text-align:left;
  background-color:var(--bs-accordion-btn-bg);
  border:0;
  border-radius:0;
  overflow-anchor:none;
  transition:var(--bs-accordion-transition);
}
@media (prefers-reduced-motion:reduce) {
  .accordion-button {
    transition:none;
  }
}
.accordion-button:not(.collapsed) {
  color:var(--bs-accordion-active-color);
  background-color:var(--bs-accordion-active-bg);
  box-shadow:inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}
.accordion-button:not(.collapsed)::after {
  background-image:var(--bs-accordion-btn-active-icon);
  transform:var(--bs-accordion-btn-icon-transform);
}
.accordion-button::after {
  flex-shrink:0;
  width:var(--bs-accordion-btn-icon-width);
  height:var(--bs-accordion-btn-icon-width);
  margin-left:auto;
  content:"";
  background-image:var(--bs-accordion-btn-icon);
  background-repeat:no-repeat;
  background-size:var(--bs-accordion-btn-icon-width);
  transition:var(--bs-accordion-btn-icon-transition);
}
@media (prefers-reduced-motion:reduce) {
  .accordion-button::after {
    transition:none;
  }
}
.accordion-button:hover {
  z-index:2;
}
.accordion-button:focus {
  z-index:3;
  border-color:var(--bs-accordion-btn-focus-border-color);
  outline:0;
  box-shadow:var(--bs-accordion-btn-focus-box-shadow);
}
.accordion-header {
  margin-bottom:0;
}
.accordion-item {
  color:var(--bs-accordion-color);
  background-color:var(--bs-accordion-bg);
  border:var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
}
.accordion-item:first-of-type {
  border-top-left-radius:var(--bs-accordion-border-radius);
  border-top-right-radius:var(--bs-accordion-border-radius);
}
.accordion-item:first-of-type .accordion-button {
  border-top-left-radius:var(--bs-accordion-inner-border-radius);
  border-top-right-radius:var(--bs-accordion-inner-border-radius);
}
.accordion-item:not(:first-of-type) {
  border-top:0;
}
.accordion-item:last-of-type {
  border-bottom-right-radius:var(--bs-accordion-border-radius);
  border-bottom-left-radius:var(--bs-accordion-border-radius);
}
.accordion-item:last-of-type .accordion-button.collapsed {
  border-bottom-right-radius:var(--bs-accordion-inner-border-radius);
  border-bottom-left-radius:var(--bs-accordion-inner-border-radius);
}
.accordion-item:last-of-type .accordion-collapse {
  border-bottom-right-radius:var(--bs-accordion-border-radius);
  border-bottom-left-radius:var(--bs-accordion-border-radius);
}
.accordion-body {
  padding:var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x);
}