/* ==========================================================================
   Calm the Moment - theme override for Academy LMS
   Loaded last in includes_top.php, after style.css / new-style.css / custom.css.

   Strategy: Academy's style.css is custom-property driven. It defines a light
   palette on :root and redefines the same properties on .dark-theme. This file
   recolours those properties to the Calm the Moment palette and applies them to
   :root unconditionally, so the dark treatment is the only treatment and does
   not depend on the session theme_mode toggle.

   Variable roles are taken from Academy's own .dark-theme block at
   assets/frontend/default-new/css/style.css line 234, so each property keeps
   the role Creativeitem assigned it.
   ========================================================================== */

/* --- brand tokens ------------------------------------------------------- */
:root{
  --ctm-bg:#0F1E1C;
  --ctm-bg-soft:#162A27;
  --ctm-card:#1C332F;
  --ctm-ink:#EAF2EF;
  --ctm-muted:#9DB5AE;
  --ctm-line:#2A443F;
  --ctm-glow:#8FD6C4;
  --ctm-glow-deep:#5FB8A3;
  --ctm-on-glow:#0C1917;
}

/* --- remap Academy palette properties ---------------------------------- */
:root,
.dark-theme,
.home_1st,
.home_2nd,
.home_3rd{
  --primary-color:var(--ctm-ink);
  --primary-color-2:var(--ctm-muted);
  --secondery-color:var(--ctm-bg);
  --bg-white:var(--ctm-bg);
  --bg-white-2:var(--ctm-bg-soft);
  --bg-white-3:var(--ctm-ink);
  --bg-white-4:var(--ctm-card);
  --bg-white-5:var(--ctm-card);
  --bg-white-6:var(--ctm-bg-soft);
  --bg-white-7:var(--ctm-bg);
  --color-1:var(--ctm-ink);
  --color-2:var(--ctm-bg);
  --color-3:var(--ctm-ink);
  --color-4:var(--ctm-glow);
  --color-5:var(--ctm-ink);
  --color-6:var(--ctm-ink);
  --color-7:var(--ctm-bg-soft);
  --color-8:var(--ctm-ink);
  --color-9:var(--ctm-ink);
  --color-10:var(--ctm-line);
  --color-11:var(--ctm-line);
  --color-12:var(--ctm-line);
  --color-13:var(--ctm-ink);
  --color-14:var(--ctm-ink);
  --color-15:rgba(143,214,196,.42);
  --color-16:var(--ctm-ink);
  --color-17:var(--ctm-glow);
  --hover-color:var(--ctm-bg-soft);
  --hover-color-2:var(--ctm-bg-soft);
  --border-color:var(--ctm-line);
  --color-linear:var(--ctm-bg);
  --box-shadow:none;
}

/* --- typography -------------------------------------------------------- */
body,
button, input, select, textarea,
.btn, .nav-link, .form-control{
  font-family:'Karla',system-ui,-apple-system,sans-serif !important;
}

h1,h2,h3,h4,h5,h6,
.section-title, .course-title, .single-course-title{
  font-family:'Newsreader',Georgia,serif !important;
  font-weight:500 !important;
  letter-spacing:-.015em;
  line-height:1.18;
}

body{
  background:var(--ctm-bg);
  color:var(--ctm-ink);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

/* --- surfaces ---------------------------------------------------------- */
.card, .single-course, .course-card, .widget, .panel, .modal-content{
  background:var(--ctm-card) !important;
  border:1px solid var(--ctm-line) !important;
  border-radius:16px !important;
  box-shadow:none !important;
}

header, .header, .navbar, footer, .footer{
  background:var(--ctm-card) !important;
  border-color:var(--ctm-line) !important;
}

hr, .divider{border-color:var(--ctm-line) !important;}

/* --- controls ---------------------------------------------------------- */
.btn-primary, .btn.btn-primary, .theme-btn, .eBtn{
  background:var(--ctm-glow) !important;
  border-color:var(--ctm-glow) !important;
  color:var(--ctm-on-glow) !important;
  border-radius:12px !important;
  font-weight:700;
}
.btn-primary:hover, .theme-btn:hover, .eBtn:hover{
  background:#A8E2D2 !important;
  border-color:#A8E2D2 !important;
}

.btn-outline-primary, .btn-secondary{
  background:transparent !important;
  border:1px solid var(--ctm-line) !important;
  color:var(--ctm-glow) !important;
  border-radius:12px !important;
}
.btn-outline-primary:hover, .btn-secondary:hover{background:var(--ctm-card) !important;}

.form-control, .form-select, input[type=text], input[type=email],
input[type=password], input[type=search], textarea, select{
  background:var(--ctm-bg-soft) !important;
  border:1.5px solid var(--ctm-line) !important;
  color:var(--ctm-ink) !important;
  border-radius:12px !important;
}
.form-control:focus, .form-select:focus, textarea:focus, select:focus{
  border-color:var(--ctm-glow) !important;
  box-shadow:none !important;
  outline:2px solid var(--ctm-glow);
  outline-offset:1px;
}
::placeholder{color:#6E8A82 !important;}

a{color:var(--ctm-glow);}
a:hover{color:#A8E2D2;}

.badge, .pill, .tag{
  background:transparent !important;
  border:1px solid var(--ctm-line) !important;
  color:var(--ctm-glow) !important;
  border-radius:999px !important;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:.78rem;
}

/* --- kicker ------------------------------------------------------------ */
.ctm-kicker{
  font-size:.8rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ctm-glow);
}

/* --- breathing orb ----------------------------------------------------- */
.ctm-orb{
  width:120px;height:120px;border-radius:50%;flex:none;
  background:radial-gradient(circle at 38% 35%,
    var(--ctm-glow) 0%, var(--ctm-glow-deep) 55%, #3E8A77 100%);
  box-shadow:0 0 60px rgba(143,214,196,.35), 0 0 120px rgba(143,214,196,.15);
}
.ctm-orb--sm{width:28px;height:28px;box-shadow:0 0 18px rgba(143,214,196,.4);}
.ctm-orb--md{width:52px;height:52px;box-shadow:0 0 26px rgba(143,214,196,.4);}

/* 4 seconds in, 6 seconds out, matching the course's own breathing pace */
@media (prefers-reduced-motion:no-preference){
  .ctm-orb--breathing{animation:ctm-breathe 10s ease-in-out infinite;}
  @keyframes ctm-breathe{
    0%{transform:scale(.82);}
    40%{transform:scale(1.08);}
    100%{transform:scale(.82);}
  }
}

/* --- quiet progress, replaces percentage bars -------------------------- */
.ctm-progress{display:flex;gap:8px;align-items:center;}
.ctm-progress i{
  width:9px;height:9px;border-radius:50%;
  background:var(--ctm-line);display:inline-block;
}
.ctm-progress i.on{background:var(--ctm-glow);}
.ctm-progress span{margin-left:8px;font-size:.88rem;color:var(--ctm-muted);}

/* Academy renders course progress as a striped bar. Calm it down. */
.progress{background:var(--ctm-line) !important;border-radius:999px !important;height:4px !important;}
.progress-bar{background:var(--ctm-glow) !important;}

/* --- media players ----------------------------------------------------- */
/* Lessons are audio and video, so both players sit on the card surface. */
.plyr, .video-wrapper, .audio-wrapper, .lesson-player{
  background:var(--ctm-card);
  border:1px solid var(--ctm-line);
  border-radius:16px;
  overflow:hidden;
}
.plyr{--plyr-color-main:var(--ctm-glow);}
audio{width:100%;}

/* --- suppress marketplace furniture ------------------------------------ */
/* Single-course product: these surfaces should not be reachable. Hiding them
   here is a visual backstop only. Removing them from navigation is
   configuration work, tracked separately in the spec. */
.become-instructor, .instructor-list, .top-instructor,
.blog-section, .newsletter-section{display:none !important;}