/* =========================================================
   KS Social LinkedIn Premium — Theme Stylesheet
   ========================================================= */

:root {
    --ks-bg: #f3f6fb;
    --ks-surface: #ffffff;
    --ks-border: #d9e2ec;
    --ks-text: #162234;
    --ks-muted: #64748b;
    --ks-primary: #0a66c2;
    --ks-primary-dark: #084f96;
    --ks-radius: 18px;
    --ks-shadow: 0 12px 32px rgba(15, 23, 42, 0.09);
    --ks-shadow-soft: 0 6px 20px rgba(15, 23, 42, 0.06);
    --ks-space-1: 8px;
    --ks-space-2: 12px;
    --ks-space-3: 16px;
    --ks-space-4: 24px;
    --ks-content-max: 1128px;
    --ks-side-left: 260px;
    --ks-side-right: 320px;
    --ks-header-height: 60px;
}

/* ---- Reset ---- */

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    overflow-x: clip;
}

body {
    color: var(--ks-text);
    background: var(--ks-bg);
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    line-height: 1.5;
}

a {
    color: var(--ks-primary);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--ks-primary);
    outline-offset: 2px;
}

/* ---- Container ---- */

.ks-container {
    width: 100%;
    max-width: var(--ks-content-max);
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}

/* =========================================================
   HEADER — logo left + menu aligned left
   ========================================================= */

.site-header {
    background: rgba(255, 255, 255, 0.94);
    border-bottom: 1px solid var(--ks-border);
    position: sticky;
    top: 0;
    z-index: 110;
    backdrop-filter: blur(8px);
    overflow: visible;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.site-header__inner {
    min-height: var(--ks-header-height);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--ks-space-3);
    overflow: visible;
}

/* Logo / branding */

.site-branding {
    flex-shrink: 0;
}

.site-branding__link {
    color: var(--ks-text);
    text-decoration: none;
    font-weight: 700;
    font-size: 1.15rem;
}

.custom-logo-link {
    display: inline-flex;
    align-items: center;
}

.custom-logo {
    max-height: 38px;
    width: auto;
    display: block;
}

/* Menu toggle (mobile) */

.menu-toggle {
    display: none;
    border: 1px solid var(--ks-border);
    background: #fff;
    border-radius: 10px;
    padding: 8px 12px;
    color: var(--ks-text);
    margin-left: auto;
}

/* Main navigation — aligned left after logo */

.main-navigation {
    margin-left: 0;
    position: relative;
    z-index: 220;
    overflow: visible;
}

.primary-menu,
.primary-menu ul,
.footer-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.primary-menu {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: visible;
}

.primary-menu > li {
    position: relative;
}

.primary-menu > li > a {
    text-decoration: none;
    color: var(--ks-text);
    font-weight: 600;
    padding: 10px 12px;
    border-radius: 10px;
    display: inline-flex;
    transition: background 0.15s, color 0.15s;
}

.primary-menu > li > a:hover,
.primary-menu > li.current-menu-item > a,
.primary-menu > li.current-menu-ancestor > a {
    background: #e9f2ff;
    color: var(--ks-primary-dark);
}

/* Dropdowns */

.primary-menu .sub-menu {
    position: absolute;
    left: 0;
    top: calc(100% + 6px);
    min-width: 220px;
    background: var(--ks-surface);
    border: 1px solid var(--ks-border);
    border-radius: 14px;
    box-shadow: var(--ks-shadow);
    display: none;
    padding: 8px;
    z-index: 999;
    list-style: none;
}

.primary-menu .sub-menu a {
    display: block;
    color: var(--ks-text);
    text-decoration: none;
    border-radius: 10px;
    padding: 10px 12px;
    transition: background 0.15s;
}

.primary-menu .sub-menu li + li {
    margin-top: 2px;
}

.primary-menu .sub-menu a:hover {
    background: #eff5ff;
}

/* Keep desktop dropdowns fully visible above page wrappers */
@media (min-width: 901px) {
    .site,
    .site-content,
    .content-area,
    .site-header,
    .site-header__inner,
    .main-navigation,
    .primary-menu,
    .primary-menu > li {
        overflow: visible;
    }

    .primary-menu .sub-menu,
    .primary-menu .sub-menu .sub-menu {
        max-height: none;
        overflow: visible;
    }
}

.primary-menu li:hover > .sub-menu,
.primary-menu li:focus-within > .sub-menu,
.primary-menu li.is-open > .sub-menu {
    display: block;
}

.primary-menu .sub-menu .sub-menu {
    left: calc(100% + 8px);
    top: -8px;
}

.menu-item-toggle {
    display: none;
}

/* Footer nav */

.footer-menu {
    display: flex;
    gap: var(--ks-space-3);
}

.footer-menu a {
    text-decoration: none;
    color: var(--ks-text);
}

/* =========================================================
   SITE MAIN
   ========================================================= */

.site-main {
    padding: var(--ks-space-4) 0;
}

/* ---- Card (default pages) ---- */

.ks-card {
    background: var(--ks-surface);
    border: 1px solid var(--ks-border);
    border-radius: var(--ks-radius);
    box-shadow: var(--ks-shadow-soft);
    padding: 20px;
}

.ks-content-wrap {
    display: grid;
    gap: var(--ks-space-4);
}

.entry-title {
    margin: 0 0 12px;
}

/* Neutralise WP block wrappers on KS pages */

.is-ks-social .entry-content,
.is-ks-social .wp-block-group,
.is-ks-social .wp-block-columns {
    margin-top: 0;
}

/* =========================================================
   KS APP TEMPLATE — feed / profile / messaging
   ========================================================= */

.ks-app {
    width: 100%;
}

.ks-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--ks-space-4);
    align-items: start;
}

.ks-main-feed {
    min-width: 0;
}

/* Neutral wrapper: no card styling around the_content() */

.ks-content-neutral,
.ks-content-neutral__inner {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.is-ks-app .ks-main-feed > .ks-content-neutral {
    margin: 0;
}

.is-ks-app .ks-main-feed > .ks-content-neutral > .entry-content > .ks-card,
.is-ks-app .ks-main-feed > .ks-content-neutral > .entry-content > .card {
    margin-top: 0;
}

/* ---- KS Social tabs / cards alignment (P4) ----
   Ensure the plugin's internal nav tabs and feed cards share
   identical horizontal bounds — same width, same padding.       */

.is-ks-app .ks-main-feed .entry-content {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Kill any extra padding/margin the entry-content may add */
.is-ks-app .ks-main-feed .entry-content {
    padding: 0;
    margin: 0;
}

/* Force plugin wrapper to fill the column */
.is-ks-app .ks-main-feed .entry-content > * {
    max-width: 100%;
    width: 100%;
}

/* KS Social plugin nav tabs — match card width exactly */
.is-ks-app .ks-main-feed .entry-content > nav,
.is-ks-app .ks-main-feed .entry-content > .ks-social-nav,
.is-ks-app .ks-main-feed .entry-content > [class*="nav"],
.is-ks-app .ks-main-feed .entry-content > [class*="tab"],
.is-ks-app .ks-main-feed .entry-content > [class*="menu-bar"],
.is-ks-app .ks-main-feed .entry-content > [class*="toolbar"] {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
}

/* Cards generated by KS Social plugin */
.is-ks-app .ks-main-feed .entry-content > [class*="card"],
.is-ks-app .ks-main-feed .entry-content > [class*="post"],
.is-ks-app .ks-main-feed .entry-content > [class*="compose"],
.is-ks-app .ks-main-feed .entry-content > [class*="feed"] {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
}

/* KS Social internal wrapper — ensure no offset */
.is-ks-app .ks-main-feed .entry-content [class*="ks-social"] {
    max-width: 100%;
}

/* Sidebars */

.ks-sidebar {
    min-width: 0;
}

.ks-sidebar__inner {
    position: sticky;
    top: calc(var(--ks-header-height) + 20px);
    display: grid;
    gap: var(--ks-space-3);
}

.widget {
    background: var(--ks-surface);
    border: 1px solid var(--ks-border);
    border-radius: 14px;
    padding: 16px;
    box-shadow: var(--ks-shadow-soft);
}

.widget ul,
.widget ol {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.widget li + li {
    margin-top: 8px;
}

.widget-title {
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 1rem;
}

/* =========================================================
   KS AUTH TEMPLATE — login page (flat background, no outer card)
   ========================================================= */

body.is-ks-auth {
    background: #f5f7fb;
}

.is-ks-auth .site-main {
    min-height: calc(100vh - var(--ks-header-height));
    display: grid;
    align-items: center;
    padding: var(--ks-space-4) 0;
    background: transparent !important;
}

/* Remove the previous gradient layer entirely */
.is-ks-auth .site-main::before {
    content: none;
}

.is-ks-auth .ks-auth-shell,
.is-ks-auth .ks-auth-page,
.is-ks-auth .ks-auth-container,
.is-ks-auth .ks-auth-entry,
.is-ks-auth .ks-auth-content {
    width: 100%;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    margin: 0 !important;
    padding: 0 !important;

    /* Center the auth block horizontally */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Keep auth content constrained and centered */
.is-ks-auth .ks-auth-content > * {
    width: 100%;
    max-width: 1040px;
}

.is-ks-auth .ks-auth-split-card {
    width: 100%;
    max-width: 1040px;
    margin: 0 auto !important;
}
/* Ensure auth pages are truly centered relative to the viewport (avoid constrained theme wrappers) */
.is-ks-auth .ks-auth-page {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* Root cause (from theme CSS): wrapper/card-like blocks around shortcode output,
   especially Gutenberg containers, were carrying card visuals. */
.is-ks-auth :is(#page, .site, .site-content, .content-area, .site-main, .entry, .entry-content, .page, .page-content, .hentry, article, main, .wp-site-blocks, .wp-block-post-content, .wp-block-group, .wp-block-columns, .wp-block-column, .wp-block-cover, .wp-block-media-text, .wp-block-template-part, .ks-content-wrap, .ks-card) {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Remove padding/margins that create the large "white panel" around auth blocks */
.is-ks-auth :is(.wp-block-group, .wp-block-columns, .wp-block-column, .wp-block-cover, .wp-block-media-text, .ks-card, .ks-content-wrap) {
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

.is-ks-auth .ks-auth-content {
    max-width: 1040px;
    margin: 0 auto !important;
}

.is-ks-auth .ks-auth-content > * {
    margin: 0 !important;
    padding: 0 !important;
}

.is-ks-auth .ks-auth-split-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 46%);
    align-items: stretch;
    gap: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    overflow: hidden;
    min-height: clamp(420px, 70vh, 640px);
}

.is-ks-auth .ks-auth-split-card > * {
    margin: 0 !important;
}

.is-ks-auth .ks-auth-media,
.is-ks-auth .ks-auth-panel {
    min-height: 100%;
}

.is-ks-auth .ks-auth-media {
    position: relative;
    overflow: hidden;
    background: transparent !important;
}

.is-ks-auth .ks-auth-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.is-ks-auth .ks-auth-panel {
    background: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 36px;
}

/* No card-in-card: keep the form visually neutral inside the right panel */
.is-ks-auth .ks-auth-panel form {
    width: 100%;
    max-width: 520px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Fallback when split structure is absent */
.is-ks-auth .ks-auth-content > form:first-child {
    max-width: 520px;
    margin: 0 auto;
    background: #fff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 28px;
}

@media (max-width: 900px) {
    .is-ks-auth .ks-auth-split-card {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .is-ks-auth .ks-auth-media {
        min-height: 240px;
    }

    .is-ks-auth .ks-auth-panel {
        padding: 28px 20px;
    }
}


/* =========================================================
   AUTH PASSWORD — ensure form & inputs are never hidden
   ========================================================= */
body.is-ks-auth-password form {
    visibility: visible !important;
    opacity: 1 !important;
}

body.is-ks-auth-password form input,
body.is-ks-auth-password form textarea,
body.is-ks-auth-password form select,
body.is-ks-auth-password form label,
body.is-ks-auth-password form button {
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
}

/* =========================================================
   FOOTER
   ========================================================= */

.site-footer {
    border-top: 1px solid var(--ks-border);
    background: #fff;
    margin-top: 24px;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.site-footer__inner {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (min-width: 700px) {
    .ks-container {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (min-width: 1100px) {
    .ks-shell.has-left.has-right {
        grid-template-columns: var(--ks-side-left) minmax(0, 1fr) var(--ks-side-right);
    }

    .ks-shell.has-left:not(.has-right) {
        grid-template-columns: var(--ks-side-left) minmax(0, 1fr);
    }

    .ks-shell.has-right:not(.has-left) {
        grid-template-columns: minmax(0, 1fr) var(--ks-side-right);
    }
}

@media (max-width: 1099px) {
    .ks-sidebar__inner {
        position: static;
    }

    .ks-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .ks-shell .ks-sidebar-right,
    .ks-shell .ks-sidebar-left {
        order: 2;
    }

    .ks-shell .ks-main-feed {
        order: 1;
    }
}

/* Mobile header */
@media (max-width: 900px) {
    .menu-toggle {
        display: inline-flex;
        align-items: center;
    }

    .main-navigation {
        display: none;
        width: 100%;
        margin-left: 0;
    }

    .main-navigation.is-open {
        display: block;
        padding-bottom: 12px;
    }

    .site-header__inner {
        flex-wrap: wrap;
    }

    .primary-menu {
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }

    .primary-menu > li > a {
        width: 100%;
        justify-content: space-between;
    }

    .primary-menu .sub-menu,
    .primary-menu .sub-menu .sub-menu {
        position: static;
        border: 0;
        box-shadow: none;
        display: none;
        padding: 4px 0 4px 12px;
        background: transparent;
    }

    .primary-menu li.is-open > .sub-menu {
        display: block;
    }

    .menu-item-toggle {
        display: inline-flex;
        border: 1px solid var(--ks-border);
        background: #fff;
        border-radius: 8px;
        padding: 2px 8px;
        margin-left: 8px;
        cursor: pointer;
    }

    .site-footer__inner,
    .footer-menu {
        flex-direction: column;
    }
}

@media (max-width: 600px) {
    .ks-card {
        padding: 16px;
    }

}


/* =========================================================
   AUTH REGISTER — ensure registration block is perfectly centered
   ========================================================= */

/* Auth shell wrapper: flex-centered on register pages */
body.is-ks-auth-register .ks-auth-page,
body.is-ks-auth-register .ks-auth-shell,
body.is-ks-auth-register .ks-auth-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
}

body.is-ks-auth-register .site-main,
body.is-ks-auth-register .ks-auth-entry,
body.is-ks-auth-register .entry-content,
body.is-ks-auth-register .ks-auth-content,
body.is-ks-auth-register .wp-block-post-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
}

/* Direct children fill parent width so flex centering propagates */
body.is-ks-auth-register .site-main > *,
body.is-ks-auth-register .entry-content > *,
body.is-ks-auth-register .ks-auth-content > *,
body.is-ks-auth-register .wp-block-post-content > * {
    width: 100% !important;
}

/* Center the actual register form/card */
body.is-ks-auth-register form {
    width: 100% !important;
    max-width: 560px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Gutenberg block wrappers around the form: flex-centered */
body.is-ks-auth-register .wp-block-group,
body.is-ks-auth-register .wp-block-columns,
body.is-ks-auth-register .wp-block-column {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* Common card wrappers: auto margins for centering */
body.is-ks-auth-register :is(.ks-card, .ks-auth-card, .ks-auth-panel) {
    max-width: 560px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* =========================================================
   P5 — Header dropdown stability + page-specific wrapper fixes
   ========================================================= */

.site-header {
    z-index: 1300;
}

.site-header__inner,
.main-navigation,
.primary-menu,
.primary-menu > li,
.primary-menu > li.menu-item-has-children {
    overflow: visible;
}

.primary-menu > li.menu-item-has-children {
    position: relative;
}

/* invisible bridge to prevent flicker while moving cursor into dropdown */
.primary-menu > li.menu-item-has-children::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 12px;
    background: transparent;
}

.primary-menu .sub-menu {
    top: 100% !important;
    bottom: auto !important;
    z-index: 1400;
    margin-top: 6px;
}

.primary-menu .sub-menu .sub-menu {
    top: 0;
    bottom: auto !important;
}

/* Remove ONLY the big outer white wrapper on tactical page (keep internal UI cards) */
body.is-ks-tactique .ks-content-wrap,
body.is-ks-tactique .ks-content-wrap > article.ks-card,
body.is-ks-tactique .ks-content-wrap > article.ks-card > .entry-header,
body.is-ks-tactique .ks-content-wrap > article.ks-card > .entry-content {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.is-ks-tactique .ks-content-wrap > article.ks-card,
body.is-ks-tactique .ks-content-wrap > article.ks-card > .entry-content {
    margin: 0 !important;
    padding: 0 !important;
}



/* Remove ONLY the big outer white wrapper on directory page (keep internal directory cards + filters) */
body.is-ks-directory .ks-content-wrap,
body.is-ks-directory .ks-content-wrap > article.ks-card,
body.is-ks-directory .ks-content-wrap > article.ks-card > .entry-header,
body.is-ks-directory .ks-content-wrap > article.ks-card > .entry-content {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.is-ks-directory .ks-content-wrap > article.ks-card,
body.is-ks-directory .ks-content-wrap > article.ks-card > .entry-content {
    margin: 0 !important;
    padding: 0 !important;
}

/* Directory: restore clean white card surfaces for results + filter panels */
body.is-ks-directory .entry-content :is(.ks-card, .card, .widget, .wp-block-group, .wp-block-columns, .wp-block-column) {
    background: var(--ks-surface) !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: var(--ks-shadow) !important;
    border-radius: var(--ks-radius) !important;
}

/* Directory: tighten spacing so cards look clean */
body.is-ks-directory .entry-content :is(.ks-card, .card) {
    padding: 16px;
    margin-bottom: 12px;
}


/* Remove ONLY the big outer white wrapper on groups pages (keep internal group cards/forms) */
body.is-ks-groups .ks-content-wrap,
body.is-ks-groups .ks-content-wrap > article.ks-card,
body.is-ks-groups .ks-content-wrap > article.ks-card > .entry-header,
body.is-ks-groups .ks-content-wrap > article.ks-card > .entry-content {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.is-ks-groups .ks-content-wrap > article.ks-card,
body.is-ks-groups .ks-content-wrap > article.ks-card > .entry-content {
    margin: 0 !important;
    padding: 0 !important;
}

/* Groups: preserve internal white cards/panels/forms generated by the plugin */
body.is-ks-groups .entry-content :is(.ks-card, .card, .widget, .wp-block-group, .wp-block-columns, .wp-block-column, .ks-group-card, .ks-group-item, .ks-group-form, .ks-panel) {
    background: var(--ks-surface) !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: var(--ks-shadow) !important;
    border-radius: var(--ks-radius) !important;
}

body.is-ks-groups .entry-content :is(.ks-card, .card, .ks-group-card, .ks-group-item, .ks-group-form, .ks-panel) {
    padding: 16px;
    margin-bottom: 12px;
}







/* =========================================================
   KS TACTIQUE — Mobile-first layout helpers (SAFE)
   Scope: only pages detected as tactique via body.is-ks-tactique
   ========================================================= */

/* Override the global html/body clipping on tactique pages; plugin scroll containers own their overflow. */
html:has(body.is-ks-tactique),
body.is-ks-tactique {
    overflow-x: visible;
}

/* Ensure the main container is perfectly centered with symmetric gutters */
body.is-ks-tactique .ks-container.ks-content-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-inline: 12px;
    box-sizing: border-box;
}

/* Keep the content wrapper neutral without clipping plugin scroll areas. */
body.is-ks-tactique .entry-content {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: visible !important;
}

/* Force common block wrappers to respect the container width */
body.is-ks-tactique .entry-content > * {
    max-width: 100%;
    box-sizing: border-box;
}

/* Let the tactical plugin own its internal horizontal scroll area. */
body.is-ks-tactique #kas-field-scroll {
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
}

body.is-ks-tactique #config-container,
body.is-ks-tactique #kas-terrain-wrapper,
body.is-ks-tactique #kasendemi-svg,
body.is-ks-tactique .ks-players-bar,
body.is-ks-tactique .ks-top-hscroll-inner {
    max-width: none !important;
}

/* Center and normalize widths for the tool's UI panels/cards without changing their white surfaces */
body.is-ks-tactique .entry-content > :is(.ks-card, .card, .widget, .wp-block-group, .wp-block-columns, .wp-block-column) {
    width: 100%;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    body.is-ks-tactique .ks-content-wrap {
        gap: 12px;
    }

    /* Slightly tighter gutters on small screens */
    body.is-ks-tactique .ks-container.ks-content-wrap {
        padding-inline: 10px;
    }
}

/* =========================================================
   KS TACTIQUE — Fix asymmetric gutters (mobile)
   Some wrappers above the tool container may apply uneven padding/margins.
   Force symmetric horizontal gutters ONLY on tactique pages.
   ========================================================= */

body.is-ks-tactique :is(.site, .site-content, .content-area, main#primary, .ks-content-wrap) {
    overflow-x: visible !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (max-width: 768px) {
    body.is-ks-tactique :is(.site-content, .content-area, main#primary, .ks-content-wrap) {
        padding-inline: 10px !important;
    }
}

@media (max-width: 768px) {
    /* Tactique: keep plugin-facing card gutters balanced on mobile. */
    body.is-ks-tactique .entry-content > :is(.ks-card, .card, .widget, .wp-block-group, .wp-block-columns, .wp-block-column) {
        padding-inline: 10px !important;
    }
}

/* =========================================================
   KS PREMIUM PAGES — Extended width shell (shortcode-detected)
   ========================================================= */

body.is-ks-premium-page .site-main {
    padding-top: 0;
}

body.is-ks-premium-page .ks-content-wrap,
body.is-ks-premium-page .ks-content-wrap > article.ks-card,
body.is-ks-premium-page .ks-content-wrap > article.ks-card > .entry-header,
body.is-ks-premium-page .ks-content-wrap > article.ks-card > .entry-content {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.is-ks-premium-page .ks-content-wrap > article.ks-card,
body.is-ks-premium-page .ks-content-wrap > article.ks-card > .entry-content {
    margin: 0 !important;
    padding: 0 !important;
}

body.is-ks-premium-page .ks-container,
body.is-ks-premium-page .ks-content-wrap {
    max-width: 1800px;
    width: calc(100% - 32px);
}

.ks-premium-theme-shell {
    width: 100%;
    max-width: none;
    padding: 24px 16px;
}

.ks-premium-theme-content {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

body.is-ks-premium-page .entry-content {
    width: 100%;
    max-width: none;
}

@media (max-width: 768px) {
    body.is-ks-premium-page .ks-container,
    body.is-ks-premium-page .ks-content-wrap {
        width: calc(100% - 24px);
    }

    .ks-premium-theme-shell {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* =========================================================
   PMPro / Facturation — correction lisibilité tableau
   =========================================================
   Corrige les lignes de facturation où les colonnes Niveau et Total
   pouvaient hériter d'un texte blanc sur fond blanc.
*/
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap, .pmpro_actions_nav) table,
body table.pmpro_table,
body .pmpro_table {
    width: 100%;
    background: #ffffff !important;
    color: #173047 !important;
    border-collapse: separate;
    border-spacing: 0;
}

body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table thead th,
body table.pmpro_table thead th,
body .pmpro_table thead th {
    background: #354f4f !important;
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody td,
body table.pmpro_table tbody td,
body .pmpro_table tbody td {
    background: #ffffff !important;
    color: #173047 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    visibility: visible !important;
}

/* Colonne Date : conserve le contraste premium visible sur fond sombre. */
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:first-child,
body table.pmpro_table tbody tr > td:first-child,
body .pmpro_table tbody tr > td:first-child {
    background: #354f4f !important;
    color: #81e9ff !important;
    font-weight: 800;
}

body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:first-child a,
body table.pmpro_table tbody tr > td:first-child a,
body .pmpro_table tbody tr > td:first-child a {
    color: #81e9ff !important;
    opacity: 1 !important;
}

/* Colonnes Niveau et Total : texte sombre obligatoire sur fond blanc. */
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:nth-child(2),
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:nth-child(2) *,
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:nth-child(3),
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:nth-child(3) *,
body table.pmpro_table tbody tr > td:nth-child(2),
body table.pmpro_table tbody tr > td:nth-child(2) *,
body table.pmpro_table tbody tr > td:nth-child(3),
body table.pmpro_table tbody tr > td:nth-child(3) *,
body .pmpro_table tbody tr > td:nth-child(2),
body .pmpro_table tbody tr > td:nth-child(2) *,
body .pmpro_table tbody tr > td:nth-child(3),
body .pmpro_table tbody tr > td:nth-child(3) * {
    color: #173047 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    visibility: visible !important;
}

body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:nth-child(3),
body table.pmpro_table tbody tr > td:nth-child(3),
body .pmpro_table tbody tr > td:nth-child(3) {
    text-align: right;
    font-weight: 800;
}

/* Colonne Statut : garde les badges PMPro lisibles, sans blanchir leur texte. */
body :is(#pmpro_account, #pmpro_account-invoices, .pmpro_account, .pmpro_invoice_wrap, .pmpro_billing_wrap, .pmpro_member_wrap) table tbody tr > td:nth-child(4),
body table.pmpro_table tbody tr > td:nth-child(4),
body .pmpro_table tbody tr > td:nth-child(4) {
    background: #ffffff !important;
    opacity: 1 !important;
    text-align: right;
}

/* =========================================================
   SURECART CHECKOUT — Bleu premium Kasendemi Sport
   =========================================================
   Appliqué uniquement aux pages contenant [sc_form] ou aux slugs SureCart détectés.
   Ne modifie pas les checkouts Paid Memberships Pro.
*/
body.is-ks-surecart-checkout {
    --ks-checkout-blue: #2563eb;
    --ks-checkout-blue-dark: #1d4ed8;
    --ks-checkout-blue-soft: #dbeafe;
    --ks-checkout-cyan: #81e9ff;
    --ks-checkout-navy: #071733;
    --ks-checkout-text: #0f172a;
    --ks-checkout-muted: #64748b;
    --ks-checkout-border: rgba(37, 99, 235, 0.22);
    --ks-checkout-shadow: 0 24px 70px rgba(15, 23, 42, 0.14);

    /* Variables fréquemment consommées par SureCart / composants web. */
    --sc-color-primary-50: #eff6ff;
    --sc-color-primary-100: #dbeafe;
    --sc-color-primary-200: #bfdbfe;
    --sc-color-primary-300: #93c5fd;
    --sc-color-primary-400: #60a5fa;
    --sc-color-primary-500: #2563eb;
    --sc-color-primary-600: #1d4ed8;
    --sc-color-primary-700: #1e40af;
    --sc-color-primary-800: #1e3a8a;
    --sc-color-primary-900: #172554;
    --sc-focus-ring-color-primary: rgba(37, 99, 235, 0.28);
    background:
        radial-gradient(circle at 10% 0%, rgba(129, 233, 255, 0.22), transparent 34%),
        radial-gradient(circle at 90% 8%, rgba(37, 99, 235, 0.20), transparent 36%),
        linear-gradient(180deg, #f6faff 0%, #eef6ff 48%, #f8fbff 100%) !important;
}

body.is-ks-surecart-checkout .site-content,
body.is-ks-surecart-checkout .content-area,
body.is-ks-surecart-checkout main#primary,
body.is-ks-surecart-checkout .ks-content-wrap {
    background: transparent !important;
}

body.is-ks-surecart-checkout .ks-container,
body.is-ks-surecart-checkout .ks-content-wrap {
    max-width: 1280px;
}

body.is-ks-surecart-checkout .ks-content-wrap > article.ks-card,
body.is-ks-surecart-checkout article.page,
body.is-ks-surecart-checkout .entry-content > .wp-block-group,
body.is-ks-surecart-checkout .entry-content > .surecart-checkout,
body.is-ks-surecart-checkout .entry-content > .sc-checkout,
body.is-ks-surecart-checkout .entry-content > .sc-form,
body.is-ks-surecart-checkout .entry-content > [class*="surecart"] {
    border: 1px solid var(--ks-checkout-border) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(239, 246, 255, 0.96)) !important;
    box-shadow: var(--ks-checkout-shadow) !important;
    border-radius: 28px !important;
}

body.is-ks-surecart-checkout .ks-content-wrap > article.ks-card,
body.is-ks-surecart-checkout article.page {
    overflow: hidden;
}

body.is-ks-surecart-checkout .entry-header {
    background:
        radial-gradient(circle at 20% 10%, rgba(129, 233, 255, 0.24), transparent 34%),
        linear-gradient(135deg, var(--ks-checkout-navy), #0b2f72 58%, #2563eb) !important;
    border-bottom: 1px solid rgba(129, 233, 255, 0.22) !important;
    color: #ffffff !important;
}

body.is-ks-surecart-checkout .entry-title,
body.is-ks-surecart-checkout .entry-header .entry-title {
    color: #ffffff !important;
    text-shadow: 0 12px 34px rgba(0, 0, 0, 0.26);
}

body.is-ks-surecart-checkout .entry-content {
    color: var(--ks-checkout-text);
}

body.is-ks-surecart-checkout :is(h1, h2, h3, h4, h5, h6) {
    color: var(--ks-checkout-navy);
}

body.is-ks-surecart-checkout :is(a, .surecart-checkout a, [class*="surecart"] a) {
    color: var(--ks-checkout-blue-dark);
}

/* Cartes, encadrés et résumé de commande SureCart. */
body.is-ks-surecart-checkout :is(.surecart-checkout, .sc-checkout, .sc-form, .sc-order-summary, .sc-card, .sc-product-line-item, .sc-line-item, [class*="surecart"], [class*="sc-checkout"], [class*="sc-order"], [class*="sc-summary"]) {
    --sc-color-primary-500: var(--ks-checkout-blue);
    --sc-color-primary-600: var(--ks-checkout-blue-dark);
    --sc-border-radius-medium: 16px;
    --sc-border-radius-large: 22px;
}

body.is-ks-surecart-checkout :is(.sc-card, .sc-order-summary, .sc-checkout-card, .surecart-card, [class*="sc-card"], [class*="order-summary"], [class*="checkout-summary"]) {
    border-color: var(--ks-checkout-border) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.08) !important;
    border-radius: 22px !important;
}

/* Champs de formulaire visibles hors Shadow DOM. */
body.is-ks-surecart-checkout :is(input, select, textarea, .sc-input, .sc-select) {
    border-color: rgba(37, 99, 235, 0.22) !important;
    border-radius: 14px !important;
    color: var(--ks-checkout-text) !important;
}

body.is-ks-surecart-checkout :is(input, select, textarea, .sc-input, .sc-select):focus {
    border-color: var(--ks-checkout-blue) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.14) !important;
    outline: none !important;
}

/* Boutons visibles hors Shadow DOM. */
body.is-ks-surecart-checkout :is(button, input[type="submit"], .button, .wp-block-button__link, .sc-button, .surecart-button, [class*="sc-button"], [class*="surecart-button"]) {
    border-color: rgba(37, 99, 235, 0.35) !important;
}

body.is-ks-surecart-checkout :is(button:not(.menu-toggle), input[type="submit"], .wp-block-button__link, .sc-button--primary, .surecart-button-primary, [class*="button-primary"], [class*="sc-button-primary"]) {
    background: linear-gradient(135deg, #60a5fa 0%, var(--ks-checkout-blue) 44%, var(--ks-checkout-blue-dark) 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.28) !important;
    font-weight: 800 !important;
}

body.is-ks-surecart-checkout :is(button:not(.menu-toggle), input[type="submit"], .wp-block-button__link, .sc-button--primary, .surecart-button-primary, [class*="button-primary"], [class*="sc-button-primary"]):hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
}

/* Composants web SureCart/Shoelace : styles via parts quand disponibles. */
body.is-ks-surecart-checkout sc-button::part(base) {
    background: linear-gradient(135deg, #60a5fa 0%, #2563eb 48%, #1d4ed8 100%);
    border-color: rgba(37, 99, 235, 0.35);
    color: #ffffff;
    font-weight: 800;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.28);
}

body.is-ks-surecart-checkout sc-button::part(label),
body.is-ks-surecart-checkout sc-button::part(prefix),
body.is-ks-surecart-checkout sc-button::part(suffix) {
    color: #ffffff;
}

body.is-ks-surecart-checkout sc-input::part(base),
body.is-ks-surecart-checkout sc-select::part(base),
body.is-ks-surecart-checkout sc-textarea::part(base) {
    border-color: rgba(37, 99, 235, 0.22);
    border-radius: 14px;
}

body.is-ks-surecart-checkout sc-card::part(base),
body.is-ks-surecart-checkout sc-order-summary::part(base),
body.is-ks-surecart-checkout sc-checkout-form::part(base) {
    border-color: rgba(37, 99, 235, 0.22);
    border-radius: 22px;
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.08);
}

@media (max-width: 768px) {
    body.is-ks-surecart-checkout .ks-container,
    body.is-ks-surecart-checkout .ks-content-wrap {
        width: calc(100% - 20px);
        padding-inline: 10px;
    }

    body.is-ks-surecart-checkout .ks-content-wrap > article.ks-card,
    body.is-ks-surecart-checkout article.page {
        border-radius: 22px !important;
    }
}

/* =========================================================
   CHECKOUTS PREMIUM UNIFIÉS — SureCart + Paid Memberships Pro
   =========================================================
   Objectif : les pages de paiement SureCart et PMPro doivent donner
   l'impression d'appartenir à la même application Kasendemi Sport.
   Les pages de présentation restent gérées par le plugin Premium Pages.
*/
body.is-ks-premium-checkout {
    --ks-checkout-blue: #2563eb;
    --ks-checkout-blue-dark: #1d4ed8;
    --ks-checkout-blue-deep: #0b2f72;
    --ks-checkout-blue-soft: #dbeafe;
    --ks-checkout-cyan: #81e9ff;
    --ks-checkout-navy: #071733;
    --ks-checkout-text: #0f172a;
    --ks-checkout-muted: #64748b;
    --ks-checkout-border: rgba(37, 99, 235, 0.22);
    --ks-checkout-border-strong: rgba(37, 99, 235, 0.34);
    --ks-checkout-shadow: 0 24px 70px rgba(15, 23, 42, 0.14);

    /* Variables communes utiles à SureCart et à certains composants de formulaire. */
    --sc-color-primary-50: #eff6ff;
    --sc-color-primary-100: #dbeafe;
    --sc-color-primary-200: #bfdbfe;
    --sc-color-primary-300: #93c5fd;
    --sc-color-primary-400: #60a5fa;
    --sc-color-primary-500: #2563eb;
    --sc-color-primary-600: #1d4ed8;
    --sc-color-primary-700: #1e40af;
    --sc-color-primary-800: #1e3a8a;
    --sc-color-primary-900: #172554;
    --sc-focus-ring-color-primary: rgba(37, 99, 235, 0.28);

    background:
        radial-gradient(circle at 10% 0%, rgba(129, 233, 255, 0.22), transparent 34%),
        radial-gradient(circle at 90% 8%, rgba(37, 99, 235, 0.20), transparent 36%),
        linear-gradient(180deg, #f6faff 0%, #eef6ff 48%, #f8fbff 100%) !important;
    color: var(--ks-checkout-text) !important;
}

body.is-ks-premium-checkout .site-content,
body.is-ks-premium-checkout .content-area,
body.is-ks-premium-checkout main#primary,
body.is-ks-premium-checkout .ks-content-wrap {
    background: transparent !important;
}

body.is-ks-premium-checkout .ks-container,
body.is-ks-premium-checkout .ks-content-wrap {
    max-width: 1280px;
}

body.is-ks-premium-checkout .ks-content-wrap > article.ks-card,
body.is-ks-premium-checkout article.page,
body.is-ks-premium-checkout .entry-content > .wp-block-group,
body.is-ks-premium-checkout .entry-content > .wp-block-columns,
body.is-ks-premium-checkout .entry-content > .pmpro,
body.is-ks-premium-checkout .entry-content > #pmpro_form,
body.is-ks-premium-checkout .entry-content > .surecart-checkout,
body.is-ks-premium-checkout .entry-content > .sc-checkout,
body.is-ks-premium-checkout .entry-content > .sc-form,
body.is-ks-premium-checkout .entry-content > [class*="surecart"] {
    border: 1px solid var(--ks-checkout-border) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(239, 246, 255, 0.96)) !important;
    box-shadow: var(--ks-checkout-shadow) !important;
    border-radius: 28px !important;
}

body.is-ks-premium-checkout .ks-content-wrap > article.ks-card,
body.is-ks-premium-checkout article.page {
    overflow: hidden;
}

body.is-ks-premium-checkout .entry-header {
    background:
        radial-gradient(circle at 20% 10%, rgba(129, 233, 255, 0.24), transparent 34%),
        linear-gradient(135deg, var(--ks-checkout-navy), var(--ks-checkout-blue-deep) 58%, var(--ks-checkout-blue)) !important;
    border-bottom: 1px solid rgba(129, 233, 255, 0.22) !important;
    color: #ffffff !important;
}

body.is-ks-premium-checkout .entry-title,
body.is-ks-premium-checkout .entry-header .entry-title {
    color: #ffffff !important;
    text-shadow: 0 12px 34px rgba(0, 0, 0, 0.26);
}

body.is-ks-premium-checkout .entry-content {
    color: var(--ks-checkout-text) !important;
}

body.is-ks-premium-checkout :is(h1, h2, h3, h4, h5, h6) {
    color: var(--ks-checkout-navy) !important;
}

body.is-ks-premium-checkout :is(a, .surecart-checkout a, [class*="surecart"] a, .pmpro a, #pmpro_form a) {
    color: var(--ks-checkout-blue-dark) !important;
}

body.is-ks-premium-checkout :is(input, select, textarea, .sc-input, .sc-select, .pmpro_form input[type="text"], .pmpro_form input[type="email"], .pmpro_form input[type="password"], .pmpro_form input[type="tel"], .pmpro_form input[type="number"], .pmpro_form select) {
    border: 1px solid rgba(37, 99, 235, 0.22) !important;
    border-radius: 14px !important;
    color: var(--ks-checkout-text) !important;
    background: #ffffff !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04) !important;
}

body.is-ks-premium-checkout :is(input, select, textarea, .sc-input, .sc-select, .pmpro_form input, .pmpro_form select, .pmpro_form textarea):focus {
    border-color: var(--ks-checkout-blue) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.14) !important;
    outline: none !important;
}

body.is-ks-premium-checkout :is(button, input[type="submit"], .button, .wp-block-button__link, .sc-button, .surecart-button, .pmpro_btn, .pmpro_button, #pmpro_btn-submit, [class*="sc-button"], [class*="surecart-button"]) {
    border-color: rgba(37, 99, 235, 0.35) !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
}

body.is-ks-premium-checkout :is(button:not(.menu-toggle), input[type="submit"], .wp-block-button__link, .sc-button--primary, .surecart-button-primary, .pmpro_btn, .pmpro_button, #pmpro_btn-submit, [class*="button-primary"], [class*="sc-button-primary"]) {
    background: linear-gradient(135deg, #60a5fa 0%, var(--ks-checkout-blue) 44%, var(--ks-checkout-blue-dark) 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.28) !important;
}

body.is-ks-premium-checkout :is(button:not(.menu-toggle), input[type="submit"], .wp-block-button__link, .sc-button--primary, .surecart-button-primary, .pmpro_btn, .pmpro_button, #pmpro_btn-submit, [class*="button-primary"], [class*="sc-button-primary"]):hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
}

/* PMPro — cartes et sections de paiement. */
body.is-ks-pmpro-checkout :is(#pmpro_form, form.pmpro_form, .pmpro, .pmpro_checkout, .pmpro_checkout-fields, .pmpro_checkout-fieldset, .pmpro_card, #pmpro_pricing_fields, #pmpro_user_fields, #pmpro_billing_address_fields, #pmpro_payment_information_fields, #pmpro_license, #pmpro_account_loggedin, #pmpro_tos_fields, .pmpro_submit) {
    color: var(--ks-checkout-text) !important;
}

body.is-ks-pmpro-checkout :is(.pmpro_card, .pmpro_checkout-fields, .pmpro_checkout-fieldset, #pmpro_pricing_fields, #pmpro_user_fields, #pmpro_billing_address_fields, #pmpro_payment_information_fields, #pmpro_license, #pmpro_account_loggedin, #pmpro_tos_fields, .pmpro_submit, .pmpro_checkout_box, .pmpro_invoice_wrap, .pmpro_billing_wrap) {
    border: 1px solid var(--ks-checkout-border) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.08) !important;
    border-radius: 22px !important;
    padding: clamp(18px, 2.2vw, 28px) !important;
    margin-bottom: 22px !important;
}

body.is-ks-pmpro-checkout :is(.pmpro_card_title, .pmpro_checkout-h2, .pmpro_checkout h2, #pmpro_form h2, #pmpro_form h3, .pmpro_form legend) {
    color: var(--ks-checkout-navy) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em;
}

body.is-ks-pmpro-checkout :is(.pmpro_checkout-field, .pmpro_form .pmpro_checkout-field) label,
body.is-ks-pmpro-checkout :is(.pmpro_form label, #pmpro_form label) {
    color: #173047 !important;
    font-weight: 800 !important;
}

body.is-ks-pmpro-checkout :is(.pmpro_asterisk, .pmpro_required, .pmpro_form .lite) {
    color: var(--ks-checkout-muted) !important;
}

body.is-ks-pmpro-checkout :is(.pmpro_message, .pmpro_error, .pmpro_success, #pmpro_message) {
    border-radius: 18px !important;
    border: 1px solid var(--ks-checkout-border-strong) !important;
    background: linear-gradient(135deg, #eff6ff, #ffffff) !important;
    color: #173047 !important;
    box-shadow: 0 12px 30px rgba(37, 99, 235, 0.10) !important;
}

body.is-ks-pmpro-checkout :is(.pmpro_error, .pmpro_message.pmpro_error) {
    border-color: rgba(239, 68, 68, 0.30) !important;
    background: linear-gradient(135deg, #fff1f2, #ffffff) !important;
    color: #7f1d1d !important;
}

body.is-ks-pmpro-checkout table,
body.is-ks-pmpro-checkout .pmpro_table {
    border-radius: 18px !important;
    overflow: hidden !important;
    border: 1px solid var(--ks-checkout-border) !important;
}

body.is-ks-pmpro-checkout table thead th,
body.is-ks-pmpro-checkout .pmpro_table thead th {
    background: linear-gradient(135deg, var(--ks-checkout-navy), var(--ks-checkout-blue-deep)) !important;
    color: #ffffff !important;
}

body.is-ks-pmpro-checkout table tbody td,
body.is-ks-pmpro-checkout .pmpro_table tbody td {
    background: #ffffff !important;
    color: #173047 !important;
}

/* SureCart — maintien de la même identité via composants web/parts. */
body.is-ks-surecart-checkout :is(.surecart-checkout, .sc-checkout, .sc-form, .sc-order-summary, .sc-card, .sc-product-line-item, .sc-line-item, [class*="surecart"], [class*="sc-checkout"], [class*="sc-order"], [class*="sc-summary"]) {
    --sc-color-primary-500: var(--ks-checkout-blue);
    --sc-color-primary-600: var(--ks-checkout-blue-dark);
    --sc-border-radius-medium: 16px;
    --sc-border-radius-large: 22px;
}

body.is-ks-surecart-checkout :is(.sc-card, .sc-order-summary, .sc-checkout-card, .surecart-card, [class*="sc-card"], [class*="order-summary"], [class*="checkout-summary"]) {
    border-color: var(--ks-checkout-border) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.08) !important;
    border-radius: 22px !important;
}

body.is-ks-surecart-checkout sc-button::part(base) {
    background: linear-gradient(135deg, #60a5fa 0%, #2563eb 48%, #1d4ed8 100%);
    border-color: rgba(37, 99, 235, 0.35);
    color: #ffffff;
    font-weight: 800;
    border-radius: 999px;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.28);
}

body.is-ks-surecart-checkout sc-button::part(label),
body.is-ks-surecart-checkout sc-button::part(prefix),
body.is-ks-surecart-checkout sc-button::part(suffix) {
    color: #ffffff;
}

body.is-ks-surecart-checkout sc-input::part(base),
body.is-ks-surecart-checkout sc-select::part(base),
body.is-ks-surecart-checkout sc-textarea::part(base) {
    border-color: rgba(37, 99, 235, 0.22);
    border-radius: 14px;
}

body.is-ks-surecart-checkout sc-card::part(base),
body.is-ks-surecart-checkout sc-order-summary::part(base),
body.is-ks-surecart-checkout sc-checkout-form::part(base) {
    border-color: rgba(37, 99, 235, 0.22);
    border-radius: 22px;
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.08);
}

@media (max-width: 768px) {
    body.is-ks-premium-checkout .ks-container,
    body.is-ks-premium-checkout .ks-content-wrap {
        width: calc(100% - 20px);
        padding-inline: 10px;
    }

    body.is-ks-premium-checkout .ks-content-wrap > article.ks-card,
    body.is-ks-premium-checkout article.page {
        border-radius: 22px !important;
    }

    body.is-ks-pmpro-checkout :is(.pmpro_card, .pmpro_checkout-fields, .pmpro_checkout-fieldset, #pmpro_pricing_fields, #pmpro_user_fields, #pmpro_billing_address_fields, #pmpro_payment_information_fields, #pmpro_license, #pmpro_account_loggedin, #pmpro_tos_fields, .pmpro_submit) {
        padding: 16px !important;
        border-radius: 18px !important;
    }
}


/* =========================================================
   PMPRO CHECKOUT — suppression du cadre global en trop
   =========================================================
   La page PMPro gardait trois niveaux visuels :
   1) la carte WordPress globale, 2) le bloc PMPro principal,
   3) les sections internes PMPro. On neutralise uniquement le
   cadre WordPress global pour conserver une page plus propre et
   cohérente avec SureCart, sans toucher aux champs ni aux cartes PMPro.
*/
body.is-ks-pmpro-checkout .ks-content-wrap > article.ks-card,
body.is-ks-pmpro-checkout article.page,
body.is-ks-pmpro-checkout .ks-content-wrap > article.hentry {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

body.is-ks-pmpro-checkout .ks-content-wrap > article.ks-card > .entry-content,
body.is-ks-pmpro-checkout article.page > .entry-content,
body.is-ks-pmpro-checkout .ks-content-wrap > article.hentry > .entry-content {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

body.is-ks-pmpro-checkout .ks-content-wrap > article.ks-card > .entry-header,
body.is-ks-pmpro-checkout article.page > .entry-header,
body.is-ks-pmpro-checkout .ks-content-wrap > article.hentry > .entry-header {
    border-radius: 24px !important;
    margin-bottom: 20px !important;
}

body.is-ks-pmpro-checkout .entry-content > #pmpro_form,
body.is-ks-pmpro-checkout .entry-content > .pmpro {
    margin-inline: auto !important;
}

/* =========================================================
   CHECKOUTS PREMIUM — textes gris rendus plus lisibles
   =========================================================
   Objectif : sur les fonds blancs PMPro/SureCart, les textes secondaires
   ne doivent plus apparaître trop pâles ou presque invisibles.
*/
body.is-ks-premium-checkout,
body.is-ks-pmpro-checkout,
body.is-ks-surecart-checkout {
    --ks-checkout-muted: #334155;
    --sc-color-gray-400: #475569;
    --sc-color-gray-500: #334155;
    --sc-color-gray-600: #1f2937;
    --sc-color-neutral-400: #475569;
    --sc-color-neutral-500: #334155;
    --sc-color-neutral-600: #1f2937;
}

body.is-ks-pmpro-checkout #pmpro_form :is(p, li, label, small, em, span, legend, td, th, .pmpro_level_description, .pmpro_level-expiration, .pmpro_checkout-field-description, .pmpro_form_field-description, .pmpro_checkout-h2-msg, .pmpro_checkout-h3-msg, .pmpro_thead-msg),
body.is-ks-pmpro-checkout .pmpro :is(p, li, label, small, em, span, td, th, .pmpro_level_description, .pmpro_level-expiration, .pmpro_checkout-field-description, .pmpro_form_field-description, .pmpro_checkout-h2-msg, .pmpro_checkout-h3-msg, .pmpro_thead-msg),
body.is-ks-pmpro-checkout :is(#pmpro_account_loggedin, #pmpro_account_loggedin p, #pmpro_account_loggedin span) {
    color: #173047 !important;
    opacity: 1 !important;
}

body.is-ks-pmpro-checkout #pmpro_form :is(strong, b),
body.is-ks-pmpro-checkout .pmpro :is(strong, b) {
    color: var(--ks-checkout-navy) !important;
    opacity: 1 !important;
}

body.is-ks-pmpro-checkout #pmpro_form :is(.lite, .pmpro_asterisk, .pmpro_required, .description, .pmpro_checkout-field-description, .pmpro_form_field-description, small),
body.is-ks-pmpro-checkout .pmpro :is(.lite, .pmpro_asterisk, .pmpro_required, .description, .pmpro_checkout-field-description, .pmpro_form_field-description, small) {
    color: #334155 !important;
    opacity: 1 !important;
}

body.is-ks-pmpro-checkout #pmpro_form :is(a, a span),
body.is-ks-pmpro-checkout .pmpro :is(a, a span) {
    color: var(--ks-checkout-blue-dark) !important;
}

body.is-ks-pmpro-checkout #pmpro_form :is(button, button *, input[type="submit"], .pmpro_btn, .pmpro_btn *, .pmpro_button, .pmpro_button *, #pmpro_btn-submit, #pmpro_btn-submit *) {
    color: #ffffff !important;
    opacity: 1 !important;
}

body.is-ks-surecart-checkout .entry-content :is(p, li, label, small, em, span):not(.wp-block-button__link):not(.button),
body.is-ks-surecart-checkout :is(.surecart-checkout, .sc-checkout, .sc-form, .sc-order-summary, .sc-card, [class*="surecart"], [class*="sc-checkout"], [class*="sc-order"], [class*="sc-summary"]) :is(p, li, label, small, em, span) {
    color: #173047 !important;
    opacity: 1 !important;
}

body.is-ks-surecart-checkout :is(a, a span, .surecart-checkout a, [class*="surecart"] a) {
    color: var(--ks-checkout-blue-dark) !important;
}

body.is-ks-surecart-checkout :is(button, button *, input[type="submit"], .wp-block-button__link, .wp-block-button__link *, .sc-button, .sc-button *, .surecart-button, .surecart-button *, [class*="sc-button"], [class*="sc-button"] *, [class*="surecart-button"], [class*="surecart-button"] *) {
    color: #ffffff !important;
    opacity: 1 !important;
}

