/* ==========================================================================
   Absal LMS theme — compatibility with the site's plugins (v1.9.0)
   Loaded after Masteriyo, the Absal add-ons and WooCommerce. Plugin files are
   never modified; the theme adapts to them here.

   Plugin screens (Masteriyo app, WooCommerce, certificates, appointments,
   Google sign-in) are designed light. In dark mode they are shown as light
   "panels" so their own colours keep full contrast.
   ========================================================================== */

/* 1. Light panels inside dark mode ------------------------------------------ */
html[data-theme="dark"] :is(
	div.woocommerce,
	.absal-booking,
	#masteriyo-account-page, #masteriyo-checkout, #masteriyo-interactive-course,
	.masteriyo-single-course, .masteriyo-courses-wrapper, .masteriyo-course-list-display-section,
	.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup--wrapper,
	.absal-google-complete, #absal-google-mount,
	div.absal-card:not(.wp-block-group), .absal-alert
) {
	--absal-accent: #c2410c; --absal-page: #f8fafc; --absal-surface: #ffffff; --absal-surface-2: #f2f5fa; --absal-soft: #fff3e8;
	--absal-ink: #1c2d5a; --absal-text: #1c2d5a; --absal-muted: #56627a; --absal-line: #e3e8f0; --absal-line-strong: #b9c4d4;
	--absal-link: #1c2d5a; --absal-focus: #c2410c;
	color-scheme: light; color: #1c2d5a;
}
/* Wrappers without their own background get a light panel. */
html[data-theme="dark"] div.woocommerce:has(form, table, .cart-empty, .woocommerce-MyAccount-content, .woocommerce-order, .absall-pending),
html[data-theme="dark"] :is(#masteriyo-account-page, #masteriyo-checkout, .masteriyo-single-course, .masteriyo-courses-wrapper, .masteriyo-course-list-display-section) {
	box-sizing: border-box; padding: clamp(14px, 3vw, 28px); border-radius: 24px; background: #f8fafc;
}
html[data-theme="dark"] #absal-google-mount { padding: 14px; border-radius: 18px; background: #fff; }
/* WooCommerce wraps itself in div.woocommerce on cart, checkout and account pages. */
html[data-theme="dark"] body.woocommerce-cart, html[data-theme="dark"] body.woocommerce-checkout { background: var(--absal-page); }
html[data-theme="dark"] div.woocommerce :is(h1, h2, h3, label, th, td, legend, p, span, li, dt, dd) { color: inherit; }
html[data-theme="dark"] div.woocommerce :is(.absall-wcx-hero h1, .woocommerce-billing-fields h3, .cart_totals h2, #order_review_heading) { color: #15284d; }
html[data-theme="dark"] div.woocommerce a:not(.button):not(.wp-element-button) { color: #9a3412; }
html[data-theme="dark"] div.woocommerce .required { color: #b42318; }

/* 2. WooCommerce buttons: accessible orange (white label 5.2:1) ------------- */
body .woocommerce :is(button.button, a.button, input.button, #payment #place_order, a.checkout-button),
body .woocommerce-page :is(button.button, a.button, input.button) {
	background: #c2410c !important; color: #fff !important;
}
body .woocommerce :is(button.button, a.button, input.button, #payment #place_order, a.checkout-button):hover { background: #9a3412 !important; color: #fff !important; }
body .woocommerce :is(button.button, a.button):disabled, body .woocommerce :is(button.button, a.button).disabled { background: #8a94a6 !important; color: #fff !important; }
.absall-wcx-kicker { color: #9a3412 !important; }
.absall-wcx-steps span { color: #56627a !important; }
.absall-wcx-steps .is-active { color: #08663d !important; }
.absall-wcx-hero p, .absall-paybox__head small, .absall-pending__note { color: #56627a !important; }

/* 3. Certificate registry ----------------------------------------------------
   The plugin loads registry.css on every page; it styles a generic .absal-card.
   Theme cards are block groups and are isolated in theme.css. Here the
   plugin card keeps its own light design and readable text. */
div.absal-card:not(.wp-block-group) { color: #172033; }
div.absal-card:not(.wp-block-group) :is(h2, h3, dt, label, summary) { color: #172033; }
div.absal-card:not(.wp-block-group) a:not(.absal-button):not(.absal-small-button) { color: #9a3412; }
div.absal-card:not(.wp-block-group) :is(input, select) { color: #172033; }

/* 4. Paid appointments ------------------------------------------------------ */
.absal-booking :is(h2, h3, h4) { color: #243d3a; }
.absal-booking header span { color: #7a5a2c; }
.absal-booking .absal-slot { min-height: 44px; }

/* 5. Masteriyo account / login / signup (tuned against Masteriyo 3.4) ------- */
:is(#masteriyo-account-page, #masteriyo-checkout, #masteriyo-interactive-course) { color-scheme: light; min-width: 0; max-width: 100%; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) { color-scheme: light; color: #243247; box-sizing: border-box; min-width: 0; }
.masteriyo-login-form-wrapper { display: grid !important; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); width: min(100%, 960px) !important; max-width: 100% !important; margin: 24px auto !important; padding: 0 !important; overflow: hidden; border: 1px solid #dbe3ed; border-radius: 22px; background: #fff; }
.masteriyo-login-form-wrapper.no-signup { grid-template-columns: minmax(0, 1fr); max-width: 580px !important; }
.masteriyo-login-form-wrapper > .masteriyo-login { display: block; min-width: 0; width: auto !important; max-width: 100% !important; flex-basis: auto !important; padding: clamp(22px, 4vw, 44px) !important; background: #fff; }
.masteriyo-login-form-wrapper .masteriyo-login--wrapper { width: 100% !important; max-width: 100% !important; padding: 0 !important; background: #fff; }
.masteriyo-login-form-wrapper > .masteriyo-signup { display: flex; flex-direction: column; justify-content: center; gap: 14px; min-width: 0; width: auto !important; max-width: 100% !important; flex-basis: auto !important; padding: clamp(22px, 4vw, 44px) !important; background: #f5f7fb; }
.masteriyo-login-form-wrapper > .masteriyo-signup > span { color: #243247 !important; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) :is(h1, h2, h3, h4, h5, h6, .masteriyo-title, .masteriyo-label, label, p) { color: #243247 !important; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) :is(input[type="text"], input[type="email"], input[type="password"], input[type="tel"]) {
	color-scheme: light; box-sizing: border-box; width: 100% !important; min-width: 0; max-width: 100%; min-height: 48px; padding: 12px 14px;
	border: 1px solid #78869b !important; border-radius: 10px; background: #fff !important; color: #172033 !important; caret-color: #172033; font-size: 16px; line-height: 1.5;
}
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) input::placeholder { color: #5e6b80 !important; opacity: 1; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) input:focus-visible { outline: 3px solid #c2410c; outline-offset: 2px; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) input[type="checkbox"] { width: 18px; height: 18px; flex: 0 0 18px; accent-color: #c2410c; color-scheme: light; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) a:not(.masteriyo-btn) { color: #9a3412 !important; text-underline-offset: 3px; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) .masteriyo-btn {
	box-sizing: border-box; min-height: 48px; max-width: 100%; padding: 12px 20px; border-radius: 10px; line-height: 1.5; white-space: normal; text-align: center;
	background: #c2410c !important; border-color: #c2410c !important; color: #fff !important;
}
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) .masteriyo-btn:hover { background: #9a3412 !important; border-color: #9a3412 !important; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) .masteriyo-btn span { color: #fff !important; }
:is(.masteriyo-login-form-wrapper, .masteriyo-reset, .masteriyo-signup) :is(.masteriyo-danger-msg, .masteriyo-danger-msg p, .masteriyo-danger-msg span, .masteriyo-text-red) { color: #a11b23 !important; }
.masteriyo-login .masteriyo-remember-forgot { flex-wrap: wrap; align-items: center; gap: 14px; }
.masteriyo-signup--wrapper, .masteriyo-reset--wrapper { box-sizing: border-box; width: min(100%, 680px) !important; max-width: 100% !important; padding: clamp(20px, 4vw, 40px) !important; }
@media (min-width: 701px) { .masteriyo-login-form-wrapper > .masteriyo-signup { border-left: 0; border-inline-start: 1px solid #dbe3ed; } }
@media (max-width: 700px) {
	.masteriyo-login-form-wrapper { grid-template-columns: minmax(0, 1fr); margin-block: 16px !important; }
	.masteriyo-login-form-wrapper > .masteriyo-signup { padding: 24px !important; border-block-start: 1px solid #dbe3ed; }
	.masteriyo-login-form-wrapper > .masteriyo-signup .masteriyo-btn { width: 100%; }
}

/* 6. Absal learning-steps bar (Masteriyo Arabic add-on) ---------------------- */
#absal-learning-steps { box-sizing: border-box !important; width: calc(100% - 24px) !important; max-width: 1080px !important; min-width: 0 !important; margin-inline: auto !important; overflow: visible; text-align: start; color-scheme: light; }
#absal-learning-steps .absal-steps-list { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
#absal-learning-steps .absal-step { min-width: 0 !important; width: auto !important; padding-inline: 2px !important; }
#absal-learning-steps .absal-step-link { min-width: 0; color: inherit; white-space: normal; }
#absal-learning-steps .absal-step-label { color: inherit; white-space: normal; overflow-wrap: anywhere; }
#absal-learning-steps .absal-step-caption { color: #4a5f5c; }
#absal-learning-steps .absal-step-number { flex-shrink: 0; }
html[data-theme="dark"] #absal-learning-steps { --absal-accent: #71d9c4; --absal-ink: #eef6f5; --absal-muted: #c0d1ce; --absal-line: #4c6660; background: #16252b; border-color: #405750; color: #eef6f5; color-scheme: dark; }
html[data-theme="dark"] #absal-learning-steps .absal-step-caption, html[data-theme="dark"] #absal-learning-steps .absal-auth-help { color: #c0d1ce; }
html[data-theme="dark"] #absal-learning-steps .absal-auth-help { background: #1d3036; }
html[data-theme="dark"] #absal-learning-steps .absal-step-number { background: #21353a; color: #d6e8e3; border-color: #4c6660; }
html[data-theme="dark"] #absal-learning-steps .absal-step.is-current .absal-step-number { background: #71d9c4; color: #102c27; border-color: #71d9c4; box-shadow: 0 0 0 4px #2b4842; }
html[data-theme="dark"] #absal-learning-steps .absal-step.is-complete .absal-step-number { background: #25443b; color: #99efcf; }
html[data-theme="dark"] #absal-learning-steps .absal-steps-next { background: #71d9c4; color: #102c27; }
@media (max-width: 420px) {
	#absal-learning-steps { width: calc(100% - 16px) !important; padding: 14px 6px 18px !important; }
	#absal-learning-steps .absal-step-label { font-size: 11px; }
	#absal-learning-steps .absal-steps-heading { display: block; }
}

/* 7. Certificate shortcut inside the Masteriyo account (registry add-on) ---- */
.absal-certificate-account-button { box-sizing: border-box; }

@media (prefers-reduced-motion: reduce) {
	#absal-learning-steps, #absal-learning-steps * { animation: none !important; transition: none !important; }
}

/* InstaPay "required" asterisk: plugin orange is too light on the pay box. */
.absall-transfer-field label span { color: #c2410c !important; }

/* Certificate Registry 1.4: bulk submission and grouped public certificates. */
.absal-bulk-card,.absal-cert-person{font-family:var(--wp--preset--font-family--cairo,inherit)}
.absal-bulk-card .absal-button,.absal-cert-person .absal-small-button{border-radius:10px;text-decoration:none;line-height:1.6}
html[data-theme="dark"] .absal-bulk-card,html[data-theme="dark"] .absal-cert-person{background:#fff;color:#152a42}
html[data-theme="dark"] .absal-bulk-card :is(label,h2,legend,strong),html[data-theme="dark"] .absal-cert-person :is(h3,strong){color:#152a42}
html[data-theme="dark"] .absal-bulk-card .absal-cert-item{background:#f8fafc}