/* ============================================================================
   SchoolNotes — v25 polish layer
   File: assets/css/site-v25.css   (loaded LAST in includes/header.php)

   Contents
   1. MOBILE HEADER ACTION ICONS — the AI-assistant + WhatsApp buttons get a
      cleaner, bigger, colour-coded tap target on phones (no more two grey
      look-alike squares squeezed next to the account button).
   2. CHECKOUT — compact, focused card: tighter paddings, single-line steps,
      slimmer item rows, smaller pay bar. Nothing functional changes; the
      Razorpay flow and totals are untouched.
   3. DISTRACTION-FREE GUARD — belt-and-braces: the AI/WhatsApp header buttons
      and the promo strip stay off the cart & checkout pages.
   ========================================================================== */

/* ------------------------------------- 1. MOBILE HEADER ACTION ICONS ----- */
@media (max-width: 900px) {
  .header-chat-btn, .header-wa-btn {
    width: 40px;
    height: 40px;
    font-size: 1.05rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    transition: transform .12s ease, box-shadow .12s ease;
  }
  .header-chat-btn {
    background: linear-gradient(135deg, #1A67C4, #0b5fce);
    color: #fff;
    box-shadow: 0 6px 14px -6px rgba(26, 103, 196, .65);
  }
  .header-wa-btn {
    background: linear-gradient(135deg, #25d366, #128c7e);
    color: #fff;
    box-shadow: 0 6px 14px -6px rgba(18, 140, 126, .65);
  }
  .header-chat-btn:active, .header-wa-btn:active { transform: scale(.93); }
}
@media (max-width: 400px) {
  .header-chat-btn, .header-wa-btn { width: 37px; height: 37px; font-size: 1rem; border-radius: 11px; }
  .header-row { gap: 10px; }
}

/* ---------------------------------------------------- 2. CHECKOUT --------- */
/* Compact, focused: the buyer sees price, coupon and details in ~2 screens. */
body.checkout-body .checkout-page h1.page-title { font-size: 1rem; margin: 10px 0 6px; }
body.checkout-body .checkout-steps { margin: 0 auto 12px; padding: 0 2px; }
body.checkout-body .checkout-steps .checkout-step { font-size: .72rem; }
body.checkout-body .checkout-steps .step-num { width: 20px; height: 20px; font-size: .7rem; }

body.checkout-body .checkout-card { max-width: 620px; margin-bottom: 108px; }
body.checkout-body .cc-head { padding: 13px 16px; }
body.checkout-body .cc-block { padding: 14px 16px; }
body.checkout-body .cc-block-title { font-size: .88rem; margin-bottom: 10px; }
body.checkout-body .checkout-item-thumb { width: 44px; height: 44px; border-radius: 8px; }
body.checkout-body .checkout-item-info h4 { font-size: .8rem; }
body.checkout-body .checkout-item-row { padding: 9px 0; }
body.checkout-body .checkout-card .form-field { margin-bottom: 10px; }
/* FIX: this used to reset ALL FOUR sides of padding to "10px 12px", wiping
   out the 40px left padding that checkout-v17.css reserves for the
   name/phone/email field icon. With only 12px of left padding the icon
   (absolutely positioned at left:13px) sat on top of the input's own text,
   so the placeholder/typed value rendered partly hidden behind the icon
   (e.g. "e.g. Priya Sharma" showing as "g. Priya Sharma"). Keeping the
   compact top/bottom/right padding but restoring the left padding fixes it
   without changing the compact sizing this rule was added for. */
body.checkout-body .checkout-card .form-field input { padding: 10px 12px 10px 40px; }
body.checkout-body .checkout-card .btn-lg { padding: 12px 18px; font-size: .95rem; }

/* Slimmer sticky pay bar (kept fixed - never scrolls away on checkout). */
body.checkout-body .sn24-checkout-bar { padding: 9px 14px calc(9px + env(safe-area-inset-bottom, 0px)); }
body.checkout-body .sn24-cb-amount { font-size: 1.15rem; }
body.checkout-body .sn24-cb-label { font-size: .64rem; }
body.checkout-body .sn24-cb-btn { padding: 11px 16px; font-size: .9rem; border-radius: 12px; }
@media (min-width: 1100px) {
  body.checkout-body .sn24-checkout-bar { max-width: 620px; }
}
@media (max-width: 560px) {
  body.checkout-body .sn24-cb-items { display: none; } /* extra focus on phones */
}

/* ------------------------------------- 3. DISTRACTION-FREE GUARD --------- */
body.checkout-body .header-chat-btn,
body.checkout-body .header-wa-btn,
body.cart-body    .header-chat-btn,
body.cart-body    .header-wa-btn { display: none !important; }