/* ==========================================================================
   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);
  /* Academy's own dark theme sets this light, which produces a white dropdown
     panel on .menu_pro_wish. Kept dark deliberately. */
  --bg-white-3:var(--ctm-card);
  --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%;}

/* ==========================================================================
   MEMBERS AREA MODE
   app.relationshipanxiety.net is a delivery platform, not a shopfront. Selling
   happens on relationshipanxiety.net. Everything below strips the marketplace
   furniture Academy ships and fixes the contrast failures that surfaced once
   the palette went dark. Class names verified against the live DOM.
   ========================================================================== */

/* --- logo sizing -------------------------------------------------------
   Academy sets .logo img to 36px in style.css and responsive.css trims it
   further. With the marketplace nav stripped out there is plenty of room, so
   the wordmark is given real presence. */
.logo img, .navbar-brand.logo img{
  height:46px !important;
  width:auto !important;
  max-width:none !important;
}
@media (max-width:767px){
  .logo img, .navbar-brand.logo img{height:34px !important;}
}

/* --- remove the marketing chrome --------------------------------------- */
/* Top bar: placeholder phone, email, social icons, language picker */
.sub-header{display:none !important;}

/* Search, cart and the Join Now call to action */
.search-container, .header-search, .mobile-search,
.m-search-icon, .search-btn, .search-menu-icon,
.menu_pro_cart_tgl, .ctBtn,
.has-sub-category{display:none !important;}

/* Mobile hamburger. The nav it opens is entirely hidden in members area mode,
   so the toggle has nothing to reveal. It was also rendering in Academy's
   purple. */
.btn-bar{display:none !important;}

/* Footer link farm: top categories, useful links, newsletter signup.
   footer.php is also replaced with a minimal version, so these are a backstop. */
.ft2-nav-wrap, .ft2-subscribe-wrap, .ft2-logo-area{display:none !important;}
.ft2-border-bottom{border-bottom:0 !important;}

/* Courses / category dropdown in the logged out header. A members area has
   nothing to browse before signing in. */
.main-nav-wrap{display:none !important;}

/* This dropdown panel hardcodes a light background rather than reading the
   custom property, so it needs an explicit override. */
.menu_pro_wish{
  background:var(--ctm-card) !important;
  border:1px solid var(--ctm-line) !important;
}

/* --- minimal footer ---------------------------------------------------- */
.ctm-footer{padding:28px 0;background:var(--ctm-card) !important;}
.ctm-footer .ft2-bottom-content{
  display:flex;flex-wrap:wrap;gap:16px;
  align-items:center;justify-content:space-between;
}
.ctm-footer .ft2-copyright-info{margin:0;color:var(--ctm-muted);font-size:.86rem;}
.ctm-footer .ft2-copyright-nav-group{
  display:flex;gap:20px;list-style:none;margin:0;padding:0;
}
.ctm-footer .ft2-copyright-nav-link{color:var(--ctm-muted);font-size:.86rem;text-decoration:none;}
.ctm-footer .ft2-copyright-nav-link:hover{color:var(--ctm-glow);}

/* Marketing homepage sections, in case any remain reachable */
.lms-hero-section2, .why-choose-section1{
  background-image:none !important;
  background:var(--ctm-bg) !important;
}
.hero2-iconbox1-rounded{
  background:linear-gradient(90deg, rgba(143,214,196,.10) 0%, rgba(95,184,163,.16) 100%) !important;
}

/* --- fix contrast failures --------------------------------------------- */
/* These carry hardcoded colours rather than reading the custom properties,
   so they stayed dark-on-dark when the palette flipped. Measured at 1.03:1
   to 1.31:1 before this block. */
.title-9, .subtitle-9, .hero2-iconbox-title,
.title, .counter, .info,
.ft2-title{color:var(--ctm-ink) !important;}

.subtitle-9, .info, .ft2-short-des{color:var(--ctm-muted) !important;}

.text-muted{color:var(--ctm-muted) !important;}

.another p, .another a, .another h5{color:var(--ctm-muted) !important;}
.another a{color:var(--ctm-glow) !important;}

/* Academy renders the page title with a coloured exclamation span */
.sing-up-right h3 span{color:var(--ctm-glow) !important;}

/* --- cookie notice ---------------------------------------------------- */
#cookieConsentContainer, .cookieConsentContainer{
  background:var(--ctm-card) !important;
  border:1px solid var(--ctm-line) !important;
  border-radius:16px !important;
  color:var(--ctm-ink) !important;
}
.cookieConsentContainer .cookieButton{background:transparent !important;}
.cookieConsentContainer .cookieButton a{
  display:inline-block;
  background:var(--ctm-glow) !important;
  color:var(--ctm-on-glow) !important;
  border-radius:12px !important;
  padding:9px 22px !important;
  font-size:.9rem;font-weight:700;
  width:auto !important;
}
.link-cookie-policy{color:var(--ctm-glow) !important;}

/* The notice is position:fixed at the viewport bottom, so on a short screen it
   covered the Log in button. Measured at 390px wide: banner occupied y 657-844
   while the button sat at y 713-763. Compacted here, and .ctm-signin below
   reserves clearance so the primary action is never underneath it. */
/* Measured at 390x844: the button sits at y 671-721 and the notice is pinned
   12px from the bottom, so the notice must stay under about 111px tall to clear
   it. Laid out as one compact row to land near 80px. */
@media (max-width:767px){
  #cookieConsentContainer, .cookieConsentContainer{
    left:10px !important; right:10px !important; bottom:10px !important;
    width:auto !important; max-width:none !important;
    padding:12px 14px !important;
    display:flex !important; align-items:center; gap:12px;
    font-size:.74rem; line-height:1.35;
  }
  .cookieConsentContainer .cookieDesc{margin:0 !important;flex:1;}
  .cookieConsentContainer .cookieButton{margin:0 !important;flex:none;}
  .cookieConsentContainer .cookieButton a{
    padding:7px 16px !important;font-size:.8rem;white-space:nowrap;
  }
}

/* --- sign in page ------------------------------------------------------ */
.ctm-signin{padding:72px 0 96px;}
/* Clearance for the fixed cookie notice on short screens. Harmless once the
   notice is dismissed, since it is only trailing space above the footer. */
@media (max-width:767px){
  .ctm-signin{padding:32px 0 120px;}
}
.ctm-signin-card{
  background:linear-gradient(160deg,var(--ctm-card) 0%,var(--ctm-bg-soft) 100%);
  border:1px solid var(--ctm-line);
  border-radius:20px;
  padding:44px 40px;
  text-align:center;
}
.ctm-signin-orb-wrap{display:flex;justify-content:center;margin-bottom:20px;}
.ctm-signin-title{font-size:1.7rem;margin-bottom:6px;}
.ctm-signin-sub{color:var(--ctm-muted);margin-bottom:28px;}

/* The form itself is left aligned inside the centred card */
.ctm-signin-card form{text-align:left;}
.ctm-signin-card form h5{
  font-family:'Karla',sans-serif !important;
  font-size:.9rem;
  color:var(--ctm-muted);
  margin-bottom:7px;
}
.ctm-signin-card .form-control{padding-left:44px !important;}
.ctm-signin-card .position-relative > i.fa-user,
.ctm-signin-card .position-relative > i.fa-key{
  position:absolute;left:16px;top:50%;transform:translateY(-50%);
  color:var(--ctm-muted);z-index:2;
}
.ctm-signin-card .log-in{margin-top:26px;}
.ctm-signin-card .log-in .btn{width:100%;}

.ctm-forgot{display:block;text-align:right;margin-top:8px;}
.ctm-forgot a{color:var(--ctm-muted) !important;font-size:.86rem;}
.ctm-forgot a:hover{color:var(--ctm-glow) !important;}

.ctm-signin-help{
  margin-top:26px;padding-top:20px;
  border-top:1px solid var(--ctm-line);
  font-size:.84rem;color:var(--ctm-muted);
}