/* ============================================================================
   SchoolNotes - sn30-final.css  (v33)
   Loaded LAST on every page, so these rules win over site-v8..v25 without
   having to edit (and risk breaking) any of them.

   WHAT IT FIXES
   1. THE MOVING "BUY NOW" BAR. Several older stylesheets hide the sticky
      bars with a scroll transform (translateY(100%) / opacity:0). Loading
      them together meant the bar slid around while scrolling and sometimes
      never came back. Here the transform is neutralised for good:
        - mobile: transform:none
        - desktop: only the horizontal centring transform is allowed.
   2. THE BOTTOM OVERLAP. The fixed bar used to cover the last row of the
      page and the app nav. One compact height + one matching body padding
      now keeps the two from fighting.
   3. COMPACTNESS. "Total / items / Pay" on ONE line, small enough that the
      cart total occupies a thin strip instead of a chunk of the screen.
   ============================================================================ */

:root { --sn30-bar-h: 58px; }

/* ---- 1. kill every scroll-hide transform on the fixed bottom bars -------- */
.sn24-checkout-bar,
.pv7-sticky,
.pv7-sticky-fixed,
#pv7-sticky,
.sn26-cart-bar,
.sn-cart-bar,
#sn-cart-bar,
.mobile-app-nav,
.sn-mobile-bar {
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* desktop keeps ONLY the centring transform (see the media query below) */
@media (min-width: 1100px) {
  .sn24-checkout-bar { left: 50%; transform: translateX(-50%) !important; }
}
@media (prefers-reduced-motion: reduce) {
  .sn24-checkout-bar, .pv7-sticky, .pv7-sticky-fixed { transition: none !important; }
}

/* ---- 2. compact, single-line checkout/total bar ------------------------- */
.sn24-checkout-bar {
  position: fixed !important;
  left: 0; right: 0; bottom: 0;
  z-index: 1100;
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 8px 14px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  min-height: var(--sn30-bar-h);
  background: #ffffff !important;
  border-top: 1px solid #d4e3f8 !important;
  box-shadow: 0 -6px 18px -8px rgba(8, 30, 80, .22) !important;
  border-radius: 0 !important;
}
.sn24-cb-left { flex: 0 0 auto; display: flex; flex-direction: column; line-height: 1.05; }
.sn24-cb-label { font-size: .62rem !important; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #64748b; }
.sn24-cb-amount { font-size: 1.1rem !important; font-weight: 900; color: #0b3f7a; }
.sn24-cb-items {
  flex: 1 1 auto; min-width: 0;
  font-size: .72rem !important; font-weight: 700; color: #64748b;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sn24-cb-btn {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 18px !important;
  border: 0; border-radius: 11px; cursor: pointer;
  background: linear-gradient(135deg, #0f8c50 0%, #0b7a43 100%) !important;
  color: #fff; font-weight: 800; font-size: .9rem !important;
  white-space: nowrap;
  box-shadow: 0 8px 16px -10px rgba(11, 122, 67, .9);
}
.sn24-cb-btn[disabled] { background: #9aa3b2 !important; box-shadow: none; cursor: not-allowed; }
@media (min-width: 1100px) {
  .sn24-checkout-bar { max-width: 1120px; border-radius: 14px 14px 0 0 !important; }
}

/* ---- 3. one padding value, so nothing hides under the bar -------------- */
body.has-sticky-bar { padding-bottom: calc(var(--sn30-bar-h) + 12px + env(safe-area-inset-bottom, 0px)) !important; }
body.has-sticky-bar .mobile-app-nav { display: flex !important; bottom: calc(var(--sn30-bar-h) + env(safe-area-inset-bottom, 0px)) !important; }
body.has-sticky-bar.checkout-body { padding-bottom: calc(var(--sn30-bar-h) + 8px + env(safe-area-inset-bottom, 0px)) !important; }

/* ---- 4. product page sticky bar: fixed, thin, never slides ------------- */
.pv7-sticky,
.pv7-sticky-fixed {
  position: fixed !important;
  left: 0; right: 0; bottom: 0;
  z-index: 1090;
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 8px 14px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  background: #fff !important;
  border-top: 1px solid #d4e3f8 !important;
  box-shadow: 0 -6px 18px -10px rgba(8, 30, 80, .25) !important;
}
.pv7-sticky-price { flex: 0 0 auto; line-height: 1.1; }
.pv7-sticky-act { flex: 1 1 auto; display: flex; gap: 8px; justify-content: flex-end; }
.pv7-sticky .pv7-btn { padding: 10px 16px !important; font-size: .9rem !important; }

/* ---- 5. the small links list used by download.php ----------------------- */
.dl-list { display: flex; flex-direction: column; gap: 10px; margin: 0 0 18px; }
.dl-row {
  display: flex; align-items: center; gap: 12px;
  background: #fff; border: 1px solid var(--paper-line); border-radius: 12px;
  padding: 13px 15px; box-shadow: var(--card-shadow); text-decoration: none; color: inherit;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.dl-row:hover { transform: translateY(-2px); box-shadow: var(--card-shadow-lg); border-color: var(--blue); }
.dl-row-ico { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #eaf7ee; color: #0f8c50; font-size: 1.05rem; }
.dl-row-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.dl-row-body strong { font-size: .95rem; color: var(--navy); }
.dl-row-body small { font-size: .76rem; color: var(--ink-soft); }
.dl-row-go { flex: 0 0 auto; color: var(--blue); }
.dl-help { display: flex; gap: 10px; flex-wrap: wrap; }