/* Inner pages — catalogue, book detail, cart, checkout (loaded after theme.css) */

/* Page heading band */
.page-head{background:var(--navy);padding:46px 0 50px}
.page-head::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.045) 1px,transparent 1px);background-size:6px 6px;pointer-events:none}
.page-head .wrap{position:relative}
.page-head h1{color:#fff;font-size:clamp(2.6rem,6vw,4.6rem);margin:6px 0 8px}
.page-head h1 span{color:var(--gold)}
.page-head p{color:#c9d2e0;max-width:620px;font-family:var(--body-serif)}
.crumb{font-size:.78rem;color:#9fabc0;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.crumb i{font-size:.55rem;margin:0 8px;color:var(--gold)}
.crumb a:hover{color:var(--gold)}
.crumb span{color:#fff}

/* Subject chips */
.chips-bar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:126px;z-index:20}
.chips{display:flex;gap:8px;padding-top:14px;padding-bottom:14px;overflow-x:auto;scrollbar-width:none}
.chips a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;border:1.5px solid var(--navy);color:var(--navy);padding:7px 16px;border-radius:999px;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;transition:.2s}
.chips a i{color:var(--gold)}
.chips a em{font-style:normal;background:var(--gold-soft);color:var(--navy);border-radius:999px;padding:0 7px;font-size:.7rem}
.chips a:hover,.chips a.on{background:var(--navy);color:#fff}
.chips a.on em{background:var(--gold)}

/* Catalogue */
.shop{grid-template-columns:270px 1fr;gap:36px;padding-top:36px}
.filters form{background:var(--navy);border:0;color:#fff;border-radius:18px;padding:24px;top:200px}
.filters label{color:#c9d2e0;font-size:.74rem;text-transform:uppercase;letter-spacing:.1em}
.filters label.check{text-transform:none;letter-spacing:0;font-size:.88rem}
.filters input:not([type=checkbox]),.filters select{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15);color:#fff}
.filters select option{color:var(--ink)}
.filters input::placeholder{color:#8f9bb0}
.filters .btn{background:var(--gold);border-color:var(--gold);color:var(--navy);font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.05em}
.filters .btn:hover{background:#fff;border-color:#fff}
.filters .link{color:#c9d2e0;border-color:transparent;text-align:center}
.f-head{font-family:var(--display);text-transform:uppercase;font-size:1.35rem;letter-spacing:.03em;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.12)}
.f-head i{color:var(--gold);margin-right:8px;font-size:1rem}
.results-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:#fff;border-radius:12px;padding:14px 20px;margin-bottom:24px;font-size:.9rem}
.results-bar b{font-family:var(--display);font-weight:400;font-size:1.3rem;color:var(--navy);margin-right:4px}
.rb-hint{color:var(--muted)}
.rb-hint i{color:var(--gold);margin-right:6px}
.grid.g3{gap:22px}

/* Book detail */
.detail-band{background:var(--navy);padding:16px 0}
.detail{grid-template-columns:480px 1fr;gap:64px;padding-top:44px}
.detail-img{background:#fff;border-radius:24px;padding:60px 70px;display:grid;place-items:center;overflow:hidden;position:sticky;top:150px}
.detail-img .sun{width:380px;height:380px;left:50%;top:50%;transform:translate(-50%,-50%)}
.detail-img .cover{position:relative;z-index:1;box-shadow:0 40px 60px -22px rgba(11,29,51,.7)}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.code.big{background:var(--navy);color:var(--gold);border-radius:999px;padding:6px 14px}
.tag-soft{background:#fff;border:1px solid var(--line);color:var(--navy);border-radius:999px;padding:5px 14px;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.detail-info h1{font-size:clamp(2.2rem,4.4vw,3.6rem);margin:6px 0 10px}
.by{font-family:var(--body-serif);font-size:1.05rem}
.price-row{display:flex;align-items:center;gap:20px;margin:22px 0 6px}
.detail-price{font-family:var(--display);font-weight:400;font-size:3rem;color:var(--navy);margin:0;line-height:1}
.stock{display:inline-flex;align-items:center;gap:6px;background:#fff;border-radius:999px;padding:6px 14px;font-size:.8rem}
.stock i{font-size:.5rem}
.desc{font-family:var(--body-serif);font-size:1.08rem;color:#4a5160}
.buy{border:0;padding:6px 0 0}
.buy .btn{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.05em;font-size:1rem;height:52px}
.buy .btn-gold{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.buy .btn-gold:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.qty-box{background:#fff;border:1.5px solid var(--navy)}
.wa-btn{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:14px;background:#25d366;color:#fff;border-radius:999px;height:50px;font-weight:700;max-width:100%;transition:.2s}
.wa-btn:hover{background:#1ebe5b;transform:translateY(-2px)}
.wa-btn i{font-size:1.3rem}
.perks{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:26px;border-top:2px solid var(--navy)}
.perks div{display:flex;gap:12px;align-items:center;padding:18px 12px 18px 0}
.perks i{color:var(--gold);font-size:1.3rem;width:26px;text-align:center}
.perks b{display:block;font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.03em;color:var(--navy)}
.perks span{font-size:.8rem;color:var(--muted);line-height:1.35}
.specs-title{font-size:1.5rem;margin:26px 0 12px}
.specs{margin-top:0;border:0}
.specs th{background:var(--navy);color:#c9d2e0;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;border-bottom-color:rgba(255,255,255,.08)}
.specs td{font-weight:600;color:var(--navy)}

/* Order steps indicator */
.flow{list-style:none;display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.flow li{display:flex;align-items:center;gap:10px;color:#9fabc0;font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}
.flow li:not(:last-child)::after{content:"";width:40px;height:2px;background:rgba(255,255,255,.2);margin-left:6px}
.flow li>i{font-style:normal;width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,255,255,.3);display:grid;place-items:center;font-size:.8rem}
.flow li.on{color:#fff}.flow li.on>i{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.flow li.done{color:var(--gold)}.flow li.done>i{border-color:var(--gold);color:var(--gold)}

/* Cart */
.cart-layout{grid-template-columns:1fr 390px;gap:30px;padding:44px 0}
.cart-table{border:0;border-radius:18px;padding:10px 28px 24px}
.cart-row{grid-template-columns:76px 1fr 90px 110px 34px;padding:20px 0}
.cart-row b{font-family:var(--display);font-weight:400;font-size:1.15rem;text-transform:uppercase;color:var(--navy);line-height:1.15;display:block;margin-bottom:4px}
.cover.thumb{width:76px}
.qty-in{text-align:center;border:1.5px solid var(--navy)!important;border-radius:999px!important;font-weight:700}
.cart-row>strong{font-family:var(--display);font-weight:400;font-size:1.3rem;color:var(--navy);text-align:right}
.x{width:34px;height:34px;border-radius:50%;background:var(--ivory);display:grid;place-items:center}
.x:hover{background:#fbe0dc}
.cart-actions .btn-outline{border-color:var(--navy)}
.summary{background:var(--navy);border:0;color:#fff;border-radius:18px;padding:30px;top:150px}
.summary h3{color:#fff;font-size:1.7rem;border-bottom-color:rgba(255,255,255,.12)}
.summary>div span{color:#c9d2e0}
.summary>div b{color:#fff}
.summary .sm{color:#c9d2e0;border-bottom:1px dashed rgba(255,255,255,.12);padding-bottom:10px}
.summary .sm small{color:var(--gold)}
.summary .tot{border-top-color:rgba(255,255,255,.12)}
.summary .tot b{font-family:var(--display);font-weight:400;font-size:2.2rem;color:var(--gold)}
.summary .btn{background:var(--gold);border-color:var(--gold);color:var(--navy);font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.05em;font-size:1.05rem;height:54px}
.summary .btn:hover{background:#fff;border-color:#fff}
.summary .hint{color:#9fabc0}
.summary::after{content:"\f023  Secure order · Cash on Delivery available";font-family:"Font Awesome 6 Free",var(--sans);font-weight:900;font-size:.72rem;color:#9fabc0;text-align:center;letter-spacing:.04em}

/* Checkout */
.form-card{border:0;border-radius:18px;padding:32px}
.form-card h3{font-size:1.7rem;display:flex;align-items:center;gap:12px;margin-top:10px}
.form-card h3::before{content:"";width:28px;height:3px;background:var(--gold)}
.form-card label{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--navy)}
.pay{border:1.5px solid var(--line);border-radius:14px;padding:18px;text-transform:none;letter-spacing:0;font-size:.95rem}
.pay:has(input:checked){border-color:var(--navy);background:#fff;box-shadow:inset 4px 0 0 var(--gold)}
.pay b{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.03em;font-size:1.1rem}
.alert{border-left:4px solid var(--red)}

@media (max-width:980px){
  .chips-bar{top:126px}
  .shop{grid-template-columns:1fr}
  .filters form{position:static}
  .detail{grid-template-columns:1fr;gap:30px}
  .detail-img{position:static;max-width:460px;width:100%;margin:0 auto;padding:44px}
  .cart-layout{grid-template-columns:1fr}
  .summary{position:static}
}
@media (max-width:560px){
  .chips-bar{position:static}
  .page-head{padding:34px 0 38px}
  .detail-img{padding:30px 40px}
  .detail-img .sun{width:260px;height:260px}
  .detail-price{font-size:2.4rem}
  .buy{display:grid;grid-template-columns:auto 1fr}
  .buy .btn-gold{grid-column:1/-1}
  .perks{grid-template-columns:1fr}
  .perks div{padding:12px 0;border-bottom:1px solid var(--line)}
  .cart-table{padding:6px 16px 18px}
  .cart-row{grid-template-columns:60px 1fr 64px}
  .cart-row>strong{grid-column:2;text-align:left}
  .cover.thumb{width:60px}
  .flow li:not(:last-child)::after{width:16px}
  .form-card{padding:22px}
}
.page-head::after{background:transparent;opacity:1;border:2px solid rgba(240,164,58,.35);box-shadow:0 0 0 30px rgba(240,164,58,.05),0 0 0 60px rgba(240,164,58,.03)}
@media (max-width:980px){.detail-img{position:relative;top:auto}}
/* Bank transfer receipt upload */
.receipt-box{display:grid;gap:14px;background:var(--ivory);border:1.5px dashed #d9c4a6;border-radius:16px;padding:18px}
.drop{position:relative;display:grid!important;justify-items:center;gap:4px;text-align:center;background:#fff;border:2px dashed var(--gold);border-radius:14px;padding:22px 16px;cursor:pointer;transition:.2s;text-transform:none!important;letter-spacing:0!important}
.drop:hover,.drop.over{background:var(--gold-soft)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.drop>i{font-size:1.8rem;color:var(--gold)}
.drop b{color:var(--navy);font-size:.95rem}
.drop small{color:var(--muted);font-weight:500}
.drop img{max-height:160px;border-radius:8px;margin-top:8px;box-shadow:0 8px 20px -10px rgba(0,0,0,.4)}
.r-name{color:var(--green);font-weight:600;font-size:.85rem}
.receipt-box .hint i{color:var(--green)}

/* Compact filter: collapsible on tablet/mobile, fields side by side */
.f-head{width:100%;display:flex;align-items:center;gap:10px;text-align:left;color:#fff;cursor:default}
.f-arrow{display:none;margin-left:auto;font-size:.8rem!important;transition:transform .3s}
@media (max-width:980px){
  .filters form{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:14px 18px;border-radius:14px;align-items:end}
  .filters .f-head{grid-column:1/-1;cursor:pointer;padding:4px 0;border:0;font-size:1.1rem}
  .f-arrow{display:inline-block}
  .filters form.open .f-arrow{transform:rotate(180deg)}
  .filters form>*:not(.f-head):not(input[type=hidden]){display:none}
  .filters form.open>*:not(.f-head):not(input[type=hidden]){display:grid}
  .filters form.open>label.check{display:flex}
  .filters form.open>.link{display:block;grid-column:1/-1}
  .filters form.open .btn{grid-column:span 2}
  .filters input:not([type=checkbox]),.filters select{padding:9px 10px!important;font-size:.85rem}
}
@media (max-width:640px){
  .filters form{grid-template-columns:1fr 1fr}
  .filters form.open .btn{grid-column:1/-1}
}
@media (max-width:980px){.filters form.open>label.check{display:flex!important;align-items:center;gap:8px;align-self:center;padding-top:18px}}

/* Category: dropdown on mobile instead of chips */
.cat-select{display:none}
@media (max-width:760px){
  .chips-bar .chips{display:none}
  .cat-select{position:relative;display:flex;align-items:center;padding-top:12px;padding-bottom:12px}
  .cat-select label{position:absolute;left:30px;color:var(--gold);pointer-events:none;font-size:1rem}
  .cat-select select{width:100%;appearance:none;-webkit-appearance:none;background:var(--navy)!important;color:#fff!important;border:0!important;border-radius:14px!important;padding:14px 44px 14px 46px!important;font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.03em;box-shadow:0 8px 18px -10px rgba(11,29,51,.5)}
  .cat-select select option{background:#fff;color:var(--ink);text-transform:none}
  .cs-arrow{position:absolute;right:32px;color:var(--gold);pointer-events:none;font-size:.85rem}
}

/* Customer accounts */
.auth-wrap{padding-top:40px}
.auth-card{max-width:480px;margin:0 auto;width:100%}
.two-col .auth-card{max-width:none}
.auth-alt{text-align:center;color:var(--muted);font-size:.9rem}
.acc{padding-top:36px}
.acc-hero{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;background:linear-gradient(140deg,var(--navy-3),var(--navy));color:#fff;border-radius:22px;padding:28px 32px;margin-bottom:26px;position:relative;overflow:hidden}
.acc-hero::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(240,164,58,.35),transparent 70%)}
.acc-hero>i{width:70px;height:70px;border-radius:20px;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-size:1.9rem}
.acc-hero small{color:var(--gold);text-transform:uppercase;letter-spacing:.12em;font-weight:700;font-size:.72rem}
.acc-hero b{display:block;font-family:var(--display);font-weight:400;font-size:2.8rem;line-height:1.05}
.acc-hero b span{font-size:1.3rem;color:var(--gold)}
.acc-hero p{color:#c9d2e0;font-size:.92rem}
.acc-hero .btn{position:relative;z-index:1}
.acc-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:24px}
.acc-grid>div{display:grid;gap:24px;align-content:start}
.gift-card{border:2px dashed #e6cfa6}
.acc-order{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.acc-order:last-child{border:0}
.acc-order small{display:block;color:var(--muted);font-size:.78rem}
.acc-order small.ok{color:var(--green);font-weight:700}
.acc-order .r{text-align:right}
.acc-st{font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--gold-soft);color:#b5651d}
.acc-st.st-delivered{background:#e5f6ec;color:var(--green)}.acc-st.st-cancelled,.acc-st.st-returned{background:#fdecea;color:var(--red)}
.ledger-row{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.ledger-row:last-child{border:0}
.ledger-row span{font-family:var(--display);font-size:1.25rem;text-align:center;border-radius:10px;padding:4px 0}
.ledger-row .plus{background:#e5f6ec;color:var(--green)}.ledger-row .minus{background:#fdecea;color:var(--red)}
.ledger-row b{font-size:.88rem;color:var(--navy);font-weight:600}
.ledger-row small{display:block;color:var(--muted);font-size:.74rem}
.ledger-row em{font-style:normal;font-weight:700;color:var(--navy);font-size:.85rem}
.was{color:var(--muted);font-weight:500;font-size:.8em;margin-left:4px}
.trade-tag,.earn-tag{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;padding:5px 12px;border-radius:999px;margin-top:6px}
.trade-tag{background:var(--navy);color:var(--gold)}
.earn-tag{background:var(--gold-soft);color:#b5651d}
@media (max-width:860px){.acc-hero{grid-template-columns:auto 1fr}.acc-hero .btn{grid-column:1/-1}.acc-grid{grid-template-columns:1fr}}
@media (max-width:560px){.acc-hero{padding:22px 18px}.acc-hero>i{width:54px;height:54px;font-size:1.4rem}.acc-hero b{font-size:2.1rem}}
.pts-banner{display:flex;gap:14px;align-items:center;background:var(--gold-soft);border:1.5px dashed #e0b56a;color:#5a3a10;border-radius:14px;padding:14px 18px;margin-top:24px}
.pts-banner>i{font-size:1.4rem;color:#b5651d}
.pts-banner.shop{background:#e8edf6;border-color:#9fb0cf;color:var(--navy)}.pts-banner.shop>i{color:var(--navy)}
.pts-use b i{color:var(--gold);margin-right:4px}
.earn-line{background:#e5f6ec;color:var(--green);border-radius:10px;padding:10px 12px;font-size:.85rem}
.earn-line b{color:var(--green)}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:12px;font-weight:700;color:var(--ink);transition:.2s}
.gbtn:hover{border-color:#4285f4;box-shadow:0 6px 16px -8px rgba(66,133,244,.5)}
.add-phone{flex-wrap:wrap;margin:0 0 22px}
.add-phone input{flex:1;min-width:160px;max-width:220px}
.add-phone .btn{padding:10px 20px}
