/* =========================================================
   WELLBEING STUDIO CLEAN CSS
   Purpose: clean rebuild of launch CSS.
   Load after ws.css only while testing, then replace ws.css when stable.
   ========================================================= */

/* =========================================================
   01. Design tokens
========================================================= */
:root {
  --ws-teal: #115e67;
  --ws-teal-2: #1693a5;
  --ws-teal-dark: #0d4f57;
  --ws-gold: #c6a049;
  --ws-gold-dark: #b79239;

  --ws-text: #223438;
  --ws-text-soft: #5b6b70;

  --ws-bg: #f5f7f6;
  --ws-bg-alt: #edf1f0;
  --ws-white: #ffffff;
  --ws-border: #d9e3e0;

  --ws-shadow: 0 10px 30px rgba(20, 40, 44, 0.08);
  --ws-shadow-lg: 0 18px 44px rgba(17, 94, 103, 0.08);

  --ws-radius-sm: 12px;
  --ws-radius: 18px;
  --ws-radius-lg: 28px;

  --ws-shell-max: 1480px;
  --ws-content-max: 1280px;
}

/* =========================================================
   02. Base typography and links
========================================================= */
html,
body {
  margin: 0;
  padding: 0;
}

body {
  font-family: "Open Sans", Arial, sans-serif;
  color: var(--ws-text);
  background: var(--ws-bg);
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar .site-name,
.page-header-headings h1,
.page-context-header h1 {
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  color: var(--ws-text);
  letter-spacing: -0.02em;
}

p,
li,
td,
th,
input,
select,
textarea,
button {
  font-family: "Open Sans", Arial, sans-serif;
}

a {
  color: var(--ws-teal);
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--ws-teal-2);
  text-decoration: none;
}

/* =========================================================
   03. Moodle shell
========================================================= */
#page-wrapper,
#page,
#page-content,
#region-main-box,
#region-main {
  background: transparent;
}

#page.drawers .main-inner,
body:not(.limitedwidth) #page.drawers .main-inner {
  width: 100%;
  max-width: var(--ws-shell-max) !important;
  margin-right: auto;
  margin-left: auto;
}

#region-main,
#region-main-box,
#page.drawers div[role="main"] {
  width: 100%;
}

#region-main {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

/* =========================================================
   04. Header and logo
========================================================= */
.navbar.fixed-top,
.navbar {
  min-height: 82px !important;
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--ws-border);
  box-shadow: 0 2px 10px rgba(20, 40, 44, 0.04);
  backdrop-filter: blur(10px);
}

.navbar .navbar-brand {
  width: 330px !important;
  height: 82px !important;
  min-height: 82px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 0 0 14px !important;
  margin-right: 28px !important;
}

.navbar .navbar-brand img,
.navbar .navbar-brand .logo {
  display: none !important;
}

.navbar .navbar-brand::before {
  content: "";
  display: block;
  width: 305px;
  height: 72px;
  background: url("/theme/boost_union/pix/logo-corporate-yoga-australia-sml.png") no-repeat left center;
  background-size: contain;
}

body:not(.pagelayout-login) {
  padding-top: 82px !important;
}

@media (max-width: 767px) {
  .navbar.fixed-top,
  .navbar {
    min-height: 66px !important;
  }

  .navbar .navbar-brand {
    width: 260px !important;
    height: 66px !important;
    min-height: 66px !important;
    padding-left: 8px !important;
    margin-right: 12px !important;
  }

  .navbar .navbar-brand::before {
    width: 245px;
    height: 56px;
  }

  body:not(.pagelayout-login) {
    padding-top: 66px !important;
  }
}

/* =========================================================
   05. Buttons and forms
========================================================= */
.btn,
button,
input[type="submit"],
input[type="button"] {
  border-radius: 999px;
  font-weight: 700;
  box-shadow: none;
}

.btn-primary,
button.btn-primary,
input[type="submit"] {
  background: var(--ws-teal);
  border-color: var(--ws-teal);
  color: #ffffff;
}

.btn-primary:hover,
.btn-primary:focus,
button.btn-primary:hover,
button.btn-primary:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
  background: var(--ws-teal-dark);
  border-color: var(--ws-teal-dark);
  color: #ffffff;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
select,
textarea,
.form-control,
.custom-select {
  min-height: 48px;
  border: 1px solid var(--ws-border);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: none;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.custom-select:focus {
  border-color: var(--ws-teal-2);
  box-shadow: 0 0 0 3px rgba(22, 147, 165, 0.14);
}

/* =========================================================
   06. Login / gateway page
========================================================= */
body.pagelayout-login {
  margin: 0;
  background: #eef3f1;
  color: var(--ws-text);
  font-family: "Open Sans", Arial, sans-serif;
}

body.pagelayout-login #page-wrapper,
body.pagelayout-login #page {
  max-width: none !important;
  margin: 0 !important;
}

body.pagelayout-login #page.ws-gateway {
  min-height: 100vh;
  padding: 24px !important;
  background: #eef3f1;
  box-sizing: border-box;
}

body.pagelayout-login #page-content,
body.pagelayout-login #region-main-box,
body.pagelayout-login #region-main,
body.pagelayout-login .login-wrapper,
body.pagelayout-login .login-container {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.pagelayout-login .ws-gateway__shell {
  min-height: calc(100vh - 48px);
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  overflow: hidden;
  background: #fff;
  border-radius: 28px;
  box-shadow: 0 20px 50px rgba(17, 94, 103, 0.08);
}

body.pagelayout-login .ws-gateway__hero {
  display: flex;
  align-items: flex-end;
  background:
    linear-gradient(rgba(31, 37, 38, 0.46), rgba(31, 37, 38, 0.46)),
    url('/theme/boost_union/pix/bg-cws-card-hero.jpg') center / cover no-repeat;
}

body.pagelayout-login .ws-gateway__hero-inner {
  max-width: 560px;
  padding: 56px;
  color: #fff;
}

body.pagelayout-login .ws-gateway__logo {
  width: 210px;
  max-width: 70%;
  height: auto;
  margin-bottom: 24px;
}

body.pagelayout-login .ws-gateway__eyebrow {
  margin: 0 0 12px;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.9;
}

body.pagelayout-login .ws-gateway__title {
  margin: 0 0 20px;
  color: #fff;
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: clamp(3rem, 5vw, 5.2rem);
  line-height: 0.9;
  font-weight: 900;
  letter-spacing: -0.06em;
}

body.pagelayout-login .ws-gateway__text {
  max-width: 430px;
  margin: 0;
  color: rgba(255, 255, 255, 0.95);
  font-size: 1rem;
  line-height: 1.65;
}

body.pagelayout-login .ws-gateway__panel {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 42px;
  background: #f8faf9;
}

body.pagelayout-login .ws-gateway__card {
  width: 100%;
  max-width: 410px;
  padding: 36px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(17, 94, 103, 0.08);
  box-sizing: border-box;
  text-align: center;
}

body.pagelayout-login .ws-gateway__heading {
  margin: 0 0 10px;
  color: var(--ws-teal);
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: 2rem;
  line-height: 1.1;
  font-weight: 900;
}

body.pagelayout-login .ws-gateway__sub {
  margin: 0 0 24px;
  color: #5f6f72;
  line-height: 1.5;
}

body.pagelayout-login .login-logo,
body.pagelayout-login .login-heading,
body.pagelayout-login .login-divider,
body.pagelayout-login .login-signup,
body.pagelayout-login .potentialidps,
body.pagelayout-login .login-identityproviders,
body.pagelayout-login footer,
body.pagelayout-login .footer-popover {
  display: none !important;
}

body.pagelayout-login .login-form {
  margin: 0;
  text-align: left;
}

body.pagelayout-login .login-form .form-label,
body.pagelayout-login .login-form label {
  color: var(--ws-text);
  font-weight: 700;
}

body.pagelayout-login .form-control,
body.pagelayout-login input[type="text"],
body.pagelayout-login input[type="password"],
body.pagelayout-login input[type="email"] {
  min-height: 52px;
  border: 1px solid rgba(17, 94, 103, 0.18) !important;
  border-radius: 14px !important;
  background: #f7faf9 !important;
  color: var(--ws-text) !important;
  box-shadow: none !important;
}

body.pagelayout-login .input-group {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
}

body.pagelayout-login .input-group > .form-control {
  flex: 1 1 auto;
  min-width: 0;
}

body.pagelayout-login .input-group .btn,
body.pagelayout-login .input-group-append .btn {
  min-height: 52px;
}

body.pagelayout-login .form-control:focus,
body.pagelayout-login input[type="text"]:focus,
body.pagelayout-login input[type="password"]:focus,
body.pagelayout-login input[type="email"]:focus {
  border-color: var(--ws-teal) !important;
  box-shadow: 0 0 0 4px rgba(17, 94, 103, 0.12) !important;
}

body.pagelayout-login .input-group .btn,
body.pagelayout-login .input-group-append .btn {
  border-color: rgba(17, 94, 103, 0.18) !important;
  border-radius: 0 14px 14px 0 !important;
  background: #f7faf9 !important;
  color: var(--ws-teal) !important;
}

body.pagelayout-login .btn-primary,
body.pagelayout-login button[type="submit"],
body.pagelayout-login input[type="submit"] {
  width: 100%;
  min-height: 52px;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--ws-teal) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

body.pagelayout-login .btn-primary:hover,
body.pagelayout-login button[type="submit"]:hover,
body.pagelayout-login input[type="submit"]:hover {
  background: var(--ws-teal-dark) !important;
}

body.pagelayout-login a {
  color: var(--ws-teal);
  font-weight: 700;
  text-decoration: none;
}

body.pagelayout-login a:hover {
  text-decoration: underline;
}

body.pagelayout-login .forgetpass,
body.pagelayout-login .login-form-forgotpassword {
  text-align: center;
}

body.pagelayout-login .ws-gateway__note {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid rgba(17, 94, 103, 0.12);
  text-align: center;
}

body.pagelayout-login .ws-gateway__note h3 {
  margin: 0 0 10px;
  color: var(--ws-teal);
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: 1.2rem;
  line-height: 1.15;
  font-weight: 900;
}

body.pagelayout-login .ws-gateway__note p {
  margin: 0 0 10px;
  color: #5f6f72;
  font-size: 0.95rem;
  line-height: 1.5;
}

body.pagelayout-login .ws-gateway__note p:last-child {
  margin-bottom: 0;
}
/* Login page responsive layout */
@media (max-width: 900px) {
  body.pagelayout-login #page.ws-gateway {
    min-height: 100vh;
    padding: 14px !important;
  }

  body.pagelayout-login .ws-gateway__shell {
    min-height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 24px;
  }

  body.pagelayout-login .ws-gateway__hero {
    width: 100%;
    min-height: 360px;
    align-items: flex-end;
    background-position: center center;
  }

  body.pagelayout-login .ws-gateway__hero-inner {
    max-width: none;
    padding: 34px 28px;
  }

  body.pagelayout-login .ws-gateway__logo {
    width: 170px;
    margin-bottom: 18px;
  }

  body.pagelayout-login .ws-gateway__title {
    font-size: clamp(3rem, 17vw, 5.2rem);
  }

  body.pagelayout-login .ws-gateway__panel {
    width: 100%;
    padding: 22px;
  }

  body.pagelayout-login .ws-gateway__card {
    max-width: none;
    padding: 28px 22px;
    box-shadow: none;
  }
}

@media (max-width: 520px) {
  body.pagelayout-login #page.ws-gateway {
    padding: 10px !important;
  }

  body.pagelayout-login .ws-gateway__hero {
    min-height: 320px;
  }

  body.pagelayout-login .ws-gateway__hero-inner {
    padding: 30px 24px;
  }

  body.pagelayout-login .ws-gateway__panel {
    padding: 18px;
  }

  body.pagelayout-login .ws-gateway__card {
    padding: 24px 18px;
  }

  body.pagelayout-login .ws-gateway__heading {
    font-size: 1.75rem;
  }
}

body.pagelayout-login {
  overflow-x: hidden;
}
/* Login page only - hide Moodle cookie notice clutter */
body.pagelayout-login .cookies-section,
body.pagelayout-login .cookie-notice,
body.pagelayout-login a[href*="cookies"],
body.pagelayout-login button[data-action*="cookies"] {
  display: none !important;
}

/* =========================================================
   07. Email confirmation success page
   Moodle page: /login/confirm.php
========================================================= */

body#page-login-confirm {
  background: #eef3f1;
  font-family: "Open Sans", Arial, sans-serif;
  color: var(--ws-text);
}

body#page-login-confirm #page {
  background: transparent;
}

body#page-login-confirm #page-content {
  padding: 40px 20px;
}

body#page-login-confirm .secondary-navigation,
body#page-login-confirm .breadcrumb,
body#page-login-confirm #page-header,
body#page-login-confirm .activity-header {
  display: none !important;
}

body#page-login-confirm #region-main {
  max-width: 760px;
  margin: 56px auto;
  padding: 0;
  border: 0;
  background: transparent;
}

body#page-login-confirm .box.py-3.generalbox {
  position: relative;
  overflow: hidden;
  max-width: 720px;
  margin: 0 auto;
  padding: 72px 48px 56px !important;
  background: #ffffff;
  border-radius: 32px;
  box-shadow: 0 24px 70px rgba(17, 94, 103, 0.12);
  text-align: center;
}

body#page-login-confirm .box.py-3.generalbox::before {
  content: "";
  position: absolute;
  top: -58px;
  left: -58px;
  width: 150px;
  height: 150px;
  border-radius: 999px;
  background: rgba(85, 190, 184, 0.25);
}

body#page-login-confirm .box.py-3.generalbox::after {
  content: "";
  position: absolute;
  top: 32px;
  right: 42px;
  width: 74px;
  height: 74px;
  border-radius: 999px;
  border: 2px solid rgba(198, 160, 73, 0.5);
}

body#page-login-confirm #region-main h1,
body#page-login-confirm #region-main .h2 {
  position: relative;
  z-index: 1;
  max-width: 620px;
  margin: 0 auto 32px;
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: clamp(2.1rem, 4vw, 3.4rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
  color: var(--ws-text);
}

body#page-login-confirm #region-main h3,
body#page-login-confirm #region-main h4,
body#page-login-confirm #region-main p {
  position: relative;
  z-index: 1;
}

body#page-login-confirm #region-main h3,
body#page-login-confirm #region-main h4 {
  margin: 0 0 10px;
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: 1.35rem;
  line-height: 1.25;
  color: var(--ws-text);
}

body#page-login-confirm #region-main p {
  max-width: 460px;
  margin: 0 auto 24px;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--ws-text-soft);
}

body#page-login-confirm #region-main .btn,
body#page-login-confirm #region-main input[type="submit"],
body#page-login-confirm #region-main button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 28px;
  border: 0;
  border-radius: 999px;
  background: var(--ws-teal);
  color: #ffffff;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.98rem;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 12px 24px rgba(17, 94, 103, 0.22);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;
}

body#page-login-confirm #region-main .btn:hover,
body#page-login-confirm #region-main input[type="submit"]:hover,
body#page-login-confirm #region-main button:hover {
  background: var(--ws-teal-dark);
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 16px 30px rgba(17, 94, 103, 0.26);
}

@media (max-width: 640px) {
  body#page-login-confirm #page-content {
    padding: 24px 14px;
  }

  body#page-login-confirm #region-main {
    margin: 28px auto;
  }

  body#page-login-confirm .box.py-3.generalbox {
    padding: 56px 24px 40px !important;
    border-radius: 24px;
  }

  body#page-login-confirm .box.py-3.generalbox::after {
    display: none;
  }
}

/* =========================================================
   08. Participant chrome cleanup
========================================================= */

/* Hide top-right Moodle clutter for learner/non-editing views */
body:not(.editing) #usernavigation > .popover-region,
body:not(.editing) #usernavigation > .divider,
body:not(.editing) #usernavigation > .divider.border-start,
body:not(.editing) #nav-notification-popover-container,
body:not(.editing) #usernavigation [data-region="popover-region-messages"],
body:not(.editing) #usernavigation [data-region="popover-region-notifications"] {
  display: none !important;
}

/* Hide drawer toggles/course index on learner course pages */
body.path-course-view:not(.editing) .drawer-left-toggle,
body.path-course-view:not(.editing) .drawer-right-toggle,
body.path-course-view:not(.editing) .drawer-toggles,
body.path-course-view:not(.editing) [data-region="drawer-toggle"],
body.path-course-view:not(.editing) [data-region="courseindex"],
body.path-course-view:not(.editing) #theme_boost-drawers-courseindex,
body.path-course-view:not(.editing) #theme_boost-drawers-blocks,
body.path-course-view:not(.editing) .drawer.drawer-left,
body.path-course-view:not(.editing) .courseindex {
  display: none !important;
}


/* Remove drawer offset and default top spacing on learner course pages */
body.path-course-view:not(.editing) #page.drawers.show-drawer-left,
body.path-course-view:not(.editing) #page.drawers {
  margin-left: 0 !important;
}

body.path-course-view:not(.editing) #page,
body.path-course-view:not(.editing) #page.drawers,
body.path-course-view:not(.editing) #page-content,
body.path-course-view:not(.editing) #region-main-box,
body.path-course-view:not(.editing) #region-main,
body.path-course-view:not(.editing) #topofscroll.main-inner,
body.path-course-view:not(.editing) .course-content,
body.path-course-view:not(.editing) .course-content ul.topics {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Remove default activity card styling where custom WS layouts are used */
body.path-course-view:not(.editing) .activity,
body.path-course-view:not(.editing) .activity-item {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Hide Moodle hamburger/drawer toggles for normal users */
body:not(.editing) nav.navbar.fixed-top button[data-toggler="drawers"],
body:not(.editing) nav.navbar.fixed-top .navbar-toggler,
body:not(.editing) nav.navbar.fixed-top .drawer-toggler,
body:not(.editing) nav.navbar.fixed-top .btn[data-action="toggle-drawer"],
body:not(.editing) nav.navbar.fixed-top [data-region="drawer-toggle"] {
  display: none !important;
}

/* Prevent blank drawer overlay for normal users */
body:not(.editing) .modal-backdrop[data-region="modal-backdrop"],
body:not(.editing) #theme_boost-drawers-primary,
body:not(.editing) #theme_boost-drawers-courseindex {
  display: none !important;
}

/* Hide selected user-menu clutter for learner/non-editing views */
body:not(.editing) .usermenu .dropdown-menu a.dropdown-item[href*="/reportbuilder/index.php"],
body:not(.editing) .usermenu .dropdown-menu a.dropdown-item[href*="/user/profile.php"],
body:not(.editing) .usermenu .dropdown-menu a[href*="/grade/report/"],
body:not(.editing) .usermenu .dropdown-menu a[href*="/calendar/"],
body:not(.editing) .usermenu .dropdown-menu a[href*="/user/files.php"],
body:not(.editing) .usermenu .dropdown-menu a[href*="/report/"],
body:not(.editing) .usermenu .dropdown-menu a[href*="/user/preferences.php"] {
  display: none !important;
}

body:not(.editing) .usermenu .dropdown-menu a.dropdown-item[href*="/reportbuilder/index.php"] + .dropdown-divider,
body:not(.editing) .usermenu .dropdown-menu a.dropdown-item[href*="/user/profile.php"] + .dropdown-divider {
  display: none !important;
}

/* =========================================================
   09. Footer cleanup
========================================================= */

body:not(.editing) footer#page-footer,
body:not(.editing) #page-footer,
body:not(.editing) .footer-popover,
body:not(.editing) .footer-content-popover,
body:not(.editing) .footer-section,
body:not(.editing) [data-region="footer-container-popover"] {
  visibility: visible !important;
  opacity: 1 !important;
}

body:not(.editing) footer .logininfo,
body:not(.editing) footer .tool_dataprivacy,
body:not(.editing) footer .homelink,
body:not(.editing) footer .sitelink,
body:not(.editing) footer .helplink,
body:not(.editing) footer .performanceinfo,
body:not(.editing) footer .purgecaches,
body:not(.editing) footer .theme-switcher,
body:not(.editing) footer .tool_usertours-resettourcontainer,
body:not(.editing) footer a[href*="theme=standard"],
body:not(.editing) footer a[href*="moodle.org"],
body:not(.editing) footer a[href*="dataprivacy"],
body:not(.editing) footer a[href*="/login/logout.php"] {
  display: none !important;
}

/* =========================================================
   10. WS homepage/course page essentials
   Minimal styles for ws-home.php and ws-monthly-reset.php
========================================================= */

/* Remove Moodle page chrome around WS custom HTML pages */
body:not(.editing) #page-header,
body:not(.editing) .page-header-headings,
body:not(.editing) .secondary-navigation,
body:not(.editing) .tertiary-navigation,
body:not(.editing) .breadcrumb,
body:not(.editing) .breadcrumb-nav,
body:not(.editing) .moremenu,
body:not(.editing) .nav-tabs,
body:not(.editing) .activity-header,
body:not(.editing) .activity-navigation,
body:not(.editing) .collapsible-actions,
body:not(.editing) .course-content .sectionname,
body:not(.editing) .course-content .section_action_menu,
body:not(.editing) .course-content .sectionbadges,
body:not(.editing) .course-content .availabilityinfo,
body:not(.editing) .course-content .completioninfo,
body:not(.editing) .course-content .activity-completion,
body:not(.editing) .course-content .activity-basis {
  display: none !important;
}

body:not(.editing) #page.drawers,
body:not(.editing) #page-content,
body:not(.editing) #region-main,
body:not(.editing) #region-main-box,
body:not(.editing) #topofscroll.main-inner,
body:not(.editing) .course-content,
body:not(.editing) .course-section,
body:not(.editing) .activity,
body:not(.editing) .activity-item,
body:not(.editing) .activityinstance,
body:not(.editing) .contentwithoutlink,
body:not(.editing) .no-overflow,
body:not(.editing) .generalbox {
  width: 100% !important;
  max-width: none !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:not(.editing) #page.drawers .main-inner,
body:not(.editing):not(.limitedwidth) #page.drawers .main-inner {
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Main WS page wrapper */
.cws-program-page {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding: 0 0 80px;
  box-sizing: border-box;
  overflow-x: hidden;
}


.cws-program-page *,
.cws-program-page *::before,
.cws-program-page *::after {
  box-sizing: border-box;
}

/* Hero */
.cws-course-hero {
  width: 100vw;
  max-width: 100vw;
  overflow: hidden;
  margin: 0 0 0 calc(50% - 50vw);
  border-radius: 0;
  background: var(--ws-teal);
  box-shadow: var(--ws-shadow-lg);
}

/* Tighten hero-to-first-section spacing */
.cws-month-intro {
  margin: 0 !important;
  padding: 0 !important;
}

.cws-month-intro .cws-mobile-nav {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.cws-month-intro + .cws-month-intro__overview,
.cws-month-intro + .ws-section,
.cws-month-intro + .cws-card,
.cws-month-intro + .ws-toolkit,
.cws-month-intro + .ws-support-strip,
.cws-month-intro + .cws-week-section {
  margin-top: 8px !important;
}

.cws-hero__content {
  position: relative;
  min-height: clamp(430px, 52vw, 650px);
  display: flex;
  align-items: flex-end;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

.cws-hero__bg-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.12));
  pointer-events: none;
}

.cws-hero__inner {
  position: relative;
  z-index: 2;
  width: min(100%, var(--ws-content-max));
  max-width: var(--ws-content-max);
  margin: 0 auto;
  padding: clamp(42px, 7vw, 84px) clamp(20px, 4vw, 56px);
  color: #ffffff;
}

.cws-eyebrow,
.cws-kicker,
.cws-card-kicker,
.ws-eyebrow,
.ws-reset-card__kicker,
.ws-card__eyebrow {
  margin: 0 0 10px;
  color: var(--ws-teal);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.cws-eyebrow--hero {
  color: rgba(255, 255, 255, 0.9);
}

.cws-hero__title,
.cws-hero-title {
  margin: 0;
  color: #ffffff;
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: clamp(4.2rem, 10vw, 8.8rem);
  line-height: 0.86;
  font-weight: 950;
  letter-spacing: -0.075em;
}

/* Hero CTA */
.ws-hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  margin-top: 28px;
  padding: 16px 34px;
  border-radius: 999px;
  background: var(--ws-gold);
  color: #ffffff !important;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.1;
  text-decoration: none !important;
  box-shadow: 0 16px 34px rgba(198, 160, 73, 0.32);
}

.ws-hero-cta:hover,
.ws-hero-cta:focus {
  background: var(--ws-gold-dark);
  color: #ffffff !important;
  transform: translateY(-1px);
  box-shadow: 0 20px 40px rgba(198, 160, 73, 0.36);
}

@media (max-width: 767px) {
  .ws-hero-cta {
    width: 100%;
    max-width: 280px;
  }
}

/* Homepage program CTA */
.ws-home-actions {
  width: min(calc(100% - 40px), var(--ws-content-max));
  max-width: var(--ws-content-max);
  margin: 34px auto;
}

.ws-reset-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: clamp(28px, 4vw, 44px);
  border: 1px solid rgba(17, 94, 103, 0.14);
  border-radius: var(--ws-radius-lg);
  background: #ffffff;
  color: var(--ws-text);
  text-decoration: none !important;
  box-shadow: var(--ws-shadow-lg);
}

.ws-reset-card:hover,
.ws-reset-card:focus {
  color: var(--ws-text);
  text-decoration: none !important;
}

.ws-reset-card__title {
  margin: 0 0 12px;
  color: var(--ws-teal);
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-size: clamp(2.3rem, 4vw, 4rem);
  line-height: 0.98;
  font-weight: 950;
  letter-spacing: -0.055em;
}

.ws-reset-card__text {
  max-width: 720px;
  margin: 0;
  color: var(--ws-text-soft);
  line-height: 1.65;
}

.ws-reset-card__button,
.cws-button,
.ws-toolkit__btn,
.ws-support-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 16px 32px;
  border-radius: 999px;
  background: var(--ws-teal);
  color: #ffffff !important;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
  text-decoration: none !important;
  box-shadow: 0 14px 28px rgba(17, 94, 103, 0.22);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;
}

.ws-reset-card__button:hover,
.ws-reset-card__button:focus,
.cws-button:hover,
.cws-button:focus,
.ws-toolkit__btn:hover,
.ws-toolkit__btn:focus,
.ws-support-btn:hover,
.ws-support-btn:focus {
  background: var(--ws-teal-dark);
  color: #ffffff !important;
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(17, 94, 103, 0.26);
}

.cws-button--secondary,
.ws-toolkit__btn--light {
  background: #ffffff;
  color: var(--ws-teal) !important;
  border: 1px solid rgba(17, 94, 103, 0.18);
  box-shadow: 0 12px 24px rgba(17, 94, 103, 0.10);
}

.cws-button--secondary:hover,
.cws-button--secondary:focus,
.ws-toolkit__btn--light:hover,
.ws-toolkit__btn--light:focus {
  background: #f7faf9;
  color: var(--ws-teal-dark) !important;
}

.cws-button--disabled {
  opacity: 0.65;
  pointer-events: none;
}

/* Sections and cards */
.ws-section,
.cws-card,
.cws-month-intro__overview,
.ws-toolkit,
.ws-support-strip {
  width: min(calc(100% - 40px), var(--ws-content-max));
  max-width: var(--ws-content-max);
  margin: 34px auto;
  padding: clamp(28px, 4vw, 46px);
  border: 1px solid rgba(17, 94, 103, 0.12);
  border-radius: var(--ws-radius-lg);
  background: #ffffff;
  box-shadow: var(--ws-shadow);
}

.cws-month-intro__overview--split {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 1.05fr);
  gap: clamp(26px, 4vw, 48px);
  align-items: center;
}

.ws-section__title,
.cws-section-intro__title,
.cws-section-title,
.cws-week-header__title,
.cws-card-title,
.ws-card__title,
.ws-toolkit__intro h2,
.ws-toolkit-feature h3 {
  margin: 0 0 14px;
  color: var(--ws-teal);
  font-family: "Urbanist", "Open Sans", Arial, sans-serif;
  font-weight: 900;
  letter-spacing: -0.045em;
}

.ws-section__title,
.cws-section-intro__title,
.cws-section-title,
.ws-toolkit__intro h2 {
  font-size: clamp(2rem, 3vw, 3.2rem);
  line-height: 1.02;
}

.ws-section__intro,
.cws-section-intro__text,
.cws-card-text,
.ws-card__text,
.ws-toolkit__intro p,
.ws-toolkit-feature p,
.cws-takeaway-text {
  color: var(--ws-text-soft);
  line-height: 1.65;
}

.ws-card-grid,
.cws-live-session-grid,
.cws-resource-grid,
.ws-toolkit__featured {
  display: grid;
  gap: 22px;
}

.ws-card-grid--2,
.ws-toolkit__featured {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cws-live-session-grid,
.cws-resource-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ws-card,
.cws-live-session-card,
.cws-resource-card,
.ws-toolkit-feature {
  overflow: hidden;
  border: 1px solid rgba(17, 94, 103, 0.12);
  border-radius: var(--ws-radius);
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(17, 94, 103, 0.07);
}

.ws-card--profile {
  display: grid;
  grid-template-columns: minmax(170px, 0.42fr) minmax(0, 0.58fr);
}

.ws-card__body,
.cws-live-session-card,
.cws-resource-card__body,
.ws-toolkit-feature {
  padding: 22px;
}

.ws-card__image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 260px;
  object-fit: cover;
}

/* Reliable Vimeo embeds - no custom overlay */
.cws-resource-card__frame,
.ws-video-clean {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}

.ws-video-clean {
  position: relative;
  overflow: hidden;
  border-radius: var(--ws-radius);
  background: #102f35;
  box-shadow: 0 12px 28px rgba(17, 94, 103, 0.07);
}

.ws-video-clean iframe,
.cws-resource-card__frame iframe {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  height: 100% !important;
  border: 0;
}

.ws-support-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  background: var(--ws-teal);
  color: #ffffff;
}

.ws-support-strip h2,
.ws-support-strip h3,
.ws-support-strip p {
  color: #ffffff;
}

.ws-support-btn {
  background: #ffffff;
  color: var(--ws-teal) !important;
}

@media (max-width: 1100px) {
  .cws-live-session-grid,
  .cws-resource-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .ws-reset-card,
  .ws-card-grid--2,
  .ws-toolkit__featured,
  .cws-month-intro__overview--split,
  .cws-live-session-grid,
  .cws-resource-grid,
  .ws-card--profile {
    grid-template-columns: 1fr;
  }

  .ws-reset-card__button,
  .cws-button,
  .ws-toolkit__btn,
  .ws-support-btn {
    width: 100%;
  }

  .ws-support-strip {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 767px) {
  .cws-program-page {
    padding: 0 0 80px;
  }

  .cws-course-hero {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: 0;
    margin-bottom: 0;
    border-radius: 0;
  }

  .cws-month-intro + .cws-month-intro__overview,
  .cws-month-intro + .ws-section,
  .cws-month-intro + .cws-card,
  .cws-month-intro + .ws-toolkit,
  .cws-month-intro + .ws-support-strip,
  .cws-month-intro + .cws-week-section {
    margin-top: 6px !important;
  }

  .cws-hero__content {
    min-height: 430px;
  }

  .cws-hero__inner {
    padding: 34px 18px;
  }

  .cws-hero__title,
  .cws-hero-title {
    font-size: clamp(3.8rem, 18vw, 5.8rem);
  }

  .ws-home-actions,
  .ws-section,
  .cws-card,
  .cws-month-intro__overview,
  .ws-reset-card,
  .ws-toolkit,
  .ws-support-strip {
    width: calc(100% - 16px);
    margin-left: auto;
    margin-right: auto;
  }

  .ws-section,
  .cws-card,
  .cws-month-intro__overview,
  .ws-reset-card,
  .ws-toolkit,
  .ws-support-strip {
    padding: 22px 18px;
    border-radius: 22px;
  }
}


/* Hide Moodle collapse/expand controls on custom WS pages */
body:not(.editing) .course-content .section-collapsemenu,
body:not(.editing) .course-content .collapseall,
body:not(.editing) .course-content [data-region="section-collapsemenu"],
body:not(.editing) .course-content .collapsible-actions,
body:not(.editing) button[data-action="toggleall"],
body:not(.editing) button[data-action="collapseall"],
body:not(.editing) .course-content .btn[data-action*="collapse"],
body:not(.editing) .course-content .btn[data-action*="toggle"],
body:not(.editing) .course-content .course-section-header,
body:not(.editing) .course-content [data-for="section_title"],
body:not(.editing) .course-content [data-for="sectiontoggler"],
body:not(.editing) .course-content [data-action="togglecoursecontent"],
body:not(.editing) .course-content [aria-expanded][aria-controls^="coursecontentcollapse"],
body:not(.editing) .course-content .section-item > .course-section-header {
  display: none !important;
}

/* Hide unreleased weekly sections */
body:not(.editing) .cws-week-section--locked,
body:not(.editing) .cws-week-section.is-locked,
body:not(.editing) .cws-week-section[data-status="locked"],
body:not(.editing) .cws-week-section[data-release="locked"] {
  display: none !important;
}

/* Premium toolkit card styling */
.ws-toolkit--premium {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(22,147,165,0.04), rgba(198,160,73,0.03)),
    #ffffff;
  border: 1px solid rgba(17,94,103,0.10);
  box-shadow:
    0 20px 50px rgba(17,94,103,0.08),
    inset 0 1px 0 rgba(255,255,255,0.7);
}

.ws-toolkit--premium::before {
  content: "";
  position: absolute;
  top: -140px;
  right: -140px;
  width: 320px;
  height: 320px;
  border-radius: 999px;
  background: rgba(22,147,165,0.05);
  pointer-events: none;
}

.ws-toolkit--premium .ws-toolkit__intro {
  position: relative;
  z-index: 2;
  max-width: 920px;
}

.ws-toolkit--premium h2 {
  margin-bottom: 22px;
  line-height: 0.95;
}

.ws-toolkit--premium ul {
  margin: 26px 0 18px;
  padding: 0;
  list-style: none;
}

.ws-toolkit--premium li {
  position: relative;
  margin-bottom: 16px;
  padding-left: 34px;
  color: var(--ws-text);
  font-size: 1.08rem;
  line-height: 1.55;
}

.ws-toolkit--premium li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--ws-teal-2);
  box-shadow: 0 0 0 6px rgba(22,147,165,0.12);
}

.ws-toolkit--premium .p1 {
  margin-top: 26px;
  color: var(--ws-text-soft);
  font-size: 1.04rem;
  line-height: 1.7;
}

@media (max-width: 767px) {
  .ws-toolkit--premium li,
  .ws-toolkit--premium .p1 {
    font-size: 1rem;
  }
}

/* Mobile hero refinements */
@media (max-width: 640px) {
  .cws-hero__content--welcome,
  .cws-course-hero .cws-hero__content {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }

  .cws-hero__content--welcome .cws-hero__text,
  .cws-course-hero .cws-hero__text {
    margin-left: 6px !important;
  }

  .cws-hero__content--welcome .cws-btn,
  .cws-course-hero .cws-btn,
  .cws-hero__content--welcome a.btn,
  .cws-course-hero a.btn,
  .cws-course-hero a[href*="/course/view.php"] {
    width: calc(100% + 36px) !important;
    max-width: none !important;
    margin-left: -18px !important;
    margin-right: -18px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    display: flex !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }
}