/* Site-wide fixes for academy.modirsho.net (loaded in light and dark mode). */

/* Header logo = the Modirsho favicon (square): round it like an app icon. */
.webmz-site-logo img.webmz-site-logo__image {
    border-radius: 12px !important; /* theme/dark rules reset image radius */
    object-fit: contain;
}

/* A section heading with nothing after it is an orphan: e.g. «سوالات متداول»
   on a course without FAQ items (the FAQ widget renders nothing, so Elementor
   leaves the heading as the last element of its container). */
.elementor-widget-webmz-spw-section-heading:last-child {
    display: none;
}

/* ------------------------------------------------------------------
 * Global Elementor light border token mapped to dark border
 * ------------------------------------------------------------------ */
body.akam-dark,
body.akam-dark * {
    --e-global-color-795a61c: var(--akd-border) !important;
}

/* ------------------------------------------------------------------
 * Course page: text sections are not cards.
 * Kept HERE, not in dark-base.css: dark-base.css has a rule that turns
 * every .webmz-spw-* panel into a bordered card (!important) and has
 * been rewritten from older copies before. This file loads after it
 * (priority 1000) with equal specificity, so these rules win.
 * ------------------------------------------------------------------ */

/* Hero short description under the title: plain text. */
body.akam-dark .webmz-spw-short-desc {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    color: var(--akd-muted) !important;
}

/* Course description: flows on the page like the curriculum/FAQ sections.
   The parent theme's read-more fade blends into --webmz-bg (page colour). */
body.akam-dark .webmz-spw-product-content {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
body.akam-dark .webmz-spw-product-content__inner { color: var(--akd-muted); }

/* Curriculum: one card per section; header and lessons are rows inside it. */
body.akam-dark .webmz-spw-curriculum__header,
body.akam-dark .webmz-spw-curriculum__lesson {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
body.akam-dark .webmz-spw-curriculum__lesson + .webmz-spw-curriculum__lesson,
body.akam-dark .webmz-spw-curriculum__panel-inner {
    border-top: 1px solid var(--akd-border) !important;
}
body.akam-dark .webmz-spw-curriculum__lesson:hover { background: rgba(255, 255, 255, .03) !important; }

/* Homepage service boxes: the widget always prints a counter (demo "+57"
   style numbers). No invented statistics — hide it. */
.elementor-103 .webmz-service-box__counter { display: none; }

/* ------------------------------------------------------------------
 * Learning path (homepage): outline icons in the accent blue and
 * readable labels. The widget was set to "fill" icon mode (solid orange
 * blobs) with dark navy labels meant for a light theme.
 * ------------------------------------------------------------------ */
body.akam-dark .webmz-lp {
    --webmz-lp-icon-color: var(--akd-accent);
    --webmz-lp-step-icon-color: var(--akd-accent);
    --webmz-lp-label-color: var(--akd-text);
    --webmz-lp-arrow-color: var(--akd-muted);
}
body.akam-dark .webmz-lp__icon-box {
    color: var(--akd-accent) !important;
    background: var(--akd-surface) !important;
    border: 1px solid var(--akd-border) !important;
}
body.akam-dark .elementor-widget-webmz-learning-path .webmz-lp__icon-box svg,
body.akam-dark .elementor-widget-webmz-learning-path .webmz-lp__icon-box svg path,
body.akam-dark .elementor-widget-webmz-learning-path .webmz-lp__icon-box svg circle {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.7;
}
body.akam-dark .webmz-lp__title { color: var(--akd-text) !important; }
body.akam-dark .webmz-lp__label {
    color: var(--akd-text) !important;
    font-weight: 600;
    line-height: 1.7;
}
body.akam-dark .webmz-lp__arrow,
body.akam-dark .webmz-lp__arrow-text { color: var(--akd-muted) !important; }
body.akam-dark .webmz-lp__step-link:hover .webmz-lp__icon-box {
    border-color: var(--akd-accent) !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, .15);
}

/* Back-to-top wave in the footer: dark surface, blue arrows. */
body.akam-dark .webmz-back-to-top-2__shape-bg { fill: var(--akd-surface) !important; }
body.akam-dark .webmz-back-to-top-2__shape-arrow { stroke: var(--akd-accent) !important; }
body.akam-dark .webmz-back-to-top-2:hover .webmz-back-to-top-2__shape-bg,
body.akam-dark .webmz-back-to-top-2:focus-visible .webmz-back-to-top-2__shape-bg { fill: var(--akd-surface-2) !important; }
body.akam-dark .webmz-back-to-top-2:hover .webmz-back-to-top-2__shape-arrow,
body.akam-dark .webmz-back-to-top-2:focus-visible .webmz-back-to-top-2__shape-arrow { stroke: var(--akd-accent-hover) !important; }

/* ------------------------------------------------------------------
 * Header & Footer: fix white borders in dark mode
 * ------------------------------------------------------------------ */

/* Header: horizontal separator line between contact bar and nav (e8b3dc8) */
body.akam-dark .elementor-15 .elementor-element.elementor-element-e8b3dc8,
body.akam-dark .elementor-element.elementor-element-e8b3dc8 {
    border-bottom: 1px solid var(--akd-border) !important;
    border-color: var(--akd-border) !important;
}

/* Header: main nav card (2809ce5) */
body.akam-dark .elementor-15 .elementor-element.elementor-element-2809ce5,
body.akam-dark .elementor-element.elementor-element-2809ce5 {
    border: 1px solid var(--akd-border) !important;
}

/* Footer: "About Us" center card (ea31d73) */
body.akam-dark .elementor-565 .elementor-element.elementor-element-ea31d73,
body.akam-dark .elementor-element.elementor-element-ea31d73 {
    border: 1px solid var(--akd-border) !important;
    background-color: var(--akd-surface) !important;
}

/* Footer: social icons inside the center card (e6233da) */
body.akam-dark .elementor-565 .elementor-element.elementor-element-e6233da .elementor-social-icon,
body.akam-dark .elementor-element.elementor-element-e6233da .elementor-social-icon {
    background-color: var(--akd-surface-2) !important;
    border: 1px solid var(--akd-border) !important;
}
body.akam-dark .elementor-565 .elementor-element.elementor-element-e6233da .elementor-social-icon i,
body.akam-dark .elementor-element.elementor-element-e6233da .elementor-social-icon i {
    color: var(--akd-accent) !important;
}
body.akam-dark .elementor-565 .elementor-element.elementor-element-e6233da .elementor-social-icon svg,
body.akam-dark .elementor-element.elementor-element-e6233da .elementor-social-icon svg {
    fill: var(--akd-accent) !important;
}
body.akam-dark .elementor-565 .elementor-element.elementor-element-e6233da .elementor-social-icon:hover,
body.akam-dark .elementor-element.elementor-element-e6233da .elementor-social-icon:hover {
    background-color: var(--akd-accent) !important;
    border-color: var(--akd-accent) !important;
}
body.akam-dark .elementor-565 .elementor-element.elementor-element-e6233da .elementor-social-icon:hover i,
body.akam-dark .elementor-element.elementor-element-e6233da .elementor-social-icon:hover i,
body.akam-dark .elementor-565 .elementor-element.elementor-element-e6233da .elementor-social-icon:hover svg,
body.akam-dark .elementor-element.elementor-element-e6233da .elementor-social-icon:hover svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}