/*
Theme Name: Chekah Academy
Theme URI: https://chekah.com/
Author: آکادمی حسابداری چکاه
Author URI: https://chekah.com/
Description: قالب اختصاصی و مدرن آموزشگاه حسابداری و مالیاتی چکاه. طراحی شده با بالاترین استانداردهای UI/UX Pro Max، بهینه‌سازی شده برای دوره‌های حضوری، آنلاین و پکیج‌های ضبط شده ویدیویی، کاملاً واکنش‌گرا و سازگار با ووکامرس و اسپات‌پلیر.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chekah-academy
Tags: education, e-commerce, custom-menu, featured-images, rtl-language-support, theme-options, translation-ready
*/

/* ==========================================================================
   CSS VARIABLES & DESIGN SYSTEM TOKENS (UI/UX PRO MAX)
   ========================================================================== */
:root {
  /* Chekah Brand Core Palette (tax-class harmony) */
  --prussian:      #00304D;   /* Prussian Blue */
  --prussian-900:  #00233A;   /* Deep Prussian Blue */
  --azure:         #2E6F97;   /* Steel Azure */
  --azure-soft:    #6EA3C2;   /* Azure Soft */
  --orange:        #E98322;   /* Tiger Orange */
  --orange-700:    #C96A12;   /* Orange Mid */
  --orange-btn:    #B25A0C;   /* Deep Tiger Orange Button */
  --orange-btn-h:  #984A09;   /* Orange Button Hover */
  --sandy:         #F4A460;   /* Sandy Brown */
  --ghost:         #F6F8FB;   /* Ghost White */

  --ink:           #0A1C28;   /* Deep Ink */
  --muted:         #5A6B77;   /* Slate Gray */
  --line:          #E2E8EE;   /* Line Border */
  --white:         #FFFFFF;   /* Pure White */

  /* Semantic Aliases */
  --ck-primary:    var(--prussian);
  --ck-primary-hover: var(--azure);
  --ck-accent:     var(--orange);
  --ck-accent-hover: var(--orange-btn-h);
  --ck-bg:         var(--ghost);
  --ck-surface:    var(--white);
  --ck-border:     var(--line);

  /* Course Mode Badge Colors */
  --ck-mode-inperson: #00304D;
  --ck-mode-inperson-bg: #E2E8EE;
  --ck-mode-online: #2E6F97;
  --ck-mode-online-bg: #E0F2FE;
  --ck-mode-recorded: #B25A0C;
  --ck-mode-recorded-bg: #FEF3C7;

  /* Text Colors */
  --ck-text-main: #0F172A;
  --ck-text-muted: #64748B;
  --ck-text-subtle: #94A3B8;
  --ck-text-white: #FFFFFF;

  /* Shadows (Multi-layer soft elevation) */
  --ck-shadow-sm: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
  --ck-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
  --ck-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);
  --ck-shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.09), 0 8px 10px -6px rgba(15, 23, 42, 0.04);
  --ck-shadow-hover: 0 20px 30px -10px rgba(13, 148, 136, 0.15), 0 10px 15px -5px rgba(15, 23, 42, 0.06);

  /* Radius */
  --ck-radius-sm: 8px;
  --ck-radius-md: 12px;
  --ck-radius-lg: 16px;
  --ck-radius-xl: 24px;
  --ck-radius-full: 9999px;

  /* Transitions */
  --ck-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --ck-transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --ck-transition-smooth: 350ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Font Stack */
  --ck-font-family: 'Vazirmatn', 'Vazir', -apple-system, BlinkMacSystemFont, 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* ==========================================================================
   FONT FACE DEFINITIONS (VAZIRMATN & IRANYEKANX)
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap');

@font-face {
  font-family: 'Vazirmatn';
  src: url('assets/fonts/vazirmatn.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IranYekanX';
  src: url('assets/fonts/iranyekanx.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Base resets & typography */
html, body, button, input, select, textarea,
h1, h2, h3, h4, h5, h6,
.ck-hero-title, .ck-section-title, .ck-course-title,
.ck-brand-title, .ck-nav-link, .ck-btn,
.ck-filter-btn, .ck-stat-num, .ck-price-final {
  font-family: var(--ck-font-family) !important;
}

html {
  font-family: var(--ck-font-family);
  direction: rtl;
  text-align: right;
  scroll-behavior: smooth;
  box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--ck-bg);
  color: var(--ck-text-main);
  font-size: 15px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--ck-transition-fast);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

button, input, select, textarea {
  font-family: inherit;
}

/* ==========================================================================
   CHEKAH ACADEMY - MODERN VIDEO PLAYER & MEDIA SYSTEM (UI/UX PRO MAX)
   Scoped specifically to video elements (never affecting audio players)
   ========================================================================== */

/* 1. Master Responsive Video Card Container */
.wp-video,
div.wp-video,
.ck-video-card {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  margin: 36px auto !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background: #001829 !important;
  box-shadow: 0 14px 40px rgba(0, 35, 58, 0.18), 0 2px 8px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid rgba(0, 48, 77, 0.14) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}

.wp-video:hover,
.ck-video-card:hover {
  box-shadow: 0 20px 48px rgba(0, 35, 58, 0.24), 0 4px 14px rgba(233, 131, 34, 0.12) !important;
  border-color: rgba(233, 131, 34, 0.35) !important;
}

/* 2. MediaElement Container & Inner Positioning (Video Specific) */
.wp-video .mejs-container,
.ck-video-card .mejs-container,
.mejs-video.mejs-container,
.mejs-container:not(.mejs-audio):not(.wp-audio-shortcode) {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  margin: 0 !important;
  border: none !important;
  border-radius: inherit !important;
  box-shadow: none !important;
  background: transparent !important;
  overflow: hidden !important;
}

.mejs-video .mejs-inner,
.wp-video .mejs-inner,
.ck-video-card .mejs-inner,
.mejs-container:not(.mejs-audio):not(.wp-audio-shortcode) .mejs-inner {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
}

.mejs-video .mejs-mediaelement,
.wp-video .mejs-mediaelement,
.ck-video-card .mejs-mediaelement,
.mejs-container:not(.mejs-audio):not(.wp-audio-shortcode) .mejs-mediaelement {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
}

.wp-video video,
.mejs-mediaelement video,
.mejs-video video,
.mejs-container:not(.mejs-audio) video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* 3. Poster Image */
.mejs-video .mejs-layers,
.wp-video .mejs-layers,
.mejs-container:not(.mejs-audio) .mejs-layers {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.mejs-video .mejs-poster,
.wp-video .mejs-poster,
.mejs-container:not(.mejs-audio) .mejs-poster {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  z-index: 1 !important;
}

.mejs-poster img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* 4. Video Controls Bar (Positioned at Bottom with Universal LTR Flow) */
.mejs-video .mejs-controls,
.wp-video .mejs-controls,
.ck-video-card .mejs-controls,
.mejs-container:not(.mejs-audio):not(.wp-audio-shortcode) .mejs-controls {
  position: absolute !important;
  bottom: 0px !important;
  top: auto !important;
  left: 0px !important;
  right: 0px !important;
  width: 100% !important;
  height: 48px !important;
  direction: ltr !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 14px !important;
  box-sizing: border-box !important;
  background: linear-gradient(180deg, rgba(0, 35, 58, 0) 0%, rgba(0, 24, 41, 0.94) 100%) !important;
  border-bottom-left-radius: 18px !important;
  border-bottom-right-radius: 18px !important;
  z-index: 10 !important;
}

.mejs-video .mejs-controls *,
.wp-video .mejs-controls *,
.ck-video-card .mejs-controls *,
.mejs-container:not(.mejs-audio):not(.wp-audio-shortcode) .mejs-controls * {
  direction: ltr !important;
  box-sizing: border-box !important;
}

/* 5. Control Buttons (Play/Pause, Volume, Fullscreen) */
.mejs-video .mejs-controls .mejs-button,
.wp-video .mejs-controls .mejs-button,
.ck-video-card .mejs-controls .mejs-button {
  width: 34px !important;
  height: 34px !important;
  margin: 0 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.mejs-video .mejs-controls .mejs-button button,
.wp-video .mejs-controls .mejs-button button,
.ck-video-card .mejs-controls .mejs-button button {
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  background-color: transparent !important;
  border: none !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, filter 0.2s ease !important;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.4)) !important;
}

.mejs-video .mejs-controls .mejs-button button:hover,
.wp-video .mejs-controls .mejs-button button:hover,
.ck-video-card .mejs-controls .mejs-button button:hover {
  transform: scale(1.18) !important;
  filter: drop-shadow(0 2px 4px rgba(233, 131, 34, 0.6)) !important;
}

/* 6. Timeline & Chekah Orange Scrubber Rail */
.mejs-video .mejs-controls .mejs-time-rail,
.wp-video .mejs-controls .mejs-time-rail,
.ck-video-card .mejs-controls .mejs-time-rail {
  flex-grow: 1 !important;
  height: 24px !important;
  margin: 0 12px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  position: relative !important;
}

.mejs-video .mejs-controls .mejs-time-rail .mejs-time-total,
.wp-video .mejs-controls .mejs-time-rail .mejs-time-total,
.ck-video-card .mejs-controls .mejs-time-rail .mejs-time-total {
  height: 6px !important;
  margin: 0 !important;
  background: rgba(255, 255, 255, 0.24) !important;
  border-radius: 6px !important;
  width: 100% !important;
  position: relative !important;
  cursor: pointer !important;
}

.mejs-video .mejs-controls .mejs-time-rail .mejs-time-loaded,
.wp-video .mejs-controls .mejs-time-rail .mejs-time-loaded,
.ck-video-card .mejs-controls .mejs-time-rail .mejs-time-loaded {
  background: rgba(255, 255, 255, 0.42) !important;
  border-radius: 6px !important;
  height: 6px !important;
}

.mejs-video .mejs-controls .mejs-time-rail .mejs-time-current,
.wp-video .mejs-controls .mejs-time-rail .mejs-time-current,
.ck-video-card .mejs-controls .mejs-time-rail .mejs-time-current {
  background: linear-gradient(90deg, #E98322, #F4A460) !important;
  border-radius: 6px !important;
  height: 6px !important;
}

.mejs-video .mejs-controls .mejs-time-rail .mejs-time-handle,
.wp-video .mejs-controls .mejs-time-rail .mejs-time-handle,
.ck-video-card .mejs-controls .mejs-time-rail .mejs-time-handle {
  width: 14px !important;
  height: 14px !important;
  background: #FFFFFF !important;
  border: 2px solid #E98322 !important;
  border-radius: 50% !important;
  top: -4px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35) !important;
}

.mejs-video .mejs-controls .mejs-time-rail .mejs-time-float,
.wp-video .mejs-controls .mejs-time-rail .mejs-time-float,
.ck-video-card .mejs-controls .mejs-time-rail .mejs-time-float {
  background: #00233A !important;
  color: #FFFFFF !important;
  border-radius: 6px !important;
  border: 1px solid rgba(233, 131, 34, 0.4) !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 11px !important;
  padding: 2px 6px !important;
}

/* 7. Time Indicators */
.mejs-video .mejs-controls .mejs-time,
.wp-video .mejs-controls .mejs-time,
.ck-video-card .mejs-controls .mejs-time {
  color: #FFFFFF !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 0 4px !important;
  height: auto !important;
  line-height: 1 !important;
}

/* 8. Center Big Play Button Overlay */
.mejs-overlay-play {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  cursor: pointer !important;
  z-index: 4 !important;
}

.mejs-overlay-play .mejs-overlay-button {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: 76px !important;
  height: 76px !important;
  border-radius: 50% !important;
  background-color: rgba(233, 131, 34, 0.92) !important;
  box-shadow: 0 8px 30px rgba(233, 131, 34, 0.5), 0 0 0 10px rgba(233, 131, 34, 0.22) !important;
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.2s ease, box-shadow 0.25s ease !important;
}

.mejs-overlay-play:hover .mejs-overlay-button {
  transform: translate(-50%, -50%) scale(1.1) !important;
  background-color: #E98322 !important;
  box-shadow: 0 12px 38px rgba(233, 131, 34, 0.65), 0 0 0 16px rgba(233, 131, 34, 0.28) !important;
}

/* 9. Standalone HTML5 Video & Embeds (Aparat, YouTube) */
.wp-block-video,
video:not(.wp-video-shortcode):not(.mejs-container video) {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  object-fit: cover !important;
  box-shadow: 0 14px 40px rgba(0, 35, 58, 0.18), 0 2px 8px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid rgba(0, 48, 77, 0.14) !important;
  margin: 36px auto !important;
  display: block !important;
  background: #001829 !important;
}

.ck-video-embed,
.wp-block-embed-youtube .wp-block-embed__wrapper,
.wp-block-embed-aparat,
.embed-responsive {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  box-shadow: 0 14px 40px rgba(0, 35, 58, 0.16) !important;
  border: 1px solid rgba(0, 48, 77, 0.12) !important;
  margin: 36px auto !important;
  aspect-ratio: 16 / 9 !important;
}

.ck-video-embed iframe,
.wp-block-embed-youtube iframe,
.wp-block-embed-aparat iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}

/* 10. Spacing & Separation for Stacking Videos */
.wp-video + .wp-video,
.wp-video + p,
p + .wp-video,
.wp-block-video + .wp-block-video {
  margin-top: 36px !important;
}


/* ==========================================================================
   CHEKAH ACADEMY - MODERN AUDIO PLAYER SYSTEM (UI/UX PRO MAX)
   Dedicated isolated audio player styling matching Chekah brand aesthetics
   ========================================================================== */
.mejs-container.mejs-audio,
.wp-audio-shortcode.mejs-container,
.wp-block-audio .mejs-container {
  width: 100% !important;
  max-width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 24px 0 !important;
  background: linear-gradient(135deg, #00233a 0%, #001829 100%) !important;
  border: 1px solid rgba(233, 131, 34, 0.3) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 25px rgba(0, 35, 58, 0.15) !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  direction: ltr !important;
  z-index: 5 !important;
  clear: both !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.mejs-container.mejs-audio:hover,
.wp-audio-shortcode.mejs-container:hover {
  border-color: rgba(233, 131, 34, 0.55) !important;
  box-shadow: 0 14px 32px rgba(0, 35, 58, 0.22), 0 2px 10px rgba(233, 131, 34, 0.15) !important;
}

.mejs-container.mejs-audio .mejs-inner {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.mejs-container.mejs-audio .mejs-mediaelement {
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.mejs-container.mejs-audio .mejs-controls {
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  height: 56px !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  direction: ltr !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
  border-radius: 14px !important;
}

.mejs-container.mejs-audio .mejs-controls * {
  direction: ltr !important;
  box-sizing: border-box !important;
}

.mejs-container.mejs-audio .mejs-playpause-button {
  margin-right: 12px !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.mejs-container.mejs-audio .mejs-playpause-button button {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background-color: #e98322 !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(233, 131, 34, 0.45) !important;
  transition: all 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  display: block !important;
  margin: 0 !important;
  outline: none !important;
}

.mejs-container.mejs-audio .mejs-play button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") !important;
  background-size: 18px 18px !important;
}

.mejs-container.mejs-audio .mejs-pause button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M6 19h4V5H6v14zm8-14v14h4V5h-4z'/%3E%3C/svg%3E") !important;
  background-size: 18px 18px !important;
}

.mejs-container.mejs-audio .mejs-playpause-button button:hover {
  background-color: #f59e0b !important;
  transform: scale(1.08) !important;
  box-shadow: 0 6px 20px rgba(233, 131, 34, 0.65) !important;
}

.mejs-container.mejs-audio .mejs-time-rail {
  flex: 1 1 auto !important;
  margin: 0 12px !important;
  padding: 0 !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
}

.mejs-container.mejs-audio .mejs-time-total {
  margin: 0 !important;
  border-radius: 4px !important;
  background: rgba(255, 255, 255, 0.16) !important;
  height: 6px !important;
  width: 100% !important;
  position: relative !important;
  cursor: pointer !important;
}

.mejs-container.mejs-audio .mejs-time-loaded {
  background: rgba(255, 255, 255, 0.32) !important;
  border-radius: 4px !important;
  height: 6px !important;
}

.mejs-container.mejs-audio .mejs-time-current {
  background: linear-gradient(90deg, #e98322, #f59e0b) !important;
  border-radius: 4px !important;
  height: 6px !important;
}

.mejs-container.mejs-audio .mejs-time-handle {
  width: 14px !important;
  height: 14px !important;
  top: -4px !important;
  background: #e98322 !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.45) !important;
}

.mejs-container.mejs-audio .mejs-time-float {
  background: #00233a !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  border: 1px solid rgba(233, 131, 34, 0.4) !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 11px !important;
  padding: 2px 6px !important;
}

.mejs-container.mejs-audio .mejs-time {
  color: #ffffff !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 6px !important;
  height: auto !important;
  line-height: normal !important;
}

.mejs-container.mejs-audio .mejs-volume-button {
  margin-left: 8px !important;
  display: flex !important;
  align-items: center !important;
}

.mejs-container.mejs-audio .mejs-volume-button button {
  cursor: pointer !important;
  opacity: 0.85 !important;
  transition: opacity 0.2s ease, transform 0.2s ease !important;
}

.mejs-container.mejs-audio .mejs-volume-button button:hover {
  opacity: 1 !important;
  transform: scale(1.1) !important;
}

.mejs-container.mejs-audio .mejs-horizontal-volume-slider {
  height: 6px !important;
  width: 60px !important;
  background: rgba(255, 255, 255, 0.2) !important;
  border-radius: 3px !important;
  margin-left: 6px !important;
  position: relative !important;
}

.mejs-container.mejs-audio .mejs-horizontal-volume-current {
  background: #e98322 !important;
  border-radius: 3px !important;
  height: 100% !important;
}

@media (max-width: 640px) {
  .mejs-container.mejs-audio,
  .wp-audio-shortcode.mejs-container {
    height: 50px !important;
    min-height: 50px !important;
    padding: 0 8px !important;
    margin: 18px 0 !important;
    border-radius: 12px !important;
  }
  .mejs-container.mejs-audio .mejs-controls {
    height: 50px !important;
    padding: 0 8px !important;
  }
  .mejs-container.mejs-audio .mejs-time {
    font-size: 11px !important;
    padding: 0 3px !important;
  }
  .mejs-container.mejs-audio .mejs-horizontal-volume-slider {
    width: 36px !important;
  }
  .mejs-container.mejs-audio .mejs-time-rail {
    margin: 0 6px !important;
  }
}

/* ==========================================================================
   CHEKAH ACADEMY - COMPREHENSIVE UNIVERSAL MOBILE RESPONSIVE SYSTEM
   Ensures 100% Zero Horizontal Overflow across All Pages & Mobile Devices
   ========================================================================== */

/* 1. Global Viewport Overflow Guard - Fully Mobile Touch Compatible */
html {
  overflow-x: clip !important;
  overflow-y: auto !important;
  max-width: 100% !important;
}

body {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  max-width: 100% !important;
  width: 100% !important;
  position: relative !important;
  box-sizing: border-box !important;
  -webkit-text-size-adjust: 100% !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. Container Constraints (Boxed on Desktop, 100% on Mobile) */
.site,
#page,
.wrapper,
.content-wrapper,
.main-wrapper,
#wrapper {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.ck-container,
.container,
.wrap,
div.wrap {
  width: 100% !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 2.1. Hero Stats & Cheque Card High Contrast Styling */
.trust-row .trust-item b {
  color: #FFFFFF !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
}
.trust-row .trust-item span {
  color: rgba(255, 255, 255, 0.85) !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
.cheque-bank {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.cheque-bank .mark {
  background: #00233A !important;
  color: #E98322 !important;
  font-weight: 800 !important;
  font-size: 18px !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.cheque-bank b {
  color: #00233A !important;
  font-family: 'Vazirmatn', sans-serif !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  letter-spacing: -0.3px !important;
}
.cheque-no {
  color: #64748B !important;
  font-size: 11.5px !important;
}

@media (max-width: 768px) {
  .ck-container,
  .container,
  .wrap,
  div.wrap {
    max-width: 100% !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}

/* 3. Universal Text, Image, Table & Embed Containment */
img, video, iframe, embed, object {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

table,
.ck-article-content table,
.entry-content table {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  border-collapse: collapse !important;
  margin: 18px 0 !important;
}

pre, code {
  white-space: pre-wrap !important;
  word-break: break-all !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

h1, h2, h3, h4, h5, h6, p, a, span, li, blockquote {
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

/* 4. Article Hero & Breadcrumbs Responsive Formatting */
.ck-c-breadcrumbs,
.breadcrumbs,
.breadcrumb,
.rank-math-breadcrumb,
.woocommerce-breadcrumb {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 6px !important;
  font-size: 11.5px !important;
  line-height: 1.6 !important;
  max-width: 100% !important;
}

.ck-c-breadcrumbs a,
.ck-c-breadcrumbs span {
  display: inline !important;
  white-space: normal !important;
  word-break: break-word !important;
}

.ck-c-bc-current {
  display: inline !important;
  max-width: 100% !important;
  word-break: break-word !important;
}

@media (max-width: 768px) {
  .ck-article-hero {
    padding: 22px 0 18px 0 !important;
    overflow: hidden !important;
  }
  .ck-article-title,
  .entry-title,
  h1.entry-title {
    font-size: 20px !important;
    line-height: 1.4 !important;
    margin: 10px 0 14px 0 !important;
    word-break: break-word !important;
  }
  .ck-article-meta-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 10px !important;
    padding: 8px 12px !important;
    border-radius: 12px !important;
    font-size: 11px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .ck-art-meta-divider {
    display: none !important;
  }
  .ck-art-meta-item {
    font-size: 11px !important;
  }
}

/* 5. Article Grid & Sidebar Mobile Collapse */
@media (max-width: 1024px) {
  .ck-article-grid,
  .article-sidebar-grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 28px !important;
    box-sizing: border-box !important;
  }
  .ck-article-main-col {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 100% !important;
    box-sizing: border-box !important;
  }
  .ck-article-sidebar-col {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 100% !important;
    box-sizing: border-box !important;
  }
  .ck-article-sidebar {
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    top: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    box-sizing: border-box !important;
  }
  .ck-sidebar-widget,
  .ck-sidebar-promo-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 16px !important;
    padding: 22px 18px !important;
  }
  .ck-sidebar-widget form {
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .ck-sidebar-widget form input[type="search"] {
    min-height: 44px !important;
    font-size: 14px !important;
  }
  .ck-sidebar-widget form button {
    min-width: 48px !important;
    min-height: 44px !important;
  }
  .ck-article-card,
  .ck-article-card-clean {
    padding: 24px 18px !important;
    border-radius: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 600px) {
  .ck-article-layout-container {
    padding-top: 14px !important;
    padding-bottom: 40px !important;
  }
  .ck-article-card {
    padding: 16px 12px !important;
    border-radius: 14px !important;
    margin-bottom: 20px !important;
  }
  .ck-article-featured-img {
    margin-bottom: 18px !important;
    border-radius: 10px !important;
  }
  .ck-article-content {
    font-size: 14.5px !important;
    line-height: 1.95 !important;
  }
  .ck-article-content h2 {
    font-size: 17.5px !important;
    margin: 24px 0 12px 0 !important;
  }
  .ck-article-content h3 {
    font-size: 15.5px !important;
    margin: 20px 0 10px 0 !important;
  }
  .ck-comments-area {
    padding: 16px 12px !important;
    border-radius: 14px !important;
  }
  .ck-comment-card {
    padding: 12px 10px !important;
  }
}

/* 6. Product & Course Grids on Mobile */
@media (max-width: 768px) {
  .ck-grid-4,
  .ck-grid-3,
  .ck-catalog-grid,
  .ck-c-catalog-grid,
  .products.columns-4,
  .products.columns-3,
  ul.products {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .ck-course-hero-content,
  .ck-c-hero-content {
    padding: 24px 0 !important;
  }
  .ck-course-title,
  .ck-c-hero h1 {
    font-size: 21px !important;
    line-height: 1.4 !important;
  }
}

/* 7. Mobile Navigation & Header Sizing */
@media (max-width: 992px) {
  #site-header,
  .ck-exact-header {
    height: 60px !important;
  }
  .ck-header-container {
    height: 60px !important;
    padding: 0 14px !important;
  }
  .ck-nav-center {
    display: none !important;
  }
  .ck-account-link,
  .ck-divider {
    display: none !important;
  }
  .ck-mobile-btn {
    display: flex !important;
    width: 38px !important;
    height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .ck-logo-img {
    height: 36px !important;
    width: auto !important;
  }
  .ck-cart-pill {
    font-size: 11.5px !important;
    padding: 5px 8px !important;
  }
}

/* 8. Mobile Footer & CTA */
@media (max-width: 768px) {
  footer.site-chekah-footer .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }
  .cta-banner {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 26px 14px !important;
    gap: 16px !important;
  }
  .cta-banner h2 {
    font-size: 19px !important;
    line-height: 1.4 !important;
  }
  .cta-banner p {
    font-size: 13px !important;
  }
  .bottom-bar {
    flex-direction: column !important;
    text-align: center !important;
    gap: 8px !important;
  }
}

/* 9. Mobile Video Controls Responsiveness */
@media (max-width: 600px) {
  .wp-video,
  div.wp-video,
  .ck-video-card {
    margin: 20px auto !important;
    border-radius: 14px !important;
  }
  .mejs-video .mejs-controls,
  .wp-video .mejs-controls,
  .ck-video-card .mejs-controls {
    height: 42px !important;
    padding: 0 8px !important;
  }
  .mejs-controls .mejs-time-rail {
    margin: 0 6px !important;
  }
  .mejs-controls .mejs-button {
    width: 28px !important;
    height: 28px !important;
    margin: 0 1px !important;
  }
  .mejs-controls .mejs-button button {
    width: 17px !important;
    height: 17px !important;
  }
  .mejs-controls .mejs-time {
    font-size: 10px !important;
    padding: 0 2px !important;
    line-height: 42px !important;
  }
  .mejs-overlay-play .mejs-overlay-button {
    width: 58px !important;
    height: 58px !important;
  }
}

/* 10. Floating Contact Button Safe Margins */
@media (max-width: 600px) {
  .cepw,
  .whatsapp-btn,
  .call-float-btn,
  #ckWaFloating,
  #wa-chat-btn,
  .floating-wa {
    max-width: 58px !important;
    max-height: 58px !important;
  }
}

/* 11. Footer Mobile Responsive Styles */
@media (max-width: 768px) {
  footer.site-chekah-footer .wrap {
    padding: 0 20px !important;
  }
  footer.site-chekah-footer .footer-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px !important;
    width: 100% !important;
  }
  footer.site-chekah-footer .footer-grid > div {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  footer.site-chekah-footer .chekah-footer-social {
    max-width: 100% !important;
    width: 100% !important;
  }
  footer.site-chekah-footer .chekah-whatsapp-groups {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    margin-top: 14px !important;
  }
  footer.site-chekah-footer .chekah-whatsapp-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 10px 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 52px !important;
    max-height: none !important;
    bottom: auto !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
  }
  footer.site-chekah-footer .chekah-whatsapp-card__text {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  footer.site-chekah-footer .chekah-whatsapp-card__text strong {
    white-space: nowrap !important;
    font-size: 13px !important;
  }
  footer.site-chekah-footer .chekah-whatsapp-card__text small {
    white-space: nowrap !important;
    font-size: 10.5px !important;
  }
  footer.site-chekah-footer .chekah-whatsapp-card__arrow {
    margin-right: auto !important;
    font-size: 16px !important;
  }
  footer.site-chekah-footer .bottom-bar {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 8px !important;
  }
}

/* ==========================================================================
   CHEKAH WOOCOMMERCE CART & CHECKOUT REDESIGN
   ========================================================================== */
/**
 * Chekah Academy - WooCommerce Cart & Checkout Redesign Stylesheet
 * Brand Colors: Prussian Blue (#00304D), Tiger Orange (#E98322), Deep Amber (#B25A0C)
 * Typography: Vazirmatn
 */

:root {
	--ck-navy: #00304D;
	--ck-navy-dark: #002238;
	--ck-navy-light: #0A3D5E;
	--ck-orange: #E98322;
	--ck-orange-dark: #B25A0C;
	--ck-orange-light: #FFF7ED;
	--ck-orange-border: #FED7AA;
	--ck-green: #059669;
	--ck-green-light: #ECFDF5;
	--ck-green-border: #A7F3D0;
	--ck-card-bg: #FFFFFF;
	--ck-border: #E2E8F0;
	--ck-border-dark: #CBD5E1;
	--ck-text: #1E293B;
	--ck-muted: #64748B;
	--ck-radius-xl: 20px;
	--ck-radius-lg: 16px;
	--ck-radius-md: 12px;
	--ck-radius-sm: 8px;
	--ck-shadow-sm: 0 2px 4px rgba(0, 48, 77, 0.04);
	--ck-shadow-md: 0 10px 25px -5px rgba(0, 48, 77, 0.07), 0 4px 6px -2px rgba(0, 48, 77, 0.03);
	--ck-shadow-lg: 0 20px 35px -5px rgba(0, 48, 77, 0.1), 0 8px 10px -4px rgba(0, 48, 77, 0.04);
}

/* Force Vazirmatn font on all WooCommerce cart and checkout elements */
.woocommerce-cart,
.woocommerce-checkout,
.woocommerce-cart *,
.woocommerce-checkout * {
	font-family: 'Vazirmatn', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	box-sizing: border-box;
}

/* Page wrapper container adjustments */
.woocommerce-cart .page-wrapper,
.woocommerce-checkout .page-wrapper {
	max-width: 1220px !important;
	margin: 0 auto !important;
	padding: 30px 20px 80px !important;
}

.woocommerce-cart .entry-header,
.woocommerce-checkout .entry-header {
	margin-bottom: 25px !important;
	text-align: center !important;
}

.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title {
	font-size: 28px !important;
	font-weight: 900 !important;
	color: var(--ck-navy) !important;
	text-align: center;
	margin: 0 0 10px 0 !important;
}

/* ==========================================================================
   1. Modern 3-Step Checkout Stepper Pipeline
   ========================================================================== */
.ck-checkout-stepper-container {
	margin: 0 auto 35px;
	max-width: 760px;
	width: 100%;
}

.ck-checkout-stepper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #ffffff;
	padding: 16px 28px;
	border-radius: var(--ck-radius-lg);
	border: 1px solid var(--ck-border);
	box-shadow: var(--ck-shadow-sm);
}

.ck-stepper-item {
	display: flex;
	align-items: center;
	gap: 12px;
	position: relative;
	z-index: 2;
}

.ck-stepper-circle {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	font-weight: 800;
	background: #F1F5F9;
	color: var(--ck-muted);
	border: 2px solid var(--ck-border);
	transition: all 0.3s ease;
}

.ck-stepper-item.active .ck-stepper-circle {
	background: linear-gradient(135deg, var(--ck-orange) 0%, var(--ck-orange-dark) 100%);
	color: #ffffff;
	border-color: var(--ck-orange);
	box-shadow: 0 0 0 4px rgba(233, 131, 34, 0.2);
}

.ck-stepper-item.completed .ck-stepper-circle {
	background: var(--ck-green);
	color: #ffffff;
	border-color: var(--ck-green);
}

.ck-step-icon {
	width: 18px;
	height: 18px;
}

.ck-stepper-content {
	display: flex;
	flex-direction: column;
}

.ck-stepper-title {
	font-size: 14px;
	font-weight: 700;
	color: var(--ck-muted);
}

.ck-stepper-item.active .ck-stepper-title {
	color: var(--ck-navy);
	font-weight: 800;
}

.ck-stepper-item.completed .ck-stepper-title {
	color: var(--ck-navy);
}

.ck-stepper-desc {
	font-size: 11px;
	color: #94A3B8;
	margin-top: 2px;
}

.ck-stepper-line {
	flex: 1;
	height: 2px;
	background: #E2E8F0;
	margin: 0 16px;
	position: relative;
	transition: all 0.3s ease;
}

.ck-stepper-line.active {
	background: var(--ck-green);
}

/* ==========================================================================
   2. Modern WooCommerce Notices & Alerts
   ========================================================================== */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	padding: 16px 20px !important;
	border-radius: var(--ck-radius-md) !important;
	font-size: 14px !important;
	line-height: 1.8 !important;
	margin-bottom: 25px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: wrap !important;
	gap: 12px !important;
	box-shadow: var(--ck-shadow-sm) !important;
	width: 100% !important;
}

.woocommerce-message {
	background: var(--ck-green-light) !important;
	border: 1px solid var(--ck-green-border) !important;
	border-right: 5px solid var(--ck-green) !important;
	color: #065F46 !important;
}

.woocommerce-info {
	background: #EFF6FF !important;
	border: 1px solid #BFDBFE !important;
	border-right: 5px solid #2563EB !important;
	color: #1E40AF !important;
}

.woocommerce-error {
	background: #FEF2F2 !important;
	border: 1px solid #FECACA !important;
	border-right: 5px solid #DC2626 !important;
	color: #991B1B !important;
	list-style: none !important;
}

.woocommerce-message .button,
.woocommerce-info .button {
	background: var(--ck-navy) !important;
	color: #ffffff !important;
	border-radius: 8px !important;
	padding: 9px 18px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	text-decoration: none !important;
	transition: all 0.2s ease !important;
	border: none !important;
	float: none !important;
	display: inline-block !important;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover {
	background: var(--ck-orange) !important;
	color: #ffffff !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(233, 131, 34, 0.25);
}

/* ==========================================================================
   3. Cart Page 2-Column Responsive Layout
   ========================================================================== */
.woocommerce-cart .woocommerce {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 30px !important;
	align-items: flex-start !important;
}

.woocommerce-cart .woocommerce-cart-form {
	flex: 1 1 64% !important;
	min-width: 320px !important;
	background: #ffffff;
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius-lg);
	box-shadow: var(--ck-shadow-md);
	padding: 24px;
	overflow: hidden;
}

.woocommerce-cart .cart-collaterals {
	flex: 0 0 33% !important;
	min-width: 300px !important;
	position: sticky;
	top: 90px;
	z-index: 10;
}

/* Cart Table Reset and Modern Styles */
.woocommerce-cart-form table.shop_table {
	width: 100% !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	border: none !important;
	margin: 0 !important;
}

.woocommerce-cart-form table.shop_table thead {
	background: #F8FAFC !important;
	border-bottom: 2px solid var(--ck-border) !important;
}

.woocommerce-cart-form table.shop_table thead th {
	padding: 14px 16px !important;
	color: var(--ck-navy) !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	border: none !important;
	text-align: right !important;
}

.woocommerce-cart-form table.shop_table tbody td {
	padding: 20px 16px !important;
	vertical-align: middle !important;
	border-top: none !important;
	border-bottom: 1px solid #F1F5F9 !important;
}

/* Remove Item Button */
.woocommerce-cart-form .product-remove a.remove {
	width: 32px !important;
	height: 32px !important;
	line-height: 28px !important;
	border-radius: 50% !important;
	background: #FEE2E2 !important;
	color: #EF4444 !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-decoration: none !important;
	transition: all 0.2s ease !important;
}

.woocommerce-cart-form .product-remove a.remove:hover {
	background: #EF4444 !important;
	color: #ffffff !important;
	transform: scale(1.1);
}

/* Product Thumbnail */
.woocommerce-cart-form .product-thumbnail {
	width: 90px !important;
}

.woocommerce-cart-form .product-thumbnail img {
	width: 76px !important;
	height: 56px !important;
	object-fit: cover !important;
	border-radius: var(--ck-radius-sm) !important;
	border: 1px solid var(--ck-border) !important;
	box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
}

/* Product Title & Meta */
.woocommerce-cart-form .product-name a {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--ck-navy) !important;
	text-decoration: none !important;
	transition: color 0.2s ease;
	line-height: 1.6;
	display: block;
}

.woocommerce-cart-form .product-name a:hover {
	color: var(--ck-orange) !important;
}

/* Product Prices */
.woocommerce-cart-form .product-price .amount,
.woocommerce-cart-form .product-subtotal .amount {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--ck-text) !important;
	white-space: nowrap !important;
}

.woocommerce-cart-form .product-subtotal .amount {
	color: var(--ck-orange-dark) !important;
	font-size: 16px !important;
	font-weight: 900 !important;
}

/* Custom Quantity Stepper */
.woocommerce-cart-form .product-quantity .quantity {
	display: inline-flex !important;
	align-items: center !important;
	border: 1.5px solid var(--ck-border-dark) !important;
	border-radius: 8px !important;
	background: #ffffff !important;
	overflow: hidden;
}

.woocommerce-cart-form .product-quantity input.qty {
	width: 44px !important;
	height: 36px !important;
	text-align: center !important;
	border: none !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--ck-navy) !important;
	background: transparent !important;
	padding: 0 !important;
}

.woocommerce-cart-form .product-quantity input.qty::-webkit-inner-spin-button,
.woocommerce-cart-form .product-quantity input.qty::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.ck-qty-btn {
	width: 32px;
	height: 36px;
	background: #F8FAFC;
	border: none;
	cursor: pointer;
	font-size: 17px;
	font-weight: 800;
	color: var(--ck-navy);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s ease;
	user-select: none;
}

.ck-qty-btn:hover {
	background: #E2E8F0;
	color: var(--ck-orange);
}

/* Actions Row (Coupon & Update Cart) */
.woocommerce-cart-form td.actions {
	padding: 24px 16px 16px !important;
	border-bottom: none !important;
	background: #FAFCFE;
	border-radius: var(--ck-radius-md);
	margin-top: 15px;
}

.woocommerce-cart-form .actions .coupon {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	float: right !important;
}

.woocommerce-cart-form .actions .coupon input.input-text {
	width: 220px !important;
	height: 44px !important;
	padding: 0 16px !important;
	border: 1.5px solid var(--ck-border-dark) !important;
	border-radius: var(--ck-radius-sm) !important;
	font-size: 13px !important;
	color: var(--ck-text) !important;
	background: #ffffff !important;
	transition: all 0.2s ease;
}

.woocommerce-cart-form .actions .coupon input.input-text:focus {
	border-color: var(--ck-orange) !important;
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(233, 131, 34, 0.15) !important;
}

.woocommerce-cart-form .actions .coupon button.button {
	height: 44px !important;
	padding: 0 20px !important;
	background: var(--ck-navy) !important;
	color: #ffffff !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	border-radius: var(--ck-radius-sm) !important;
	border: none !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

.woocommerce-cart-form .actions .coupon button.button:hover {
	background: var(--ck-orange) !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(233, 131, 34, 0.25);
}

.woocommerce-cart-form .actions button[name="update_cart"] {
	height: 44px !important;
	padding: 0 20px !important;
	background: #F1F5F9 !important;
	color: var(--ck-muted) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	border-radius: var(--ck-radius-sm) !important;
	border: 1px solid var(--ck-border) !important;
	float: left !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

.woocommerce-cart-form .actions button[name="update_cart"]:not([disabled]) {
	background: var(--ck-orange) !important;
	color: #ffffff !important;
	border-color: var(--ck-orange) !important;
}

/* ==========================================================================
   4. Cart Collaterals / Totals Card
   ========================================================================== */
.cart-collaterals .cart_totals {
	width: 100% !important;
	float: none !important;
	background: #ffffff !important;
	border: 1px solid var(--ck-border) !important;
	border-radius: var(--ck-radius-lg) !important;
	box-shadow: var(--ck-shadow-md) !important;
	padding: 24px !important;
	margin: 0 !important;
}

.cart-collaterals .cart_totals h2 {
	font-size: 18px !important;
	font-weight: 900 !important;
	color: var(--ck-navy) !important;
	margin: 0 0 20px 0 !important;
	padding-bottom: 12px !important;
	border-bottom: 2px solid var(--ck-border) !important;
	display: flex;
	align-items: center;
	gap: 8px;
}

.cart-collaterals table.shop_table {
	width: 100% !important;
	border: none !important;
	border-collapse: collapse !important;
	margin-bottom: 20px !important;
}

.cart-collaterals table.shop_table th {
	font-size: 14px !important;
	color: var(--ck-muted) !important;
	font-weight: 600 !important;
	padding: 12px 0 !important;
	border: none !important;
	text-align: right !important;
}

.cart-collaterals table.shop_table td {
	font-size: 15px !important;
	color: var(--ck-text) !important;
	font-weight: 700 !important;
	padding: 12px 0 !important;
	border: none !important;
	text-align: left !important;
	white-space: nowrap !important;
}

.cart-collaterals table.shop_table tr.order-total {
	border-top: 1px dashed var(--ck-border) !important;
}

.cart-collaterals table.shop_table tr.order-total th {
	font-size: 16px !important;
	color: var(--ck-navy) !important;
	font-weight: 800 !important;
	padding-top: 16px !important;
}

.cart-collaterals table.shop_table tr.order-total td strong .amount {
	font-size: 20px !important;
	color: var(--ck-orange-dark) !important;
	font-weight: 900 !important;
}

/* Proceed to Checkout Button */
.wc-proceed-to-checkout {
	padding: 0 !important;
	margin-bottom: 16px !important;
}

.wc-proceed-to-checkout a.checkout-button,
a.checkout-button.button.alt,
.cart-collaterals .checkout-button {
	width: 100% !important;
	height: 54px !important;
	background: linear-gradient(135deg, #E98322 0%, #B25A0C 100%) !important;
	background-color: #E98322 !important;
	color: #ffffff !important;
	font-size: 17px !important;
	font-weight: 900 !important;
	border-radius: var(--ck-radius-md) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	text-decoration: none !important;
	box-shadow: 0 10px 24px rgba(233, 131, 34, 0.4) !important;
	transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
	border: none !important;
	cursor: pointer !important;
	opacity: 1 !important;
}

.wc-proceed-to-checkout a.checkout-button:hover,
a.checkout-button.button.alt:hover,
.cart-collaterals .checkout-button:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 14px 28px rgba(233, 131, 34, 0.5) !important;
	background: linear-gradient(135deg, #f58f33 0%, #E98322 100%) !important;
	color: #ffffff !important;
}

/* ==========================================================================
   5. Trust & Security Badges Card
   ========================================================================== */
.ck-trust-badges-card {
	background: #FAFCFE;
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius-md);
	padding: 16px;
	margin-top: 15px;
}

.ck-trust-badge-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #F1F5F9;
}

.ck-trust-badge-item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.ck-trust-badge-item:first-child {
	padding-top: 0;
}

.ck-trust-badge-icon {
	width: 32px;
	height: 32px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.ck-trust-badge-icon svg {
	width: 17px;
	height: 17px;
}

.ck-trust-badge-icon.lock {
	background: #ECFDF5;
	color: #059669;
}

.ck-trust-badge-icon.zap {
	background: #FFF7ED;
	color: #EA580C;
}

.ck-trust-badge-icon.support {
	background: #EFF6FF;
	color: #2563EB;
}

.ck-trust-badge-info {
	display: flex;
	flex-direction: column;
}

.ck-trust-badge-info strong {
	font-size: 12px;
	color: var(--ck-navy);
	font-weight: 700;
}

.ck-trust-badge-info span {
	font-size: 11px;
	color: var(--ck-muted);
	margin-top: 2px;
	line-height: 1.5;
}

/* ==========================================================================
   6. Empty Cart Experience
   ========================================================================== */
.ck-empty-cart-card {
	background: #ffffff;
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius-xl);
	box-shadow: var(--ck-shadow-md);
	padding: 60px 30px;
	text-align: center;
	max-width: 680px;
	margin: 20px auto 40px;
}

.ck-empty-cart-icon {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: var(--ck-orange-light);
	color: var(--ck-orange);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 24px;
	border: 1px solid var(--ck-orange-border);
}

.ck-empty-cart-icon svg {
	width: 40px;
	height: 40px;
}

.ck-empty-cart-title {
	font-size: 22px;
	font-weight: 900;
	color: var(--ck-navy);
	margin: 0 0 12px;
}

.ck-empty-cart-subtitle {
	font-size: 15px;
	color: var(--ck-muted);
	line-height: 1.8;
	margin: 0 auto 30px;
	max-width: 520px;
}

.ck-empty-cart-actions {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	flex-wrap: wrap;
}

.ck-btn-primary {
	background: linear-gradient(135deg, var(--ck-orange) 0%, var(--ck-orange-dark) 100%);
	color: #ffffff !important;
	padding: 13px 26px;
	border-radius: var(--ck-radius-md);
	font-size: 15px;
	font-weight: 800;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	box-shadow: 0 8px 18px rgba(233, 131, 34, 0.35);
	transition: all 0.2s ease;
}

.ck-btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px rgba(233, 131, 34, 0.45);
	color: #ffffff !important;
}

.ck-btn-secondary {
	background: #F1F5F9;
	color: var(--ck-navy) !important;
	padding: 13px 24px;
	border-radius: var(--ck-radius-md);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	border: 1px solid var(--ck-border);
	transition: all 0.2s ease;
}

.ck-btn-secondary:hover {
	background: #E2E8F0;
	color: var(--ck-navy) !important;
}

.ck-arrow-icon {
	width: 16px;
	height: 16px;
	transform: rotate(180deg);
}

/* ==========================================================================
   7. Checkout Page 2-Column Responsive Layout
   ========================================================================== */
.woocommerce-checkout form.checkout {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 30px !important;
	align-items: flex-start !important;
}

/* Customer details column (Right) */
.woocommerce-checkout #customer_details {
	flex: 1 1 56% !important;
	min-width: 320px !important;
	float: none !important;
	width: auto !important;
}

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	float: none !important;
	width: 100% !important;
	padding: 0 !important;
}

/* Billing Fields Card */
.woocommerce-billing-fields,
.woocommerce-additional-fields {
	background: #ffffff;
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius-lg);
	box-shadow: var(--ck-shadow-md);
	padding: 26px;
	margin-bottom: 25px;
}

.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3 {
	font-size: 18px !important;
	font-weight: 900 !important;
	color: var(--ck-navy) !important;
	margin: 0 0 20px 0 !important;
	padding-bottom: 12px !important;
	border-bottom: 2px solid var(--ck-border) !important;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Checkout Form Inputs */
.woocommerce-billing-fields .form-row,
.woocommerce-additional-fields .form-row {
	margin-bottom: 18px !important;
	padding: 0 !important;
}

.woocommerce-billing-fields label,
.woocommerce-additional-fields label {
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--ck-navy) !important;
	margin-bottom: 6px !important;
	display: block;
}

.woocommerce-billing-fields .required,
.woocommerce-additional-fields .required {
	color: #EF4444 !important;
	font-weight: 900 !important;
	margin-right: 4px;
}

.woocommerce-billing-fields input.input-text,
.woocommerce-billing-fields select,
.woocommerce-additional-fields textarea {
	width: 100% !important;
	height: 48px !important;
	border: 1.5px solid var(--ck-border-dark) !important;
	border-radius: var(--ck-radius-sm) !important;
	padding: 0 16px !important;
	font-size: 14px !important;
	color: var(--ck-text) !important;
	background: #ffffff !important;
	transition: all 0.2s ease !important;
}

.woocommerce-additional-fields textarea {
	height: 96px !important;
	padding: 12px 16px !important;
	line-height: 1.6 !important;
	resize: vertical;
}

.woocommerce-billing-fields input.input-text:focus,
.woocommerce-billing-fields select:focus,
.woocommerce-additional-fields textarea:focus {
	border-color: var(--ck-orange) !important;
	box-shadow: 0 0 0 3px rgba(233, 131, 34, 0.15) !important;
	outline: none !important;
}

/* Select2 Dropdown Styling */
.select2-container--default .select2-selection--single {
	height: 48px !important;
	border: 1.5px solid var(--ck-border-dark) !important;
	border-radius: var(--ck-radius-sm) !important;
	display: flex !important;
	align-items: center !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 48px !important;
	color: var(--ck-text) !important;
	font-size: 14px !important;
	padding-right: 16px !important;
}

/* Order Review Column (Left / Sticky) */
.woocommerce-checkout #order_review_heading {
	display: none !important;
}

.woocommerce-checkout #order_review {
	flex: 0 0 41% !important;
	min-width: 320px !important;
	position: sticky;
	top: 90px;
	z-index: 10;
	background: #ffffff;
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius-lg);
	box-shadow: var(--ck-shadow-md);
	padding: 26px;
}

/* Order Review Table */
#order_review table.woocommerce-checkout-review-order-table {
	width: 100% !important;
	border: none !important;
	border-collapse: collapse !important;
	margin-bottom: 20px !important;
}

#order_review table.woocommerce-checkout-review-order-table thead th {
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--ck-navy) !important;
	padding: 0 0 14px 0 !important;
	border-bottom: 2px solid var(--ck-border) !important;
	text-align: right !important;
}

#order_review table.woocommerce-checkout-review-order-table tbody td {
	padding: 14px 0 !important;
	border-bottom: 1px solid #F1F5F9 !important;
	font-size: 14px !important;
}

#order_review table.woocommerce-checkout-review-order-table .product-name {
	font-weight: 700 !important;
	color: var(--ck-navy) !important;
	line-height: 1.6;
}

#order_review table.woocommerce-checkout-review-order-table .product-quantity {
	background: #F1F5F9;
	color: var(--ck-muted);
	font-size: 12px;
	font-weight: 800;
	padding: 2px 8px;
	border-radius: 6px;
	margin-right: 6px;
	display: inline-block;
}

#order_review table.woocommerce-checkout-review-order-table .product-total {
	font-weight: 800 !important;
	color: var(--ck-text) !important;
	text-align: left !important;
	white-space: nowrap !important;
}

#order_review table.woocommerce-checkout-review-order-table tfoot th {
	font-size: 14px !important;
	color: var(--ck-muted) !important;
	padding: 10px 0 !important;
	border: none !important;
	text-align: right !important;
}

#order_review table.woocommerce-checkout-review-order-table tfoot td {
	font-size: 14px !important;
	color: var(--ck-text) !important;
	padding: 10px 0 !important;
	border: none !important;
	text-align: left !important;
	font-weight: 700 !important;
	white-space: nowrap !important;
}

#order_review table.woocommerce-checkout-review-order-table tfoot tr.order-total th {
	font-size: 16px !important;
	font-weight: 900 !important;
	color: var(--ck-navy) !important;
	border-top: 1px dashed var(--ck-border) !important;
	padding-top: 16px !important;
}

#order_review table.woocommerce-checkout-review-order-table tfoot tr.order-total td {
	border-top: 1px dashed var(--ck-border) !important;
	padding-top: 16px !important;
	white-space: nowrap !important;
}

#order_review table.woocommerce-checkout-review-order-table tfoot tr.order-total strong .amount {
	font-size: 20px !important;
	font-weight: 900 !important;
	color: var(--ck-orange-dark) !important;
	white-space: nowrap !important;
}

/* Payment Gateway Selector */
#order_review #payment {
	background: transparent !important;
	border-radius: 0 !important;
	padding: 0 !important;
}

#order_review #payment ul.payment_methods {
	padding: 0 !important;
	border: none !important;
	margin: 0 0 20px 0 !important;
	list-style: none !important;
}

#order_review #payment ul.payment_methods li {
	margin-bottom: 12px !important;
	border: 1.5px solid var(--ck-border) !important;
	border-radius: var(--ck-radius-md) !important;
	padding: 14px 16px !important;
	background: #FAFCFE !important;
	transition: all 0.2s ease !important;
	cursor: pointer;
}

#order_review #payment ul.payment_methods li:hover {
	border-color: var(--ck-border-dark) !important;
}

#order_review #payment ul.payment_methods li.selected,
#order_review #payment ul.payment_methods li input[type="radio"]:checked + label {
	border-color: var(--ck-orange) !important;
	background: var(--ck-orange-light) !important;
}

#order_review #payment ul.payment_methods li label {
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--ck-navy) !important;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

#order_review #payment ul.payment_methods li input[type="radio"] {
	margin-left: 10px !important;
	accent-color: var(--ck-orange) !important;
	width: 18px;
	height: 18px;
}

#order_review #payment ul.payment_methods li div.payment_box {
	background: #ffffff !important;
	border: 1px solid var(--ck-border) !important;
	border-radius: var(--ck-radius-sm) !important;
	padding: 12px 14px !important;
	margin: 12px 0 0 0 !important;
	font-size: 13px !important;
	color: var(--ck-muted) !important;
	line-height: 1.7 !important;
}

#order_review #payment ul.payment_methods li div.payment_box::before {
	display: none !important;
}

/* Place Order Submit Button */
#order_review #place_order,
#place_order,
.woocommerce-checkout #place_order,
.woocommerce-checkout button#place_order,
.woocommerce-checkout input#place_order,
#order_review button.button.alt,
#order_review input.button.alt {
	width: 100% !important;
	height: 56px !important;
	background: linear-gradient(135deg, #E98322 0%, #B25A0C 100%) !important;
	background-color: #E98322 !important;
	color: #ffffff !important;
	font-size: 18px !important;
	font-weight: 900 !important;
	border-radius: var(--ck-radius-md) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	text-decoration: none !important;
	box-shadow: 0 10px 24px rgba(233, 131, 34, 0.4) !important;
	transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
	border: none !important;
	cursor: pointer !important;
	opacity: 1 !important;
}

#order_review #place_order:hover,
#place_order:hover,
.woocommerce-checkout #place_order:hover,
#order_review button.button.alt:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 14px 28px rgba(233, 131, 34, 0.5) !important;
	background: linear-gradient(135deg, #f58f33 0%, #E98322 100%) !important;
	color: #ffffff !important;
}

/* Terms and Conditions Checkbox */
.woocommerce-privacy-policy-text,
.woocommerce-terms-and-conditions-wrapper {
	font-size: 12px !important;
	color: var(--ck-muted) !important;
	line-height: 1.7 !important;
	margin-bottom: 16px !important;
}

.woocommerce-terms-and-conditions-checkbox-text {
	font-size: 13px !important;
	color: var(--ck-navy) !important;
	font-weight: 600 !important;
}

/* ==========================================================================
   8. Mobile & Tablet Responsiveness (< 992px)
   ========================================================================== */
@media (max-width: 991px) {
	.woocommerce-cart .woocommerce,
	.woocommerce-checkout form.checkout {
		flex-direction: column !important;
		gap: 24px !important;
	}

	.woocommerce-cart .woocommerce-cart-form,
	.woocommerce-cart .cart-collaterals,
	.woocommerce-checkout #customer_details,
	.woocommerce-checkout #order_review {
		flex: 1 1 100% !important;
		width: 100% !important;
		position: static !important;
	}

	.ck-checkout-stepper {
		padding: 14px 18px;
	}

	.ck-stepper-desc {
		display: none;
	}
}

@media (max-width: 640px) {
	.ck-checkout-stepper {
		padding: 10px 12px;
	}

	.ck-stepper-title {
		font-size: 12px;
	}

	.ck-stepper-circle {
		width: 32px;
		height: 32px;
		font-size: 13px;
	}

	.ck-stepper-line {
		margin: 0 8px;
	}

	.woocommerce-cart .woocommerce-cart-form {
		padding: 16px 12px;
	}

	.woocommerce-cart-form table.shop_table thead {
		display: none !important;
	}

	.woocommerce-cart-form table.shop_table tr.cart_item {
		display: block !important;
		background: #FAFCFE;
		border: 1px solid var(--ck-border);
		border-radius: var(--ck-radius-md);
		padding: 16px !important;
		margin-bottom: 16px !important;
		position: relative;
	}

	.woocommerce-cart-form table.shop_table td {
		padding: 6px 0 !important;
		border: none !important;
		display: block !important;
		text-align: right !important;
	}

	.woocommerce-cart-form table.shop_table td::before {
		display: none !important;
	}

	.woocommerce-cart-form .product-remove {
		position: absolute !important;
		top: 14px !important;
		left: 14px !important;
	}

	.woocommerce-cart-form .product-thumbnail {
		float: right;
		margin-left: 12px;
		width: 68px !important;
	}

	.woocommerce-cart-form .product-thumbnail img {
		width: 64px !important;
		height: 48px !important;
	}

	.woocommerce-cart-form .product-name {
		padding-left: 40px !important;
		min-height: 52px;
	}

	.woocommerce-cart-form .product-price {
		clear: both;
		padding-top: 10px !important;
		font-size: 14px !important;
	}

	.woocommerce-cart-form .product-quantity {
		display: inline-block !important;
		margin-top: 8px !important;
	}

	.woocommerce-cart-form .product-subtotal {
		float: left !important;
		margin-top: 10px !important;
	}

	.woocommerce-cart-form .actions .coupon {
		width: 100% !important;
		flex-direction: column !important;
		float: none !important;
	}

	.woocommerce-cart-form .actions .coupon input.input-text {
		width: 100% !important;
	}

	.woocommerce-cart-form .actions .coupon button.button {
		width: 100% !important;
	}

	.woocommerce-cart-form .actions button[name="update_cart"] {
		width: 100% !important;
		margin-top: 10px !important;
		float: none !important;
	}
}

/* Checkout Mobile Responsiveness Overhauls (< 768px) */
@media (max-width: 768px) {
	.woocommerce-checkout .woocommerce {
		padding: 0 4px !important;
	}

	.woocommerce-checkout #customer_details,
	.woocommerce-checkout #order_review {
		min-width: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		padding: 18px 14px !important;
		margin-bottom: 20px !important;
	}

	.woocommerce-billing-fields,
	.woocommerce-additional-fields {
		padding: 18px 14px !important;
		border-radius: var(--ck-radius-md) !important;
		box-sizing: border-box !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.woocommerce-billing-fields .form-row-first,
	.woocommerce-billing-fields .form-row-last,
	.woocommerce-billing-fields .form-row-wide,
	.woocommerce form .form-row-first,
	.woocommerce form .form-row-last {
		float: none !important;
		width: 100% !important;
		clear: both !important;
		margin-bottom: 14px !important;
	}

	.woocommerce-billing-fields input.input-text,
	.woocommerce-billing-fields select,
	.woocommerce-additional-fields textarea,
	.select2-container--default .select2-selection--single {
		font-size: 14px !important;
		height: 46px !important;
		box-sizing: border-box !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	#order_review table.woocommerce-checkout-review-order-table th,
	#order_review table.woocommerce-checkout-review-order-table td {
		padding: 10px 4px !important;
		font-size: 13px !important;
	}

	.woocommerce-checkout #order_review ul.payment_methods {
		padding: 0 !important;
	}

	.woocommerce-checkout #order_review .payment_box {
		padding: 12px 14px !important;
		font-size: 12.5px !important;
	}

	.woocommerce-checkout button#place_order {
		font-size: 16px !important;
		height: 50px !important;
	}

	.woocommerce-NoticeGroup,
	.woocommerce-error,
	.woocommerce-info,
	.woocommerce-message {
		box-sizing: border-box !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		font-size: 13px !important;
		padding: 12px 16px !important;
	}
}

/* ==========================================================================
   GLOBAL FIXES & POLISH
   ========================================================================== */
html, body {
	overflow-x: hidden !important;
	max-width: 100vw !important;
}

/* 2.1 Missing Space Around double-line spans */
.double-line {
	margin: 0 0.35em !important;
	display: inline-block !important;
	vertical-align: baseline !important;
}

/* 2.4 Orphan course card centered on desktop */
@media (min-width: 992px) {
	.course-grid > .course-card:last-child:nth-child(3n + 1) {
		grid-column: 2 !important;
	}
}

/* 3.1 Instructor Avatar dimensions */
.inst-card .avatar {
	width: 90px !important;
	height: 90px !important;
	border-radius: 50% !important;
	object-fit: cover !important;
}

/* 3.2 Cheque card mobile containment */
@media (max-width: 768px) {
	.cheque-wrap {
		overflow: hidden !important;
		max-width: 100% !important;
		margin: 0 auto !important;
	}
	.cheque {
		transform: none !important;
		max-width: 100% !important;
	}
	.cheque-perf {
		display: none !important;
	}
	.float-badge {
		position: static !important;
		margin: 12px auto 0 !important;
		display: inline-flex !important;
	}
}

/* =========================================================
   CHEKAH ACADEMY - MOBILE SCROLL & RESPONSIVE HEADER FIXES
   ========================================================= */

/* Mobile Smooth Touch Scrolling (W3C standard) */
html {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-behavior: smooth;
  height: auto !important;
}

body {
  overflow-x: clip !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 100vh;
  position: relative;
  height: auto !important;
}

/* Responsive Header on Mobile (<= 992px) */
@media (max-width: 992px) {
  #site-header,
  .ck-exact-header {
    height: 60px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .ck-header-container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    height: 60px !important;
  }

  .ck-logo-box {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
  }

  .ck-logo-box .ck-logo-img {
    height: 38px !important;
    width: auto !important;
    display: block !important;
  }

  .ck-nav-center {
    display: none !important;
  }

  .ck-actions-left {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-direction: row-reverse !important;
    flex-shrink: 0 !important;
  }

  /* Hide stray p tags injected by wpautop */
  .ck-actions-left > p {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }

  .ck-actions-left > p:has(#ckMobileOpen),
  .ck-actions-left > p:has(.ck-mobile-btn) {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .ck-actions-left .ck-search-wrap,
  .ck-actions-left .ck-account-link,
  .ck-actions-left .ck-divider,
  .ck-cart-text {
    display: none !important;
  }

  .ck-cart-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    text-decoration: none !important;
  }

  .ck-mobile-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    background: rgba(0, 48, 77, 0.06) !important;
    border: 1px solid var(--line, #e2e8ee) !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin: 0 !important;
    outline: none !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: background 0.2s ease, transform 0.2s ease !important;
    flex-shrink: 0 !important;
    position: static !important;
  }
}

.ck-mobile-btn:active {
  transform: scale(0.95);
  background: rgba(0, 48, 77, 0.12) !important;
}

.ck-burger-box {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  width: 22px !important;
  height: 16px !important;
  pointer-events: none !important;
}

.ck-burger-bar {
  display: block !important;
  width: 100% !important;
  height: 2.2px !important;
  background-color: var(--prussian, #00304D) !important;
  border-radius: 2px !important;
  transition: all 0.25s ease !important;
}

/* Pure CSS Shopping Bag Icon */
.ck-cart-badge-box {
  position: relative !important;
  width: 44px !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(0, 48, 77, 0.06) !important;
  border: 1px solid var(--line, #e2e8ee) !important;
  border-radius: 12px !important;
  transition: background 0.2s ease !important;
  flex-shrink: 0 !important;
}

.ck-cart-badge-box::before {
  content: '' !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2300304D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'%3E%3C/path%3E%3Cline x1='3' y1='6' x2='21' y2='6'%3E%3C/line%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'%3E%3C/path%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

.ck-cart-badge-count {
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  background: var(--orange-btn, #E06714) !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  min-width: 18px !important;
  height: 18px !important;
  border-radius: 9px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 4px !important;
  border: 2px solid #ffffff !important;
  line-height: 1 !important;
}

/* Complete Mobile Drawer Styling & Layout Isolation */
body.ck-drawer-active #ch43-widget,
body.ck-drawer-active #ch43-launcher,
body.ck-drawer-active .contact-float,
body.ck-drawer-active .cepw,
body:has(.ck-drawer-overlay.open) #ch43-widget,
body:has(.ck-drawer-overlay.open) #ch43-launcher,
body:has(.ck-drawer-overlay.open) .contact-float,
body:has(.ck-drawer-overlay.open) .cepw {
  display: none !important;
}

.ck-drawer-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0, 35, 58, 0.65) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  z-index: 9999999 !important;
  transition: opacity 0.3s ease, visibility 0.3s ease !important;
}

.ck-drawer-overlay:not(.open) {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.ck-drawer-overlay.open {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.ck-drawer-panel {
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 320px !important;
  max-width: 86vw !important;
  height: 100% !important;
  background: #ffffff !important;
  z-index: 10000000 !important;
  box-shadow: -8px 0 30px rgba(0, 48, 77, 0.25) !important;
  display: flex !important;
  flex-direction: column !important;
  transform: translateX(100%) !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.ck-drawer-overlay.open .ck-drawer-panel {
  transform: translateX(0) !important;
}

.ck-drawer-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid var(--line, #e2e8ee) !important;
  background: var(--ghost, #f8fafc) !important;
  flex-shrink: 0 !important;
}

.ck-drawer-title {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: var(--prussian, #00304D) !important;
}

.ck-drawer-close {
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  background: rgba(0, 48, 77, 0.08) !important;
  border: none !important;
  color: var(--prussian, #00304D) !important;
  font-size: 16px !important;
  font-weight: bold !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ck-drawer-menu-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  flex: 1 !important;
  overflow-y: auto !important;
}

.ck-d-item {
  border-bottom: 1px solid #f1f5f9 !important;
}

.ck-d-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 8px !important;
  font-weight: 700 !important;
  font-size: 14.5px !important;
  color: var(--prussian, #00304D) !important;
  cursor: pointer !important;
}

.ck-d-toggle {
  font-size: 12px !important;
  transition: transform 0.2s ease !important;
}

.ck-d-toggle.expanded {
  transform: rotate(180deg) !important;
}

.ck-d-submenu {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 12px 10px !important;
  display: none !important;
}

.ck-d-submenu.open {
  display: block !important;
}

.ck-d-sublink {
  display: block !important;
  padding: 10px 8px !important;
  font-size: 13.5px !important;
  color: #475569 !important;
  text-decoration: none !important;
  border-radius: 6px !important;
}

.ck-d-sublink:hover, .ck-d-sublink:active {
  background: rgba(0, 48, 77, 0.04) !important;
  color: var(--orange-btn, #E06714) !important;
}

.ck-drawer-footer {
  padding: 16px 20px !important;
  border-top: 1px solid var(--line, #e2e8ee) !important;
  background: #ffffff !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

/* Search popover offscreen isolation */
.ck-search-popover:not(.open) {
  display: none !important;
}

/* ==========================================================================
   GLOBAL MOBILE CONTAINMENT - PREVENT HORIZONTAL OVERFLOW
   ========================================================================== */
html {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
}

body {
  overflow-x: clip !important;
  max-width: 100vw !important;
  width: 100% !important;
  position: relative !important;
}

*, *::before, *::after {
  box-sizing: border-box;
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
}

/* 1. Contain popup / webinar launcher and prevent shine overflow */
#ch43-widget {
  max-width: 100vw !important;
  overflow: hidden !important;
}

#ch43-widget .ch43-launcher,
#ch43-widget .ch43-launcher-cta,
#ch43-widget .ch43-register,
#ch43-widget .ch43-panel {
  overflow: hidden !important;
}

@media (max-width: 768px) {
  #ch43-widget .ch43-card-shine,
  #ch43-widget .ch43-register-shine {
    display: none !important;
  }
}

/* 2. Contain background glows, blurred circles, and decorative blobs */
.hero-glow,
.glow,
.blob,
[class*="-glow"],
[class*="-blur"] {
  max-width: 100vw !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

section.elementor-section,
.about-hero,
.hero {
  overflow-x: clip !important;
  max-width: 100% !important;
}

/* 3. Offscreen honeypots, screen-reader text isolation */
.cc-form, form {
  position: relative !important;
}

input[name="website"],
input[style*="left:-9999px"],
input[style*="left: -9999px"],
input[style*="left: -"],
div[style*="left: -"],
span[style*="left: -"],
.screen-reader-response {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  z-index: -999 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
}


/* 4. Responsive WooCommerce tables & wide tables */
.woocommerce-table,
.shop_table,
.woocommerce table.shop_table {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}