/* =====================================================================
   KidPreneur Market theme — an Amazon-style shell (navy header, orange
   accents, dense product grid, search-first navigation) with a few warm,
   kid-safe touches layered on top (guardian notes, featured ribbons,
   wishlist hearts). Built on Bootstrap 5. All fonts are local (offline).
   Display: Baloo 2 (brand logotype + section headers)
   Body:    Nunito (dense, legible — stands in for Amazon's Ember)
   ===================================================================== */

/* ---------- Offline fonts ---------- */
@font-face{font-family:'Baloo 2';font-weight:600;font-display:swap;
  src:url('../vendor/fonts/baloo2/baloo-2-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Baloo 2';font-weight:700;font-display:swap;
  src:url('../vendor/fonts/baloo2/baloo-2-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Baloo 2';font-weight:800;font-display:swap;
  src:url('../vendor/fonts/baloo2/baloo-2-latin-800-normal.woff2') format('woff2');}
@font-face{font-family:'Nunito';font-weight:400;font-display:swap;
  src:url('../vendor/fonts/nunito/nunito-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Nunito';font-weight:600;font-display:swap;
  src:url('../vendor/fonts/nunito/nunito-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Nunito';font-weight:700;font-display:swap;
  src:url('../vendor/fonts/nunito/nunito-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Nunito';font-weight:800;font-display:swap;
  src:url('../vendor/fonts/nunito/nunito-latin-800-normal.woff2') format('woff2');}

/* ---------- Design tokens ---------- */
:root{
  /* Amazon-style shell */
  --navy:#131921;         --navy-2:#232f3e;      --navy-3:#37475a;
  --orange:#ff9900;       --orange-dark:#e88a00;
  --yellow:#ffd814;       --yellow-dark:#f7ca00;
  --page-bg:#eaeded;
  --star:#ffa41c;

  /* Kid-safe accent palette (used sparingly: wishlist, featured, guardian notes) */
  --coral:#ff6b54;       --coral-dark:#e8513a;
  --teal:#1fb6a6;        --teal-dark:#159083;
  --sun:#ffc24b;

  --ink:#0f1111;         --muted:#565959;
  --cream:#fff8f1;       --card:#ffffff;
  --line:#d5d9d9;
  --shadow:0 10px 30px -12px rgba(15,17,17,.22);
  --shadow-sm:0 2px 8px -2px rgba(15,17,17,.16);
  --radius:10px;
  --bs-body-font-family:'Nunito',system-ui,sans-serif;
}

*{font-feature-settings:"ss01";}
body{
  font-family:'Nunito',system-ui,sans-serif;
  color:var(--ink);
  background:var(--page-bg);
  min-height:100vh;
}
h1,h2,h3,.display-font,.navbar-brand,.brand{
  font-family:'Baloo 2',cursive;font-weight:800;letter-spacing:-.01em;
}
h4,h5,h6{font-family:'Nunito',system-ui,sans-serif;font-weight:800;}
a{color:var(--navy-2);text-decoration:none;}
a:hover{color:var(--orange-dark);}

/* ---------- Buttons ---------- */
.btn{border-radius:8px;font-weight:700;padding:.55rem 1.25rem;border:1px solid transparent;}
/* Primary = Amazon's "Add to Cart" yellow */
.btn-primary{background:var(--yellow);border-color:#fcd200;color:#0f1111!important;}
.btn-primary:hover,.btn-primary:focus{background:var(--yellow-dark);border-color:#f2c200;color:#0f1111!important;}
/* Strong CTA = Amazon orange ("Buy Now" style) */
.btn-orange{background:var(--orange);border-color:var(--orange-dark);color:#fff;}
.btn-orange:hover{background:var(--orange-dark);color:#fff;}
.btn-teal{background:var(--teal);color:#fff;border-color:var(--teal-dark);}
.btn-teal:hover{background:var(--teal-dark);color:#fff;}
.btn-outline-light-soft{background:#fff;color:var(--ink);box-shadow:var(--shadow-sm);border-color:var(--line);}
.btn-outline-light-soft:hover{background:#f4f4f4;}
.btn-sm{padding:.35rem .85rem;}

/* ---------- Top navbar (Amazon-style, dark navy) ---------- */
.navbar{background:var(--navy)!important;padding:.55rem 0;}
.navbar-brand{font-size:1.5rem;color:#fff!important;line-height:1;}
.brand-logo{height:40px;width:auto;max-width:220px;object-fit:contain;display:block;}
.brand-logo-footer{height:28px;max-width:180px;}
.navbar-brand .dot{color:var(--orange);}
.navbar-brand .tag{display:block;font-family:'Nunito';font-weight:700;font-size:.62rem;color:#c8cdd3;letter-spacing:.03em;margin-top:-2px;}

/* Search bar, sits between logo and account icons on lg+ */
.amz-search{flex:1 1 auto;display:flex;max-width:720px;margin:0 1rem;border-radius:6px;overflow:hidden;background:#fff;}
.amz-search select{border:none;background:#f0f2f2;color:var(--ink);font-size:.82rem;padding:0 .5rem;max-width:130px;border-right:1px solid var(--line);}
.amz-search input[type=text]{border:none;flex:1;padding:.5rem .7rem;font-size:.95rem;min-width:0;}
.amz-search input[type=text]:focus,.amz-search select:focus{outline:none;box-shadow:none;}
.amz-search button{border:none;background:var(--orange);color:var(--navy);padding:0 1rem;font-weight:800;}
.amz-search button:hover{background:var(--orange-dark);color:#fff;}

.navbar .nav-link{font-weight:700;color:#fff!important;border-radius:6px;padding:.4rem .7rem!important;border:1px solid transparent;line-height:1.15;}
.navbar .nav-link small{display:block;font-weight:600;color:#c8cdd3;font-size:.68rem;}
.navbar .nav-link:hover,.navbar .nav-link.active{border-color:#fff;}
.cart-pill{background:var(--orange);color:var(--navy);border-radius:999px;font-size:.7rem;font-weight:800;padding:.05rem .4rem;margin-left:.2rem;}
.navbar .dropdown-menu{border-radius:10px;}

/* Secondary strip: category links (Amazon's dark sub-nav) */
.subnav{background:var(--navy-2);}
.subnav .scroller{display:flex;gap:.15rem;overflow-x:auto;scrollbar-width:none;white-space:nowrap;padding:.4rem 0;}
.subnav .scroller::-webkit-scrollbar{display:none;}
.subnav a{color:#fff;font-weight:700;font-size:.85rem;padding:.35rem .7rem;border-radius:6px;flex:0 0 auto;}
.subnav a:hover,.subnav a.active{background:var(--navy-3);color:#fff;}

/* ---------- Cards ---------- */
.card{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-sm);
  transition:box-shadow .15s ease;}
.product-card{border-radius:8px;}
.product-card:hover{box-shadow:var(--shadow);}
.product-thumb{aspect-ratio:1/1;object-fit:cover;width:100%;border-radius:8px 8px 0 0;background:#f4f4f4;}
.product-thumb.placeholder-thumb{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.product-thumb.placeholder-thumb::before{content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.5) 1.5px,transparent 1.5px);
  background-size:18px 18px;opacity:.5;}
.ph-badge{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;
  width:38%;aspect-ratio:1/1;max-width:104px;min-width:52px;border-radius:999px;
  background:rgba(255,255,255,.8);box-shadow:0 10px 22px -10px rgba(15,17,17,.35);
  font-size:clamp(1.5rem,7vw,2.5rem);}
.ph-handmade-crafts{background:linear-gradient(135deg,#ffd8c2,#ff9a5c);}
.ph-toys-games{background:linear-gradient(135deg,#c7e8ff,#5aa9ea);}
.ph-books-stationery{background:linear-gradient(135deg,#dcefc6,#7cba57);}
.ph-art-drawing{background:linear-gradient(135deg,#ffd3ec,#ef6cb4);}
.ph-other{background:linear-gradient(135deg,#e6d9ff,#9c7ff0);}
.rounded-thumb{border-radius:14px!important;}
.price-tag{font-family:'Baloo 2';font-weight:800;color:var(--ink);}
.badge-soft{background:#eef3f3;color:var(--navy-2);border-radius:4px;font-weight:700;padding:.3rem .6rem;}

/* Amazon-style split price: big whole number, small currency + cents */
.amz-price{font-family:'Baloo 2';color:var(--ink);white-space:nowrap;}
.amz-price-cur{font-size:.65em;vertical-align:top;font-weight:700;margin-right:.1em;position:relative;top:.35em;}
.amz-price-whole{font-size:1.35em;font-weight:800;}
.amz-price-frac{font-size:.65em;vertical-align:top;font-weight:700;position:relative;top:.1em;}
.amz-price-lg .amz-price-whole{font-size:1.9em;}

/* ---------- Status chips ---------- */
.chip{border-radius:999px;font-weight:700;font-size:.72rem;padding:.22rem .65rem;display:inline-block;}
.chip-pending{background:#fff3d6;color:#a9760a;}
.chip-approved{background:#e6f4ea;color:#0a7a2f;}
.chip-rejected{background:#fdeceb;color:#c23a26;}
.chip-active{background:#e6f4ea;color:#0a7a2f;}
.chip-suspended{background:#fdeceb;color:#c23a26;}
.chip-paid{background:#e6f4ea;color:#0a7a2f;}
.chip-processing{background:#e7f0ff;color:#1c5fc4;}
.chip-shipped{background:#efe7ff;color:#6b3fc4;}
.chip-refunded{background:#eceff1;color:#55606b;}
.chip-proof_submitted{background:#e7f0ff;color:#1c5fc4;}

/* Order fulfillment stepper (order.php) */
.order-steps{display:flex;gap:.5rem;flex-wrap:wrap;}
.order-steps .step{flex:1;min-width:110px;text-align:center;padding:.55rem .5rem;border-radius:8px;background:#f4f4f4;color:var(--muted);font-weight:700;font-size:.78rem;}
.order-steps .step.done{background:#e6f4ea;color:#0a7a2f;}
.order-steps .step.current{background:var(--orange);color:#fff;}

/* ---------- Hero / deal banner ---------- */
.hero{background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 100%);border-radius:14px;
  box-shadow:var(--shadow);overflow:hidden;position:relative;color:#fff;}
.hero::after{content:"";position:absolute;right:-60px;top:-60px;width:260px;height:260px;
  background:radial-gradient(circle,var(--orange),transparent 70%);opacity:.35;}
.hero h1{font-size:clamp(1.7rem,4.5vw,2.8rem);line-height:1.1;color:#fff;}
.hero .lead{color:#dfe3e6;font-weight:600;}
.hero .badge-soft{background:rgba(255,153,0,.18);color:var(--orange);}

/* Category strip on homepage (Amazon-style square tiles) */
.cat-tile{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1.1rem 1rem;text-align:center;
  color:var(--ink);font-weight:800;display:block;height:100%;}
.cat-tile:hover{box-shadow:var(--shadow);color:var(--ink);transform:translateY(-2px);}
.cat-tile .ic{width:52px;height:52px;border-radius:999px;display:flex;align-items:center;justify-content:center;
  font-size:1.6rem;margin:0 auto .55rem;box-shadow:0 6px 16px -8px rgba(15,17,17,.3);}

/* Hero badge collage (replaces a single oversized emoji) */
.hero-collage{position:relative;height:280px;}
.hero-collage .hb{position:absolute;display:flex;align-items:center;justify-content:center;
  border-radius:999px;box-shadow:0 16px 32px -12px rgba(0,0,0,.4);}
.hero-collage .hb-1{width:150px;height:150px;font-size:4.2rem;right:36px;top:6px;}
.hero-collage .hb-2{width:84px;height:84px;font-size:2.3rem;right:196px;top:56px;}
.hero-collage .hb-3{width:96px;height:96px;font-size:2.6rem;right:6px;top:172px;}
.hero-collage .hb-4{width:64px;height:64px;font-size:1.7rem;right:158px;top:194px;}

/* ---------- Forms ---------- */
.form-control,.form-select{border-radius:8px;border:1.5px solid var(--line);padding:.6rem .85rem;}
.form-control:focus,.form-select:focus{border-color:var(--orange);box-shadow:0 0 0 .2rem rgba(255,153,0,.18);}
.form-label{font-weight:700;color:var(--ink);}
.auth-card{max-width:460px;margin:0 auto;}
.auth-card.auth-card-wide{max-width:680px;}

/* ---------- Dashboard layout ---------- */
.dash-wrap{display:grid;grid-template-columns:248px 1fr;gap:1.5rem;}
.sidebar{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1rem;position:sticky;top:90px;height:fit-content;}
.sidebar a{display:flex;align-items:center;gap:.6rem;padding:.65rem .85rem;border-radius:8px;color:var(--muted);font-weight:700;margin-bottom:.2rem;}
.sidebar a:hover{background:#f4f4f4;color:var(--ink);}
.sidebar a.active{background:var(--navy);color:#fff;}
.stat-card{border-radius:var(--radius);padding:1.2rem 1.3rem;color:#fff;box-shadow:var(--shadow-sm);}
.stat-card .n{font-family:'Baloo 2';font-weight:800;font-size:1.8rem;line-height:1;}
.stat-card .l{opacity:.92;font-weight:700;font-size:.85rem;}
.bg-coral{background:linear-gradient(135deg,#ff8a6f,#ff6b54);}
.bg-teal2{background:linear-gradient(135deg,#3fd0c0,#1fb6a6);}
.bg-sun{background:linear-gradient(135deg,#ffd277,#ffb52e);color:#5a3d00!important;}
.bg-ink{background:linear-gradient(135deg,var(--navy-3),var(--navy));}
table.table{--bs-table-bg:transparent;}
.table thead th{font-weight:800;color:var(--muted);border-bottom:2px solid var(--line);}
.table td{vertical-align:middle;}
.tablecard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.1rem 1.25rem;}

/* ---------- Safety / guardian note ---------- */
.guardian-note{background:#fff7ee;border:1.5px dashed var(--sun);border-radius:10px;padding:.85rem 1rem;color:#8a6400;font-weight:600;}

/* ---------- Breadcrumb ---------- */
.breadcrumb{font-size:.85rem;background:transparent;padding:0;margin-bottom:.75rem;}
.breadcrumb-item+.breadcrumb-item::before{color:var(--muted);}
.breadcrumb-item a{color:var(--navy-2);font-weight:700;}
.breadcrumb-item.active{color:var(--muted);}

/* ---------- Stock urgency ---------- */
.stock-low{color:#c23a26;font-weight:800;}

/* ---------- Footer (Amazon-style, dark, multi-column) ---------- */
.back-to-top{background:var(--navy-3);color:#fff;text-align:center;padding:.85rem;font-weight:700;cursor:pointer;border:none;width:100%;}
.back-to-top:hover{background:#425369;}
footer.site{background:var(--navy);color:#d7dade;margin-top:2.5rem;}
footer.site .foot-cols{background:var(--navy);padding:2.5rem 0 1.5rem;}
footer.site h6{color:#fff;font-weight:800;font-size:.9rem;margin-bottom:.9rem;}
footer.site a{color:#d7dade;display:block;font-size:.85rem;margin-bottom:.5rem;}
footer.site a:hover{color:#fff;text-decoration:underline;}
footer.site .bottom{background:var(--navy-2);padding:1.1rem 0;font-size:.8rem;color:#c8cdd3;}
footer.site .brand{font-family:'Baloo 2';font-weight:800;color:#fff;font-size:1.3rem;}

/* ---------- Page load animation ---------- */
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.rise{animation:rise .5s ease both;}
.rise-2{animation:rise .5s ease .08s both;}
.rise-3{animation:rise .5s ease .16s both;}

/* ---------- Mobile ---------- */
@media (max-width:991px){
  .dash-wrap{grid-template-columns:1fr;}
  .sidebar{position:static;display:flex;flex-wrap:wrap;gap:.4rem;}
  .sidebar a{margin:0;flex:1 1 auto;justify-content:center;}
  .amz-search{order:3;margin:.6rem 0 0;max-width:none;width:100%;flex:1 1 100%;}
}
@media (max-width:575px){
  .amz-search select{display:none;}
  footer.site .foot-cols .col-6{margin-bottom:1rem;}
}

/* =====================================================================
   v2 features — wishlist, featured, reviews, notifications, pagination
   ===================================================================== */

/* ---------- Wishlist heart (on product cards) ---------- */
.wish-btn{position:absolute;top:.5rem;right:.5rem;z-index:3;margin:0;}
.heart{border:none;background:rgba(255,255,255,.92);box-shadow:var(--shadow-sm);
  width:34px;height:34px;border-radius:999px;font-size:1.05rem;line-height:1;color:#cdbfc0;
  cursor:pointer;transition:transform .15s ease,color .15s ease;}
.heart:hover{transform:scale(1.12);color:var(--coral);}
.heart.active{color:var(--coral);}

/* ---------- Featured ribbon ---------- */
.featured-tag{position:absolute;top:.5rem;left:.5rem;z-index:3;background:var(--sun);
  color:#5a3d00;font-weight:800;font-size:.7rem;border-radius:999px;padding:.2rem .6rem;
  box-shadow:var(--shadow-sm);}

/* ---------- Interactive star rating input ---------- */
.star-input{display:inline-flex;flex-direction:row-reverse;gap:.15rem;font-size:1.7rem;}
.star-input input{display:none;}
.star-input label{color:#e2d7cf;cursor:pointer;transition:color .12s ease;line-height:1;}
.star-input label:hover,
.star-input label:hover ~ label,
.star-input input:checked ~ label{color:var(--star);}

/* ---------- Reviews ---------- */
.review-form{background:#f7f8f8;border-radius:10px;padding:1rem 1.1rem;}
.review-item{border-top:1px solid var(--line);padding:.85rem 0;}
.review-item:first-of-type{border-top:none;}
.text-warning{color:var(--star)!important;letter-spacing:1px;}

/* ---------- Notifications inbox ---------- */
.notif-row{border-bottom:1px solid var(--line);}
.notif-row:last-child{border-bottom:none;}
.notif-row a{transition:background .12s ease;}
.notif-row a:hover{background:#f4f4f4;}
.notif-row.unread a{background:#fff7ee;font-weight:700;}
.notif-dot{display:inline-block;width:8px;height:8px;border-radius:999px;background:var(--orange);
  margin-right:.5rem;vertical-align:middle;}

/* ---------- Pagination ---------- */
.pagination{gap:.3rem;}
.page-link{border:1px solid var(--line);border-radius:6px!important;color:var(--ink);font-weight:700;
  box-shadow:none;}
.page-item.active .page-link{background:var(--navy);border-color:var(--navy);color:#fff;}
.page-link:hover{background:#f4f4f4;color:var(--ink);}
.page-item.disabled .page-link{opacity:.45;box-shadow:none;}

/* ---------- Tab pills (payments etc.) ---------- */
.nav-pills .nav-link{background:#fff;color:var(--muted);font-weight:700;box-shadow:var(--shadow-sm);border:1px solid var(--line);border-radius:999px;}
.nav-pills .nav-link.active{background:var(--navy);color:#fff;border-color:var(--navy);}

/* =====================================================================
   v3 features — shop directory, discounts, shop analytics, announcement
   banner, ads
   ===================================================================== */

/* ---------- Site-wide announcement banner ---------- */
.site-announcement{background:var(--orange);color:#1a1200;font-weight:700;padding:.6rem 0;font-size:.9rem;text-align:center;}
.site-announcement .announcement-close{background:none;border:none;color:inherit;font-weight:800;opacity:.7;cursor:pointer;padding:0 .2rem;}
.site-announcement .announcement-close:hover{opacity:1;}

/* ---------- Discount pricing ---------- */
.discount-price-wrap{display:inline-flex;align-items:center;gap:.4rem;flex-wrap:wrap;}
.discount-was{color:var(--muted);font-weight:700;font-size:.85em;}
.discount-badge{background:var(--coral);color:#fff;font-weight:800;font-size:.72rem;border-radius:6px;padding:.15rem .45rem;}

/* ---------- Advertisements ---------- */
.ad-slot{position:relative;margin-bottom:1.5rem;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);}
.ad-slot img{width:100%;height:auto;display:block;}
.ad-label{position:absolute;top:.5rem;left:.5rem;z-index:2;background:rgba(15,17,17,.75);color:#fff;
  font-size:.65rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:.2rem .55rem;}
.ad-top img{aspect-ratio:4/1;object-fit:cover;}
.ad-middle img{aspect-ratio:3/1;object-fit:cover;}
.ad-left img,.ad-right img{aspect-ratio:1/2;object-fit:cover;}
.ad-rail{position:sticky;top:100px;}
