/* ============================================================================
   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; }
body.checkout-body .checkout-card .form-field input { padding: 10px 12px; }
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; }
