/*
 * AyurBuzz - Bootstrap 5.3 brand theme (shared by the website and the admin panel)
 *
 * The old project used a custom *compiled* Bootstrap 5.0 build (assets/scss/bootstrap.scss).
 * Bootstrap 5.3.8 is now loaded unmodified from the CDN, and the same brand settings are
 * applied here through Bootstrap's CSS variables, so Bootstrap can be upgraded without a Sass build.
 *
 *   $primary #009CFF | $light #F3F6F9 | $dark #191C24 | font Heebo | body colour #757575
 *   $headings-weight 700 | $border-radius 5px | $link-decoration none
 *
 * Load order: bootstrap.min.css -> theme.css -> (admin only) admin.css
 */

:root {
  --bs-primary: #009CFF;
  --bs-primary-rgb: 0, 156, 255;
  --bs-light: #F3F6F9;
  --bs-light-rgb: 243, 246, 249;
  --bs-dark: #191C24;
  --bs-dark-rgb: 25, 28, 36;

  --bs-primary-text-emphasis: #003e66;
  --bs-primary-bg-subtle: #ccebff;
  --bs-primary-border-subtle: #99d7ff;

  --bs-body-font-family: 'Heebo', sans-serif;
  --bs-body-color: #757575;
  --bs-body-color-rgb: 117, 117, 117;
  --bs-body-bg: #F3F6F9;
  --bs-body-bg-rgb: 243, 246, 249;
  --bs-heading-color: #191C24;

  --bs-link-color: #009CFF;
  --bs-link-color-rgb: 0, 156, 255;
  --bs-link-hover-color: #007dcc;
  --bs-link-hover-color-rgb: 0, 125, 204;

  --bs-border-radius: 5px;
  --bs-focus-ring-color: rgba(0, 156, 255, .25);
}

a { text-decoration: none; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 700; }

/* ---- Buttons ---- */
.btn-primary {
  --bs-btn-color: #000000;
  --bs-btn-bg: #009cff;
  --bs-btn-border-color: #009cff;
  --bs-btn-hover-color: #000000;
  --bs-btn-hover-bg: #26abff;
  --bs-btn-hover-border-color: #1aa6ff;
  --bs-btn-focus-shadow-rgb: 0, 133, 217;
  --bs-btn-active-color: #000000;
  --bs-btn-active-bg: #33b0ff;
  --bs-btn-active-border-color: #1aa6ff;
  --bs-btn-disabled-color: #000000;
  --bs-btn-disabled-bg: #009cff;
  --bs-btn-disabled-border-color: #009cff;
}
.btn-light {
  --bs-btn-color: #000000;
  --bs-btn-bg: #f3f6f9;
  --bs-btn-border-color: #f3f6f9;
  --bs-btn-hover-color: #000000;
  --bs-btn-hover-bg: #f5f7fa;
  --bs-btn-hover-border-color: #f4f7fa;
  --bs-btn-focus-shadow-rgb: 207, 209, 212;
  --bs-btn-active-color: #000000;
  --bs-btn-active-bg: #f5f8fa;
  --bs-btn-active-border-color: #f4f7fa;
  --bs-btn-disabled-color: #000000;
  --bs-btn-disabled-bg: #f3f6f9;
  --bs-btn-disabled-border-color: #f3f6f9;
}
.btn-dark {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: #191c24;
  --bs-btn-border-color: #191c24;
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #15181f;
  --bs-btn-hover-border-color: #14161d;
  --bs-btn-focus-shadow-rgb: 60, 62, 69;
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #14161d;
  --bs-btn-active-border-color: #13151b;
  --bs-btn-disabled-color: #ffffff;
  --bs-btn-disabled-bg: #191c24;
  --bs-btn-disabled-border-color: #191c24;
}
.btn-outline-primary {
  --bs-btn-color: #009cff;
  --bs-btn-border-color: #009cff;
  --bs-btn-hover-color: #000000;
  --bs-btn-hover-bg: #009cff;
  --bs-btn-hover-border-color: #009cff;
  --bs-btn-focus-shadow-rgb: 0, 156, 255;
  --bs-btn-active-color: #000000;
  --bs-btn-active-bg: #009cff;
  --bs-btn-active-border-color: #009cff;
  --bs-btn-disabled-color: #009cff;
  --bs-btn-disabled-border-color: #009cff;
}
.btn-outline-dark {
  --bs-btn-color: #191c24;
  --bs-btn-border-color: #191c24;
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #191c24;
  --bs-btn-hover-border-color: #191c24;
  --bs-btn-focus-shadow-rgb: 25, 28, 36;
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #191c24;
  --bs-btn-active-border-color: #191c24;
  --bs-btn-disabled-color: #191c24;
  --bs-btn-disabled-border-color: #191c24;
}

/* ---- Form focus / checked states (Bootstrap 5.3 hard-codes its default blue) ---- */
.form-control:focus,
.form-select:focus {
  border-color: #80ceff;
  box-shadow: 0 0 0 .25rem rgba(0, 156, 255, .25);
}
.form-check-input:focus {
  border-color: #80ceff;
  box-shadow: 0 0 0 .25rem rgba(0, 156, 255, .25);
}
.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
  background-color: #009CFF;
  border-color: #009CFF;
}
.form-range::-webkit-slider-thumb { background-color: #009CFF; }
.form-range::-moz-range-thumb { background-color: #009CFF; }
.form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 .25rem rgba(0, 156, 255, .25); }
.form-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 .25rem rgba(0, 156, 255, .25); }

/* ---- Components that use the primary colour for their "active" state ---- */
.dropdown-menu {
  --bs-dropdown-link-active-bg: #009CFF;
  --bs-dropdown-link-active-color: #000000;
}
.nav-pills {
  --bs-nav-pills-link-active-bg: #009CFF;
  --bs-nav-pills-link-active-color: #000000;
}
.list-group {
  --bs-list-group-active-bg: #009CFF;
  --bs-list-group-active-border-color: #009CFF;
  --bs-list-group-active-color: #000000;
}
.pagination {
  --bs-pagination-active-bg: #009CFF;
  --bs-pagination-active-border-color: #009CFF;
  --bs-pagination-active-color: #000000;
  --bs-pagination-focus-box-shadow: 0 0 0 .25rem rgba(0, 156, 255, .25);
}
.progress,
.progress-stacked { --bs-progress-bar-bg: #009CFF; }
.accordion {
  --bs-accordion-btn-focus-border-color: #80ceff;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(0, 156, 255, .25);
}
.btn-close:focus { box-shadow: 0 0 0 .25rem rgba(0, 156, 255, .25); }

/* =====================================================================
   PUBLIC WEBSITE - Paid courses grid (/courses) + payment confirmation
   ===================================================================== */
.paid-courses{position:relative;overflow:hidden;padding:64px 0 56px;background:
  radial-gradient(1200px 400px at 50% -10%,#eaf4ef 0,rgba(234,244,239,0) 70%),linear-gradient(180deg,#f7fbf9 0,#fff 100%)}
.paid-blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.35;pointer-events:none;animation:pcFloat 14s ease-in-out infinite}
.paid-blob-1{width:320px;height:320px;background:#c99a3e;top:-90px;left:-80px}
.paid-blob-2{width:360px;height:360px;background:#174d3b;bottom:-140px;right:-100px;animation-delay:-6s}
@keyframes pcFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,24px)}}

.paid-head{max-width:720px;margin:0 auto 42px}
.paid-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:50px;font-size:13px;font-weight:700;
  color:#7a5a12;background:#fff6dd;border:1px solid #f0dca2}
.paid-kicker i{color:#e8590c;animation:pcFlame 1.4s ease-in-out infinite}
@keyframes pcFlame{0%,100%{transform:scale(1)}50%{transform:scale(1.25) rotate(-8deg)}}
.paid-title{margin:16px 0 10px;font-family:'Playfair Display',serif;font-weight:700;color:var(--ayur-green,#174d3b);
  font-size:clamp(28px,4.2vw,42px);letter-spacing:.5px}
.paid-sub{color:var(--ayur-text,#53615a);font-size:16px;margin:0}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease var(--d,0ms),transform .6s ease var(--d,0ms)}
.reveal.in{opacity:1;transform:none}

/* card */
.pc-card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:22px;overflow:hidden;
  border:1px solid var(--ayur-border,#dce6e0);box-shadow:0 14px 34px rgba(23,77,59,.09);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.pc-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;opacity:0;transition:opacity .35s;
  background:linear-gradient(120deg,#c99a3e,#174d3b,#c99a3e);background-size:250% 250%;animation:pcBorder 4s linear infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.pc-card:hover{transform:translateY(-10px);box-shadow:0 26px 52px rgba(23,77,59,.20)}
.pc-card:hover::before{opacity:1}
@keyframes pcBorder{to{background-position:250% 50%}}

.pc-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,#174d3b,#2c7a60)}
.pc-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .6s ease}
.pc-card:hover .pc-media img{transform:scale(1.08)}
.pc-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.9);font-size:64px;
  background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.18),transparent 55%),linear-gradient(135deg,#174d3b,#2c7a60)}
.pc-badge{position:absolute;z-index:3;top:12px;right:12px;padding:5px 11px;border-radius:50px;font-size:11px;font-weight:800;
  letter-spacing:1px;color:#5b4210;background:linear-gradient(135deg,#ffe29a,#e0a93a);box-shadow:0 4px 12px rgba(0,0,0,.2)}
.pc-ribbon{position:absolute;z-index:3;top:14px;left:-6px;padding:7px 16px 7px 14px;color:#fff;font-size:13px;font-weight:700;
  background:linear-gradient(135deg,#ef4444,#b91c1c);border-radius:0 8px 8px 0;box-shadow:0 6px 14px rgba(185,28,28,.4);
  animation:pcPulse 1.8s ease-in-out infinite}
.pc-ribbon b{font-size:17px}
.pc-ribbon::before{content:"";position:absolute;left:0;bottom:-6px;border:3px solid transparent;border-top-color:#7f1d1d;border-right-color:#7f1d1d}
@keyframes pcPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}

.pc-body{display:flex;flex-direction:column;flex:1;padding:20px 20px 22px}
.pc-name{font-size:19px;font-weight:700;line-height:1.35;color:var(--ayur-dark,#16231d);margin:0 0 12px;min-height:2.7em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pc-sell{font-size:32px;font-weight:800;color:var(--ayur-green,#174d3b);line-height:1}
.pc-sell-sm{font-size:18px}
.pc-mrp{font-size:17px;color:#9aa5a0;text-decoration:line-through}
.pc-save{display:inline-flex;align-items:center;gap:6px;margin:10px 0 0;padding:5px 12px;border-radius:50px;font-size:13px;font-weight:700;
  color:#0f7a3d;background:#e3f8ec;align-self:flex-start}
.pc-actions{margin-top:auto;padding-top:18px;display:grid;gap:10px}
.pc-quiz{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 18px;border-radius:14px;cursor:pointer;
  font-weight:700;font-size:15px;color:var(--ayur-green,#174d3b);background:#fff;border:2px solid var(--ayur-green,#174d3b);
  transition:background .2s,color .2s,transform .2s}
.pc-quiz b{padding:2px 10px;border-radius:50px;font-size:14px;color:#fff;background:var(--ayur-green,#174d3b);transition:background .2s,color .2s}
.pc-quiz:hover{transform:translateY(-2px);color:#fff;background:var(--ayur-green,#174d3b)}
.pc-quiz:hover b{background:#ffd978;color:#3d2c06}

/* buy button (shimmer) */
.pc-buy{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;
  padding:13px 22px;border:0;border-radius:14px;font-weight:800;font-size:16px;letter-spacing:.3px;color:#3d2c06;cursor:pointer;
  background:linear-gradient(135deg,#ffd978,#e0a93a);box-shadow:0 8px 20px rgba(201,154,62,.45);
  transition:transform .2s ease,box-shadow .2s ease}
.pc-buy::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;transform:skewX(-22deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:pcShine 2.8s ease-in-out infinite}
@keyframes pcShine{0%{left:-70%}60%,100%{left:130%}}
.pc-buy:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(201,154,62,.55);color:#3d2c06}
.pc-buy:active{transform:translateY(0)}
.pc-buy:disabled{opacity:.7;cursor:progress}
.pc-buy-inline{width:auto;padding:12px 26px}

/* modal */
.buy-modal .modal-content{border:0;border-radius:20px;overflow:hidden}
.buy-modal-head{align-items:flex-start;color:#fff;border:0;background:linear-gradient(135deg,#174d3b,#2c7a60)}
.buy-modal-head .modal-title{font-weight:800}
.buy-course-line{margin-top:4px;font-size:14px;color:rgba(255,255,255,.88)}
.buy-course-line b{margin-left:6px;padding:2px 10px;border-radius:50px;color:#3d2c06;background:#ffd978}
.buy-modal .form-label{font-size:13px;font-weight:700;color:#34433c;margin-bottom:4px}
.buy-modal .form-control:focus,.buy-modal .form-select:focus{border-color:#174d3b;box-shadow:0 0 0 .2rem rgba(23,77,59,.15)}
.buy-modal-foot{border:0;background:#f7fbf9}
.buy-plan-tag:not(:empty){margin-left:6px;padding:2px 10px;border-radius:50px;font-size:12px;font-weight:700;color:#fff;background:rgba(255,255,255,.22)}
.buy-modal .req{color:#dc3545;font-weight:800}
.buy-hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}

/* payment confirmation page */
.confirm-wrap{max-width:760px}
.confirm-card{background:#fff;border-radius:24px;overflow:hidden;border:1px solid var(--ayur-border,#dce6e0);box-shadow:0 24px 54px rgba(23,77,59,.14)}
.confirm-top{text-align:center;padding:36px 24px 28px;color:#fff;background:linear-gradient(135deg,#174d3b,#2c7a60)}
.confirm-check{width:84px;height:84px;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.cc-ring{stroke-dasharray:145;stroke-dashoffset:145;animation:ccDraw .8s ease forwards}
.cc-tick{stroke-dasharray:40;stroke-dashoffset:40;animation:ccDraw .5s ease .7s forwards}
@keyframes ccDraw{to{stroke-dashoffset:0}}
.confirm-title{margin:12px 0 6px;font-size:28px;font-weight:800;color:#fff}
.confirm-sub{margin:0 0 14px;color:rgba(255,255,255,.9)}
.confirm-status{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:50px;font-size:13px;font-weight:800;color:#5b4210;background:#ffd978}
.confirm-status.paid{color:#0b5b30;background:#bff0d3}
.confirm-body{padding:28px 26px 32px}
.confirm-amount{text-align:center;margin-bottom:22px}
.confirm-amount small{display:block;color:#7b8780;font-weight:600}
.confirm-amount strong{font-size:40px;color:var(--ayur-green,#174d3b);margin-right:8px}
.confirm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;margin:0 0 18px}
.confirm-grid dt{font-size:12px;text-transform:uppercase;letter-spacing:.8px;color:#7b8780;font-weight:700}
.confirm-grid dd{margin:2px 0 0;color:var(--ayur-dark,#16231d);word-break:break-word}
.confirm-note{display:flex;gap:10px;padding:12px 14px;margin-top:10px;border-radius:12px;font-size:14px;background:#fff8e6;border:1px solid #f0dca2;color:#6b5314}
.confirm-note.ok{background:#e9f8f0;border-color:#bfe8d1;color:#14633a}
.confirm-note i{margin-top:3px}
@media (max-width:575px){.confirm-grid{grid-template-columns:1fr}.paid-courses{padding:46px 0 40px}}

@media (prefers-reduced-motion:reduce){
  .paid-blob,.paid-kicker i,.pc-ribbon,.pc-buy::after,.pc-card::before,.cc-ring,.cc-tick{animation:none!important}
  .cc-ring,.cc-tick{stroke-dashoffset:0}
  .reveal{opacity:1;transform:none;transition:none}
  .pc-card,.pc-media img{transition:none}
}
