/* Hark Platform admin skin - AdminLTE v4 (Dashboard v2 style baseline) */
:root {
    --cms-brand: #3c8dbc;
}

.app-header.navbar {
    border-bottom: 1px solid rgba(0, 0, 0, .08);
}

body.cms-topnav-layout .app-header.navbar {
    min-height: 44px;
    background: #f1f4f8 !important;
    --bs-navbar-padding-y: 0 !important;
    --bs-navbar-padding-x: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
}

body.cms-topnav-layout .app-header > .container-fluid {
    min-height: 44px;
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
}

body.cms-topnav-layout .app-sidebar {
    display: none !important;
}

body.cms-topnav-layout .app-wrapper > .app-header,
body.cms-topnav-layout .app-wrapper > .app-main,
body.cms-topnav-layout .app-wrapper > .app-footer {
    margin-left: 0 !important;
}

body.cms-topnav-layout .app-header {
    position: sticky !important;
    top: 0;
    width: 100% !important;
    display: block !important;
    padding: 0 !important;
    z-index: 1035;
}

body.cms-topnav-layout .app-main {
    padding-top: 0 !important;
}

body.cms-topnav-layout .app-content-header {
    min-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

body.cms-topnav-layout .app-content-header > .container-fluid {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

body.cms-topnav-layout .app-main .app-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body.cms-topnav-layout .app-content > .container-fluid {
    padding-top: 0.95rem !important;
}

body.cms-topnav-layout .app-content > .container-fluid > :first-child {
    margin-top: 0 !important;
}

@media (max-width: 991.98px) {
    body.cms-topnav-layout .app-content > .container-fluid {
        padding-top: 0.7rem !important;
    }
}

body.cms-topnav-layout .app-header [data-lte-toggle="sidebar"] {
    display: none !important;
}

.cms-admin-menubar {
    flex: 0 0 100%;
    flex-basis: 100%;
    width: 100%;
    order: 2;
    border-top: 1px solid rgba(0, 0, 0, .06);
    border-bottom: 1px solid rgba(0, 0, 0, .14);
    background: #ffffff;
    margin: 0 !important;
}

.cms-admin-menubar .container-fluid {
    min-height: 1.85rem;
    padding-top: 0.15rem !important;
    padding-bottom: 0.15rem !important;
}

.cms-admin-menubar-shell {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 0.3rem;
}

.cms-admin-topbar-menu-toggle {
    width: 2.4rem;
    height: 2.4rem;
    min-width: 2.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.35rem;
    color: #334155;
}

.cms-admin-topbar-menu-toggle:hover {
    background: rgba(0, 0, 0, 0.05);
}

.cms-admin-menubar-mobile-toggle {
    display: none;
}

.cms-admin-menubar-list {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    gap: 0.22rem;
    align-items: center;
}

.cms-admin-menubar-link {
    font-size: .82rem;
    font-weight: 700;
    color: #334155 !important;
    display: inline-flex;
    align-items: center;
    min-height: 1.55rem;
    line-height: 1;
    padding: .12rem .5rem !important;
    border-radius: .35rem;
    white-space: nowrap;
}

.cms-admin-menubar-link.active {
    background: rgba(60, 141, 188, .17);
    color: #123a5a !important;
}

.cms-admin-menubar-link.dropdown-toggle::after {
    margin-top: 0;
    margin-left: .42rem;
    vertical-align: middle;
}

.cms-admin-menubar-dropdown {
    min-width: 15rem;
    width: min(21rem, calc(100vw - 1rem));
    max-width: calc(100vw - 1rem);
    max-height: min(70vh, calc(100dvh - 6.5rem));
    overflow-y: auto;
    margin-top: 0.2rem;
    left: 0;
    right: auto;
}

.cms-admin-menubar-dropdown .dropdown-item {
    padding: 0.3rem 0.95rem;
    line-height: 1.2;
}

.cms-admin-menubar.is-compact .cms-admin-menubar-mobile-toggle {
    display: inline-flex;
}

.cms-admin-menubar.is-compact .cms-admin-menubar-list {
    display: none;
    flex-direction: column;
    align-items: stretch;
}

.cms-admin-menubar.is-compact.is-open .cms-admin-menubar-list {
    display: flex;
}

@media (max-width: 767.98px) {
    .cms-admin-menubar .cms-admin-menubar-mobile-toggle {
        display: inline-flex;
    }
    .cms-admin-menubar .cms-admin-menubar-list {
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
    }
    .cms-admin-menubar.is-open .cms-admin-menubar-list {
        display: flex;
    }

    .cms-admin-menubar-link {
        width: 100%;
    }

    .cms-admin-menubar .cms-admin-menubar-item .dropdown-menu {
        position: static;
        inset: auto;
        transform: none;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin-top: 0;
        border: 0;
        border-top: 1px solid rgba(0, 0, 0, .08);
        border-radius: 0;
        box-shadow: none;
        background: #f8fafc;
    }
}

/* Topbalk: tickets, meldingen, fullscreen + user — één horizontale lijn */
.cms-navbar-tools {
    --cms-navbar-tool-size: 2.25rem;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 0.35rem !important;
}

.cms-navbar-tools > .nav-item {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    margin: 0;
    overflow: visible;
}

@media (max-width: 767.98px) {
    .cms-navbar-tools > .cms-navbar-fullscreen-item {
        display: none !important;
    }
}

.app-header.navbar > .container-fluid {
    overflow: visible;
}

.cms-navbar-tools .cms-navbar-tool-btn.nav-link,
.cms-navbar-tools button.cms-navbar-tool-btn {
    width: var(--cms-navbar-tool-size);
    height: var(--cms-navbar-tool-size);
    min-width: var(--cms-navbar-tool-size);
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 0.35rem;
    line-height: 1 !important;
    overflow: visible;
}

.cms-navbar-tools .cms-navbar-tool-btn:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

.cms-navbar-tools .cms-navbar-tool-btn:focus-visible {
    outline: 2px solid var(--cms-brand, #3c8dbc);
    outline-offset: 2px;
}

/* Vast symboolvlak: icoon gecentreerd, badge in hoek (bedekt bel-/chat-icoon niet) */
.cms-navbar-tool-symbol {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    line-height: 1;
    pointer-events: none;
}

.cms-navbar-tool-symbol > i {
    font-size: 1.125rem;
    line-height: 1;
    vertical-align: 0;
}

.cms-navbar-fs-slot {
    position: relative;
    width: 1.35rem;
    height: 1.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.cms-navbar-fs-slot > i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.05rem;
    line-height: 1;
}

/*
 * Badges: midden op het hoekpunt rechtsboven van het gecentreerde symbool
 * (--cms-navbar-tool-size en .cms-navbar-tool-symbol width moeten gelijk lopen).
 */
.cms-navbar-ticket-link .cms-navbar-ticket-badge,
.cms-navbar-notify-link .cms-navbar-notify-badge {
    position: absolute;
    left: calc(50% + 0.675rem);
    top: calc(50% - 0.675rem);
    right: auto;
    transform: translate(-50%, -50%);
    z-index: 2;
    min-width: 1.15rem;
    padding: 0.08rem 0.28rem;
    font-size: 0.6rem;
    font-weight: 700;
    line-height: 1.15;
    border-radius: 0.3rem;
    text-align: center;
    pointer-events: none;
}

.cms-navbar-ticket-link .cms-navbar-ticket-badge {
    color: #fff;
    background: #dc3545;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.cms-navbar-notify-link .cms-navbar-notify-badge {
    color: #1a1a1a;
    background: #ffc107;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
}

/* User-trigger: zelfde middenlijn als tool-knoppen */
.cms-navbar-tools .cms-navbar-user-trigger--toolbar {
    min-height: var(--cms-navbar-tool-size);
    padding: 0 0.5rem !important;
    margin: 0;
    align-items: center !important;
    border-radius: 0.35rem;
}

/* Deep links vanaf Meldingen: veld niet onder vaste header verbergen */
[id^="hc-plugin-field-"],
#openai_api_key {
    scroll-margin-top: 5.5rem;
}

/* Meldingen-pagina: kaarten per actiepunt (volle kolombreedte) */
.cms-notification-card {
    width: 100%;
    max-width: none;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 0.5rem;
    border-left: 4px solid #f0ad4e;
    background: var(--bs-body-bg, #fff);
}

.cms-notification-card__icon {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.05rem;
}

/* Titel en toelichting altijd onder elkaar (geen visuele “één regel”-flow) */
.cms-notification-card__main,
.cms-notification-card__text {
    display: block;
    width: 100%;
    max-width: none;
}

.cms-notification-card__body {
    max-width: none;
}

.cms-notification-card__text .card-title {
    display: block;
    width: 100%;
    max-width: none;
}

.app-sidebar .brand-link {
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: .35rem;
    padding-bottom: .35rem;
}

.app-sidebar .brand-link .cms-sidebar-brand-logo {
    width: auto;
    height: 34px;
    max-width: 168px;
    object-fit: contain;
    object-position: left center;
    display: block;
    margin-left: .15rem;
}

/* Compact merkteken in topbalk op mobiel (zelfde link als zijmenu-brand) */
.cms-admin-navbar-logo-mobile {
    display: block;
    height: auto;
    max-height: 30px;
    width: auto;
    max-width: min(11rem, 46vw);
    object-fit: contain;
    object-position: center;
}

.cms-admin-navbar-logo-desktop {
    display: block;
    height: 21px;
    width: auto;
    max-width: 124px;
    object-fit: contain;
    object-position: left center;
}

/* Zijmenu (mobiel overlay): logo schaalt binnen vaste brand-hoogte v.h. AdminLTE-scrollberekening */
@media (max-width: 991.98px) {
    .app-sidebar .sidebar-brand {
        padding-left: 0.65rem;
        padding-right: 0.65rem;
    }

    .app-sidebar .brand-link {
        width: 100%;
        min-height: 0;
        max-height: 100%;
        padding-top: 0.25rem;
        padding-bottom: 0.25rem;
        box-sizing: border-box;
    }

    .app-sidebar .brand-link .cms-sidebar-brand-logo {
        max-width: 100%;
        margin-left: 0;
        margin-right: auto;
        max-height: 28px;
        height: auto;
        width: auto;
    }
}

.sidebar-menu .nav-link.active {
    background-color: rgba(60, 141, 188, .18);
    color: #fff;
}

.small-box .icon > i,
.small-box-icon > i {
    opacity: .22;
}

.card .card-header {
    border-bottom: 1px solid rgba(0, 0, 0, .07);
}

.table td,
.table th {
    vertical-align: middle;
}

.btn-xs {
    padding: .2rem .45rem;
    font-size: .75rem;
    line-height: 1.2;
    border-radius: .2rem;
}

/* Subtiele interactie-feedback op knoppen */
.btn {
    transition: transform .14s ease, box-shadow .16s ease, filter .16s ease;
}

.btn:hover:not(:disabled):not(.disabled) {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
}

.btn:active:not(:disabled):not(.disabled) {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

/* Centrale loading-state voor submitknoppen */
.btn.cms-btn-loading {
    position: relative;
    pointer-events: none;
    cursor: wait;
    opacity: .9;
    padding-right: 2.15rem;
}

.btn.cms-btn-loading::after {
    content: "";
    position: absolute;
    right: .75rem;
    top: 50%;
    width: .9rem;
    height: .9rem;
    margin-top: -.45rem;
    border-radius: 50%;
    border: 2px solid currentColor;
    border-right-color: transparent;
    opacity: .85;
    animation: cms-btn-spin .72s linear infinite;
}

@keyframes cms-btn-spin {
    to {
        transform: rotate(360deg);
    }
}

.login-page .login-box {
    width: 380px;
}

.login-page .login-logo a {
    color: #2c3b41;
}

.login-card-body .input-group-text {
    min-width: 42px;
    justify-content: center;
}

.sidebar-menu .nav-treeview {
    margin-left: .35rem;
    border-left: 1px solid rgba(255,255,255,.12);
    padding-left: .35rem;
}

.sidebar-menu .nav-treeview .nav-link {
    padding-top: .38rem;
    padding-bottom: .38rem;
}

.sidebar-menu .nav-arrow {
    margin-left: auto;
    transition: transform .18s ease;
}

.sidebar-menu .nav-item.menu-open > .nav-link .nav-arrow {
    transform: rotate(-90deg);
}

.sidebar-menu .nav-treeview .nav-link.active {
    background-color: rgba(60, 141, 188, .26);
}

.sidebar-menu .nav-section-toggle {
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 700;
    color: rgba(255,255,255,.78);
    border-top: 1px solid rgba(255,255,255,.08);
    margin-top: .25rem;
}

.sidebar-menu .nav-section-toggle:hover,
.sidebar-menu .nav-item.section-open > .nav-section-toggle {
    color: #fff;
    background-color: rgba(255,255,255,.06);
}

/* Hark-toolkoppen: alleen directe link, zelfde uiterlijk als sectiekop (geen submenu in zijbalk). */
.sidebar-menu .nav-section-entry {
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 800;
    color: rgba(255,255,255,.78);
    border-top: 1px solid rgba(255,255,255,.08);
    margin-top: .25rem;
}

.sidebar-menu .nav-section-entry:hover,
.sidebar-menu .nav-section-entry.active {
    color: #fff;
    background-color: rgba(255,255,255,.06);
}

.sidebar-menu .nav-section-body > .nav {
    padding-left: .15rem;
}

/* Topbalk (menu-knop, logo) blijft zichtbaar bij scrollen op mobiel/tablet */
body.layout-fixed.fixed-header .app-header {
    z-index: 1039;
    padding-top: env(safe-area-inset-top, 0);
}

.cms-page-submenu {
    padding: .65rem .75rem;
    border: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, .1));
    border-radius: .5rem;
    background: var(--bs-body-bg, #fff);
}

.cms-page-submenu .nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: stretch;
}

.cms-page-submenu-title {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
    color: var(--bs-secondary-color, #6c757d);
    margin-bottom: .45rem;
}

@media (max-width: 575.98px) {
    .cms-page-submenu .nav {
        flex-direction: column;
    }

    .cms-page-submenu .nav > .btn {
        width: 100%;
        justify-content: flex-start;
        text-align: left;
    }
}

/* Zijmenu: subitems leesbaar op smal scherm (geen afgekapte regels) */
@media (max-width: 991.98px) {
    .app-sidebar .sidebar-menu .nav-link {
        align-items: flex-start;
    }

    .app-sidebar .sidebar-menu .nav-link > .nav-icon {
        margin-top: 0.2rem;
    }

    .app-sidebar .sidebar-menu .nav-link p {
        display: block;
        width: calc(100% - 2rem);
        max-width: calc(100% - 2rem);
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
        line-height: 1.3;
        padding-right: 1.6rem;
        box-sizing: border-box;
    }

    .app-sidebar .sidebar-menu .nav-link > .nav-arrow,
    .app-sidebar .sidebar-menu .nav-link p > .nav-arrow {
        top: 0.55rem;
        transform: none;
    }

    .app-sidebar .sidebar-menu .nav-item.menu-open > .nav-link .nav-arrow,
    .app-sidebar .sidebar-menu .nav-item.menu-open > .nav-link p > .nav-arrow {
        transform: rotate(-90deg);
    }

    .app-sidebar .sidebar-menu .nav-section-toggle p > .nav-arrow {
        top: 0.55rem;
    }

    .app-sidebar .sidebar-menu .nav-item.section-open > .nav-section-toggle .nav-arrow {
        transform: rotate(-90deg);
    }
}

.cms-navbar-user-avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--cms-brand), #2a6f8f);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
    user-select: none;
}

.cms-navbar-user-trigger {
    border-radius: 0.375rem;
}

.cms-navbar-user-trigger:hover,
.cms-navbar-user-trigger:focus-visible {
    background-color: rgba(0, 0, 0, 0.045);
}

/* Eigen chevron i.p.v. dubbele Bootstrap-caret */
.cms-navbar-user-trigger.dropdown-toggle::after {
    display: none;
}

.cms-navbar-user-chevron {
    font-size: 0.65rem;
    opacity: 0.75;
    transition: transform 0.15s ease;
}

.cms-navbar-user-trigger[aria-expanded="true"] .cms-navbar-user-chevron {
    transform: rotate(180deg);
}

/*
 * Gebruikersmenu: custom JS zet alleen .show (geen Bootstrap Dropdown + Popper).
 * Zonder [data-bs-popper] past Bootstrap .dropdown-menu-end niet toe → menu hing links
 * en liep op smalle schermen uit beeld. Lijn uit op de rechterkant van de trigger.
 */
.app-header .navbar-nav > .nav-item.dropdown .dropdown-menu.dropdown-menu-end {
    top: 100%;
    right: 0;
    left: auto;
    margin-top: 0.125rem;
    max-width: min(20rem, calc(100vw - 1rem));
}

/* Mail-template placeholders: geen Popper in stub bootstrap.bundle.js — menu uitlijnen op trigger */
.hc-mail-ph-dropdown {
    position: relative;
    display: inline-block;
    vertical-align: baseline;
}
.hc-mail-ph-dropdown .dropdown-menu.dropdown-menu-end {
    top: 100%;
    right: 0;
    left: auto;
    margin-top: 0.125rem;
}

.cms-user-menu .cms-user-menu-identity {
    padding: 0.65rem 1rem 0.55rem;
    border-bottom: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, 0.08));
    margin-bottom: 0.15rem;
    list-style: none;
    max-width: 18rem;
}

.cms-user-menu .cms-user-menu-name {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--bs-emphasis-color, #212529);
}

.cms-user-menu .cms-user-menu-email {
    font-size: 0.75rem;
    line-height: 1.3;
    margin-top: 0.15rem;
    color: var(--bs-secondary-color, #6c757d);
}

.cms-user-menu .dropdown-header {
    text-align: left;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    color: var(--bs-secondary-color, #6c757d);
    margin-top: 0.5rem;
    margin-bottom: 0.05rem;
    padding-top: 0.35rem;
    padding-bottom: 0.2rem;
}

/* Eerste sectie direct onder identiteitsblok */
.cms-user-menu > li:nth-child(2) .dropdown-header {
    margin-top: 0;
    padding-top: 0.25rem;
}

.cms-user-menu .dropdown-item {
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
    font-size: 0.875rem;
}

.cms-user-menu .dropdown-item i {
    width: 1.125rem;
    text-align: center;
}

/* Webshop: horizontale tabjes onder de paginatitel (zelfde als zijmenu) */
.webshop-admin-tabs {
    gap: 0.15rem;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}
.webshop-admin-tabs .nav-link {
    border: 1px solid transparent;
    border-bottom: none;
    margin-bottom: -1px;
    color: var(--bs-secondary-color, #6c757d);
}
.webshop-admin-tabs .nav-link:hover {
    border-color: var(--bs-border-color-translucent, rgba(0, 0, 0, 0.1));
    color: var(--bs-emphasis-color, #212529);
}
.webshop-admin-tabs .nav-link.active {
    color: var(--bs-primary, #0d6efd);
    background-color: var(--bs-body-bg, #fff);
    border-color: var(--bs-border-color, #dee2e6);
    border-bottom-color: var(--bs-body-bg, #fff);
    font-weight: 600;
}

/* -------------------------------------------------------------------------- */
/* Data-overzichten (AdminLTE v4 / Bootstrap 5 baseline)                      */
/* -------------------------------------------------------------------------- */
.app-content .card .table {
    margin-bottom: 0;
}

.app-content .table thead th,
.app-content .table thead.table-light th {
    font-weight: 600;
    font-size: 0.8125rem;
    vertical-align: middle;
    border-bottom-width: 2px;
    background-color: var(--bs-secondary-bg, #e9ecef);
    color: var(--bs-emphasis-color, #212529);
}

.app-content .table.table-sm > :not(caption) > * > * {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}

.app-content .table-hover > tbody > tr:hover > * {
    box-shadow: inset 0 0 0 9999px rgba(60, 141, 188, 0.065);
}

.app-content .card .table-responsive {
    border-radius: inherit;
}

/* Inline acties: select + knop op één lijn (SaaS sites / impersonatie) */
.app-content .input-group.input-group-sm > .form-select {
    min-width: 9.5rem;
    max-width: 14rem;
}

/* -------------------------------------------------------------------------- */
/* Plug-inpagina’s (/plugins/p/…) — hero + subnav (Campagne-tracking-stijl)   */
/* -------------------------------------------------------------------------- */
.hc-plugin-hero {
    background:
        radial-gradient(circle at 12% 14%, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0) 46%),
        linear-gradient(135deg, #c9e7ff 0%, #afe0ff 52%, #9fdcff 100%);
    border-radius: var(--bs-border-radius-xl, 0.5rem) var(--bs-border-radius-xl, 0.5rem) 0 0;
}

.hc-plugin-hero--compact {
    border-radius: var(--bs-border-radius-xl, 0.5rem);
}

.hc-ct-hub-form-stack {
    margin-top: 0.25rem;
}

.hc-plugin-hero .letter-spacing-1 {
    letter-spacing: 0.06em;
}

/* Hero-acties rechtsboven (zelfde rij als titel/tekst) */
.hc-plugin-hero__actions {
    align-self: flex-start;
    min-width: 0;
    width: 100%;
}
.hc-hero-actions-mobile {
    display: none;
    width: 100%;
}

@media (min-width: 992px) {
    .hc-plugin-hero__actions {
        width: auto;
    }
}

@media (max-width: 991.98px) {
    .hc-hero-actions-mobile {
        display: block;
    }
    .hc-hero-actions-desktop {
        display: none !important;
    }
    .hc-plugin-hero__actions .btn {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 100%;
        text-align: center;
        white-space: normal;
        line-height: 1.25;
    }
}

.hc-plugin-subnav {
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-top: 0;
    border-radius: 0 0 var(--bs-border-radius-xl, 0.5rem) var(--bs-border-radius-xl, 0.5rem);
    box-shadow: var(--bs-box-shadow-sm, 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075));
}

.hc-plugin-subnav .nav-link {
    color: var(--bs-primary, #0d6efd);
    font-weight: 500;
}

.hc-plugin-subnav .nav-link i {
    opacity: 0.95;
}

.hc-plugin-subnav .nav-link:hover:not(.active) {
    color: var(--bs-primary, #0d6efd);
    background-color: rgba(13, 110, 253, 0.08);
}

.hc-plugin-subnav .nav-link.active {
    color: #fff !important;
}

/* -------------------------------------------------------------------------- */
/* iOS / iPhone: safe areas — onderbalken, modals en menu’s boven home-indicator */
/* Vereist viewport meta met viewport-fit=cover (zie admin-layout).              */
/* -------------------------------------------------------------------------- */
.app-footer {
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 991.98px) {
    .app-sidebar .sidebar-wrapper {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }
}

.modal-footer {
    padding-bottom: calc(var(--bs-modal-footer-padding, 0.75rem) + env(safe-area-inset-bottom, 0px));
}

.dropdown-menu {
    max-height: 70vh;
    max-height: min(70vh, calc(100dvh - 5.5rem));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

@media (min-width: 992px) {
    .dropdown-menu {
        max-height: none;
        overflow-y: visible;
    }
}

/* Hark ADS cohesive hub styles */
.growth-suite-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.growth-suite-switcher .btn {
    border-radius: 999px;
    font-weight: 600;
}
.growth-suite-switcher-mobile {
    display: none;
}

@media (max-width: 767.98px) {
    .growth-suite-switcher {
        display: none;
    }
    .growth-suite-switcher-mobile {
        display: block;
        width: 100%;
    }
}

.hc-plugin-suite-layout-wrap,
.hc-ct-hub-page-body {
    min-width: 0;
}

/* Hark Ads: one consistent heading/subheading system across all sub-pages */
.hc-ct-hub-page-body h2,
.hc-ct-hub-page-body .h2 {
    color: var(--hc-ui-heading, #0f172a);
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 0.45rem;
}

.hc-ct-hub-page-body h3,
.hc-ct-hub-page-body h4,
.hc-ct-hub-page-body h5,
.hc-ct-hub-page-body h6,
.hc-ct-hub-page-body .h3,
.hc-ct-hub-page-body .h4,
.hc-ct-hub-page-body .h5,
.hc-ct-hub-page-body .h6,
.hc-ct-hub-page-body .card-header.fw-semibold,
.hc-ct-hub-page-body summary.card-header {
    color: var(--hc-ui-heading, #0f172a);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    margin-bottom: 0.35rem;
}

.hc-ct-hub-page-body .text-body-secondary,
.hc-ct-hub-page-body .small.text-body-secondary,
.hc-ct-hub-page-body p.small,
.hc-ct-hub-page-body .form-text {
    color: var(--hc-ui-subheading, #475569) !important;
}

/* Keep all Ads sub-headings visually identical (no random blue/size changes) */
.hc-ct-hub-page-body .card-header,
.hc-ct-hub-page-body .card-header.fw-semibold,
.hc-ct-hub-page-body .accordion-button,
.hc-ct-hub-page-body summary.card-header {
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: var(--hc-ui-heading, #0f172a) !important;
}

.hc-ct-hub-page-body h3.text-primary,
.hc-ct-hub-page-body h4.text-primary,
.hc-ct-hub-page-body h5.text-primary,
.hc-ct-hub-page-body h6.text-primary,
.hc-ct-hub-page-body .h3.text-primary,
.hc-ct-hub-page-body .h4.text-primary,
.hc-ct-hub-page-body .h5.text-primary,
.hc-ct-hub-page-body .h6.text-primary {
    color: var(--hc-ui-heading, #0f172a) !important;
}

.hc-ct-hub-page-body h3 + p.small,
.hc-ct-hub-page-body h4 + p.small,
.hc-ct-hub-page-body h5 + p.small,
.hc-ct-hub-page-body h6 + p.small,
.hc-ct-hub-page-body .h3 + p.small,
.hc-ct-hub-page-body .h4 + p.small,
.hc-ct-hub-page-body .h5 + p.small,
.hc-ct-hub-page-body .h6 + p.small {
    margin-top: 0.15rem;
    color: var(--hc-ui-subheading, #475569) !important;
}

/* campaign_tracker affiliate partials: force one fixed heading/subheading design */
.hc-ct-hub-page-body #affiliate-product-landing-list h2,
.hc-ct-hub-page-body #affiliate-product-landing-list .h5,
.hc-ct-hub-page-body #affiliate-product-landing-manage h2,
.hc-ct-hub-page-body #affiliate-product-landing-manage h3,
.hc-ct-hub-page-body #affiliate-product-landing-manage h4,
.hc-ct-hub-page-body #affiliate-product-landing-manage .h5,
.hc-ct-hub-page-body #affiliate-product-landing-manage .h6,
.hc-ct-hub-page-body #affiliate-product-landing-manage .ap-flow-step__title,
.hc-ct-hub-page-body #affiliate-product-landing-list .ap-list-title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: var(--hc-ui-heading, #0f172a) !important;
    letter-spacing: normal !important;
}

.hc-ct-hub-page-body #affiliate-product-landing-list p.small,
.hc-ct-hub-page-body #affiliate-product-landing-manage p.small,
.hc-ct-hub-page-body #affiliate-product-landing-manage .ap-flow-step__lead,
.hc-ct-hub-page-body #affiliate-product-landing-list .ap-list-stats {
    color: var(--hc-ui-subheading, #475569) !important;
}

.hc-ct-hub-page-body .hc-ct-section-title {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.005em;
    color: var(--hc-ui-heading, #0f172a);
    margin: 0 0 0.35rem 0;
}

.hc-ct-hub-page-body .hc-ct-section-title i {
    font-size: 0.95rem;
    color: var(--bs-primary, #0d6efd);
}

.hc-ct-hub-page-body .hc-ct-section-subtitle {
    margin: 0;
    color: var(--hc-ui-subheading, #475569) !important;
    font-size: 1rem;
    line-height: 1.45;
}

.hc-ct-hub-rail {
    --hc-rail-active-bg: var(--bs-primary, #0d6efd);
    --hc-rail-active-fg: #fff;
    --hc-rail-hover-bg: rgba(13, 110, 253, 0.08);
    top: 1rem;
	/*
    max-height: calc(100dvh - 2rem);
    overflow: auto;
    scrollbar-gutter: stable;
	*/
}

.hc-ct-hub-rail .hc-ct-rail-label {
    font-size: 0.65rem;
    letter-spacing: 0.06em;
}

.hc-ct-hub-rail .nav-link {
    transition: background-color 0.14s ease, color 0.14s ease;
}

.hc-ct-hub-rail .nav-link:hover:not(.active) {
    background: var(--hc-rail-hover-bg);
}

.hc-ct-hub-rail .nav-link.active {
    background: transparent !important;
    color: var(--hc-ui-heading, #0f172a) !important;
    font-weight: 700;
    box-shadow: none;
}

.hc-ct-hub-rail .nav-link.active.bg-primary,
.hc-ct-hub-rail .nav-link.active.text-white {
    background: transparent !important;
    color: var(--hc-ui-heading, #0f172a) !important;
}

.hc-ct-hub-rail .nav-link.active i,
.hc-ct-hub-rail .nav-link.active span {
    color: var(--hc-ui-heading, #0f172a) !important;
}

.hc-ct-rail-group .hc-ct-rail-group-toggle {
    border-radius: 0.4rem;
}

.hc-ct-rail-group .hc-ct-rail-group-toggle:hover {
    background: var(--hc-rail-hover-bg);
}

.hc-ct-rail-group .hc-ct-rail-group-toggle i {
    transition: transform 0.16s ease;
}

.hc-ct-rail-group.is-open .hc-ct-rail-group-toggle i {
    transform: rotate(180deg);
}

.hc-ct-rail-subitems {
    border-color: var(--bs-border-color-translucent, rgba(0, 0, 0, 0.12)) !important;
}

.hc-plugin-suite-rail-hash.is-active {
    background: transparent !important;
    color: var(--hc-ui-heading, #0f172a) !important;
    font-weight: 700;
}

@media (max-width: 991.98px) {
    .hc-ct-hub-rail {
        position: static !important;
        top: auto;
        max-height: none;
        overflow: visible;
    }
}

/* -------------------------------------------------------------------------- */
/* Uniform Clean Tool Design                                                   */
/* -------------------------------------------------------------------------- */
.app-sidebar.cms-sidebar-clean {
    background: #f3f5f9 !important;
    border-right: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: none !important;
}

.app-sidebar.cms-sidebar-clean .brand-link {
    border-bottom: 1px solid rgba(15, 23, 42, 0.09);
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-link {
    color: #1f2937;
    border-radius: 0.6rem;
    margin: 0.1rem 0.35rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-link .nav-icon {
    color: #4b5563;
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-link:hover {
    background: #e8edf6;
    color: #0f172a;
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-link.active,
.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-treeview .nav-link.active {
    background: #0d6efd;
    color: #fff !important;
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-link.active .nav-icon,
.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-treeview .nav-link.active .nav-icon {
    color: #fff;
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-treeview {
    margin-left: 0.85rem;
    border-left: 1px solid rgba(15, 23, 42, 0.12);
    padding-left: 0.35rem;
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-section-toggle,
.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-section-entry {
    color: #64748b;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-section-toggle:hover,
.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-section-entry:hover,
.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-item.section-open > .nav-section-toggle,
.app-sidebar.cms-sidebar-clean .sidebar-menu .nav-section-entry.active {
    background: #e8edf6;
    color: #0f172a;
}

.app-sidebar.cms-sidebar-clean .nav-header {
    color: #94a3b8 !important;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 0.8rem 0.65rem 0.25rem;
}

.hc-tool-header {
    background:
        radial-gradient(circle at 12% 14%, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0) 46%),
        linear-gradient(135deg, #c9e7ff 0%, #afe0ff 52%, #9fdcff 100%) !important;
    border: 1px solid rgba(56, 189, 248, 0.24);
    box-shadow: 0 6px 16px rgba(14, 116, 210, 0.08);
}

.hc-tool-header__icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.74);
    color: #1d4ed8;
    border: 1px solid rgba(59, 130, 246, 0.22);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    flex: 0 0 2.7rem;
}

.hc-tool-header__icon i {
    font-size: 1rem;
}

.hc-tool-header .hc-plugin-hero__actions .btn {
    border-radius: 999px;
    font-weight: 600;
    padding-inline: 1rem;
    box-shadow: none !important;
}

.hc-tool-header .hc-plugin-hero__actions .btn.btn-primary {
    background: rgba(255, 255, 255, 0.56);
    border-color: rgba(14, 116, 210, 0.3);
    color: #0b3b63;
}

.hc-tool-header .hc-plugin-hero__actions .btn.btn-primary:hover {
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(14, 116, 210, 0.38);
    color: #082f49;
}

.hc-tool-header .hc-plugin-hero__actions .btn.btn-outline-primary {
    background: rgba(255, 255, 255, 0.42);
    border-color: rgba(14, 116, 210, 0.24);
    color: #0b3b63;
}

.hc-tool-header .hc-plugin-hero__actions .btn.btn-outline-primary:hover {
    background: rgba(255, 255, 255, 0.64);
    border-color: rgba(14, 116, 210, 0.34);
    color: #082f49;
}

.hc-tool-header .btn.btn-primary,
.app-main .app-content .btn.btn-primary {
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%);
    border-color: #1d4ed8;
    color: #fff;
}

.hc-tool-header .btn.btn-primary:hover,
.app-main .app-content .btn.btn-primary:hover {
    background: linear-gradient(135deg, #1d4ed8 0%, #0284c7 100%);
    border-color: #1e40af;
    color: #fff;
}

.hc-tool-header .btn.btn-outline-primary,
.app-main .app-content .btn.btn-outline-primary {
    border-color: rgba(29, 78, 216, 0.4);
    color: #1e40af;
    background: rgba(255, 255, 255, 0.9);
}

.hc-tool-header .btn.btn-outline-primary:hover,
.app-main .app-content .btn.btn-outline-primary:hover {
    background: rgba(219, 234, 254, 0.95);
    border-color: rgba(29, 78, 216, 0.52);
    color: #1e3a8a;
}

.hc-tool-header .form-select,
.app-main .app-content .form-select {
    border-radius: 0.65rem;
    border-color: rgba(30, 64, 175, 0.22);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.hc-tool-header .form-select:focus,
.app-main .app-content .form-select:focus {
    border-color: rgba(37, 99, 235, 0.65);
    box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.18);
}

.app-main .app-content .dropdown-menu {
    border: 1px solid rgba(37, 99, 235, 0.2);
    border-radius: 0.75rem;
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.14);
    padding: 0.4rem;
}

.app-main .app-content .dropdown-item {
    border-radius: 0.45rem;
    font-weight: 500;
}

.app-main .app-content .dropdown-item:hover,
.app-main .app-content .dropdown-item:focus {
    background: rgba(37, 99, 235, 0.1);
    color: #1e3a8a;
}

.app-main .app-content .hc-tool-header.hc-plugin-hero h1,
.app-main .app-content .hc-tool-header.hc-plugin-hero h2,
.app-main .app-content .hc-tool-header.hc-plugin-hero h3,
.app-main .app-content .hc-tool-header.hc-plugin-hero .h4,
.app-main .app-content .hc-tool-header.hc-plugin-hero .h5,
.app-main .app-content .growth-suite-hero h1,
.app-main .app-content .growth-suite-hero h2,
.app-main .app-content .growth-suite-hero h3,
.app-main .app-content .growth-suite-hero .h4,
.app-main .app-content .growth-suite-hero .h5 {
    color: #0b2a4a !important;
}

.app-main .app-content .hc-tool-header.hc-plugin-hero .text-body-secondary,
.app-main .app-content .growth-suite-hero .text-body-secondary,
.app-main .app-content .hc-tool-header.hc-plugin-hero .form-label,
.app-main .app-content .growth-suite-hero .form-label {
    color: rgba(15, 41, 71, 0.82) !important;
}

.growth-suite-hero,
.growth-suite-hero.hc-tool-header {
    background:
        radial-gradient(circle at 12% 14%, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0) 46%),
        linear-gradient(135deg, #c9e7ff 0%, #afe0ff 52%, #9fdcff 100%) !important;
    border: 1px solid rgba(56, 189, 248, 0.24) !important;
    color: #0b2a4a;
    box-shadow: 0 6px 16px rgba(14, 116, 210, 0.08) !important;
}

.hc-tool-header .growth-suite-switcher {
    margin-top: 0 !important;
    justify-content: flex-end;
}

.hc-tool-header .growth-suite-switcher .btn {
    border-radius: 999px;
}

@media (max-width: 991.98px) {
    .hc-tool-header .growth-suite-switcher {
        justify-content: flex-start;
    }
}

@media (max-width: 767.98px) {
    .hc-tool-header .hc-plugin-hero__actions {
        width: 100%;
    }

    .hc-tool-header .hc-plugin-hero__actions .growth-suite-switcher {
        width: 100%;
    }
}

.hc-tool-help-card {
    border-radius: 0.65rem;
    border-color: rgba(15, 23, 42, 0.12) !important;
    background: #fbfcff;
}

.hc-tool-help-card__title {
    color: #1f2937;
}

.hc-tool-content-card {
    border-radius: 0.75rem;
    border-color: rgba(15, 23, 42, 0.11);
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
}

.hc-plugin-suite-layout .hc-ct-hub-rail,
.hc-admin-page-hub .hc-ct-hub-rail {
    border-color: rgba(15, 23, 42, 0.11) !important;
    background: #f8fafd !important;
}

/* -------------------------------------------------------------------------- */
/* Global Admin/Site Uniformity                                                */
/* -------------------------------------------------------------------------- */
:root {
    --hc-ui-heading: #0f172a;
    --hc-ui-subheading: #475569;
    --hc-ui-border: rgba(15, 23, 42, 0.11);
    --hc-ui-card-bg: #ffffff;
    --hc-ui-soft-bg: #f8fafd;
}

.app-main .app-content h1,
.app-main .app-content h2,
.app-main .app-content h3,
.app-main .app-content h4,
.app-main .app-content h5,
.app-main .app-content h6,
.app-main .app-content .h1,
.app-main .app-content .h2,
.app-main .app-content .h3,
.app-main .app-content .h4,
.app-main .app-content .h5,
.app-main .app-content .h6 {
    color: var(--hc-ui-heading);
}

.app-main .app-content .small.text-body-secondary,
.app-main .app-content .text-body-secondary.small,
.app-main .app-content p.text-body-secondary,
.app-main .app-content .card-subtitle,
.app-main .app-content .hc-section-subtitle {
    color: var(--hc-ui-subheading) !important;
}

.app-main .app-content .fw-semibold {
    color: var(--hc-ui-heading);
}

.app-main .app-content .form-text {
    color: var(--hc-ui-subheading);
}

.app-main .app-content .card {
    border-color: var(--hc-ui-border);
    border-radius: 0.75rem;
    background: var(--hc-ui-card-bg);
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
}

@media (prefers-contrast: high) {
    /* Override AdminLTE high-contrast fallback that forces thick black borders. */
    .app-main .app-content .card {
        border-width: 1px !important;
        border-style: solid;
        border-color: var(--hc-ui-border) !important;
    }

    .app-main .app-content .card .table-responsive {
        border: 1px solid var(--hc-ui-border) !important;
    }

    .app-main .app-content .table,
    .app-main .app-content .table-bordered,
    .app-main .app-content .table > :not(caption) > * > * {
        border-color: var(--hc-ui-border) !important;
    }
}

/* Defensive override for dynamic content that injects hard black borders. */
.app-main .app-content .border-black,
.app-main .app-content .border-dark,
.app-main .app-content .table-bordered,
.app-main .app-content .table > :not(caption) > * > *,
.app-main .app-content [style*="border-color:#000"],
.app-main .app-content [style*="border-color: #000"],
.app-main .app-content [style*="border:1px solid #000"],
.app-main .app-content [style*="border: 1px solid #000"],
.app-main .app-content [style*="border:2px solid #000"],
.app-main .app-content [style*="border: 2px solid #000"],
.app-main .app-content [style*="border:#000" i],
.app-main .app-content [style*="border: #000" i],
.app-main .app-content [style*="border-color:#000000" i],
.app-main .app-content [style*="border-color: #000000" i],
.app-main .app-content [style*="border:black" i],
.app-main .app-content [style*="border: black" i],
.app-main .app-content [style*="border-color:black" i],
.app-main .app-content [style*="border-color: black" i],
.app-main .app-content [style*="border:rgb(0,0,0)" i],
.app-main .app-content [style*="border: rgb(0,0,0)" i],
.app-main .app-content [style*="border-color:rgb(0,0,0)" i],
.app-main .app-content [style*="border-color: rgb(0,0,0)" i],
.app-main .app-content .tab-content[style*="border" i] {
    border-width: 1px !important;
    border-style: solid !important;
    border-color: var(--hc-ui-border) !important;
}

/* SEO branding tabs: keep pane content clean, without injected panel border. */
.app-main .app-content #seoBrandingTabs + .tab-content,
.app-main .app-content #seoBrandingTabs + .tab-content[style*="border" i] {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.app-main .app-content .card > .card-header {
    background: color-mix(in srgb, var(--hc-ui-soft-bg) 70%, #fff);
    border-bottom: 1px solid var(--hc-ui-border);
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.app-main .app-content .card > .card-header .card-title {
    color: var(--hc-ui-heading);
    font-weight: 700;
    margin-bottom: 0;
}

.app-main .app-content .card > .card-header > :is(.btn, a.btn, .btn-group, form):first-child {
    margin-left: auto;
}

.app-main .app-content .card > .card-header > :not(.btn):not(a.btn):not(.btn-group):not(form) + :is(.btn, a.btn, .btn-group, form) {
    margin-left: auto;
}

.app-main .app-content .card > .card-header > :is(.badge, .label, .text-bg-primary, .text-bg-secondary, .text-bg-success, .text-bg-danger, .text-bg-warning, .text-bg-info):first-child {
    margin-left: auto;
}

.app-main .app-content .card > .card-header > :not(.badge):not(.label):not(.text-bg-primary):not(.text-bg-secondary):not(.text-bg-success):not(.text-bg-danger):not(.text-bg-warning):not(.text-bg-info) + :is(.badge, .label, .text-bg-primary, .text-bg-secondary, .text-bg-success, .text-bg-danger, .text-bg-warning, .text-bg-info) {
    margin-left: auto;
}

.app-main .app-content .card > .card-header > :is(small, .small, .text-muted, .text-body-secondary):first-child {
    margin-left: auto;
}

.app-main .app-content .card > .card-header > :not(small):not(.small):not(.text-muted):not(.text-body-secondary) + :is(small, .small, .text-muted, .text-body-secondary) {
    margin-left: auto;
}

/* Global Tool/Page Heading Lock */
.app-main .app-content .card > .card-header > h1,
.app-main .app-content .card > .card-header > h2,
.app-main .app-content .card > .card-header > h3,
.app-main .app-content .card > .card-header > h4,
.app-main .app-content .card > .card-header > h5,
.app-main .app-content .card > .card-header > h6,
.app-main .app-content .card > .card-header > .h1,
.app-main .app-content .card > .card-header > .h2,
.app-main .app-content .card > .card-header > .h3,
.app-main .app-content .card > .card-header > .h4,
.app-main .app-content .card > .card-header > .h5,
.app-main .app-content .card > .card-header > .h6,
.app-main .app-content .card > .card-header > .card-title,
.app-main .app-content .hc-ct-section-title {
    font-size: 1.28rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.005em;
    color: var(--hc-ui-heading) !important;
    margin-bottom: 0 !important;
}

.app-main .app-content .card > .card-header > p,
.app-main .app-content .card > .card-header > .small,
.app-main .app-content .card > .card-header > .text-body-secondary,
.app-main .app-content .hc-ct-section-subtitle {
    font-size: 1rem !important;
    line-height: 1.45 !important;
    color: var(--hc-ui-subheading) !important;
    margin-bottom: 0 !important;
}

.app-main .app-content .card > .card-body > h3,
.app-main .app-content .card > .card-body > h4,
.app-main .app-content .card > .card-body > h5,
.app-main .app-content .card > .card-body > h6,
.app-main .app-content .card > .card-body > .h3,
.app-main .app-content .card > .card-body > .h4,
.app-main .app-content .card > .card-body > .h5,
.app-main .app-content .card > .card-body > .h6 {
    font-size: 1.12rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: var(--hc-ui-heading) !important;
}

.app-main .app-content .card > .card-body > p.small,
.app-main .app-content .card > .card-body > p.text-body-secondary,
.app-main .app-content .card > .card-body > .small.text-body-secondary {
    color: var(--hc-ui-subheading) !important;
}

/* Shared hero titles (all tools/plugins) */
.app-main .app-content .hc-tool-header h1,
.app-main .app-content .hc-tool-header h2,
.app-main .app-content .hc-tool-header h3,
.app-main .app-content .hc-tool-header .h4,
.app-main .app-content .hc-tool-header .h5 {
    font-size: 1.28rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.005em;
    color: var(--hc-ui-heading) !important;
    margin-bottom: 0 !important;
}

/* Common HTML heading variants used across tools/plugins/pages */
.app-main .app-content h2.h5,
.app-main .app-content h3.h5,
.app-main .app-content h4.h5,
.app-main .app-content h3.h6.fw-semibold,
.app-main .app-content h4.h6.fw-semibold,
.app-main .app-content h5.h6.fw-semibold,
.app-main .app-content .card-header.fw-semibold {
    color: var(--hc-ui-heading) !important;
    font-weight: 700 !important;
}

.app-main .app-content h2.h5,
.app-main .app-content h3.h5,
.app-main .app-content h4.h5 {
    font-size: 1.28rem !important;
    line-height: 1.25 !important;
}

.app-main .app-content h3.h6.fw-semibold,
.app-main .app-content h4.h6.fw-semibold,
.app-main .app-content h5.h6.fw-semibold,
.app-main .app-content .card-header.fw-semibold {
    font-size: 1.12rem !important;
    line-height: 1.3 !important;
}

.app-main .app-content .alert {
    border-radius: 0.65rem;
}

.app-main .app-content .nav-pills .nav-link {
    border-radius: 999px;
    border: 1px solid var(--bs-primary);
    color: var(--bs-primary);
    font-weight: 600;
    font-size: 0.96rem;
    line-height: 1.2;
    padding: 0.42rem 0.95rem;
    background: transparent;
    transition: background-color 0.14s ease, color 0.14s ease, border-color 0.14s ease;
}

.app-main .app-content .nav-pills .nav-link:hover {
    background: rgba(13, 110, 253, 0.08);
    color: var(--bs-primary);
}

.app-main .app-content .nav-pills .nav-link.active {
    box-shadow: none;
    background: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

.app-main .app-content .nav-tabs {
    border-bottom: 1px solid var(--hc-ui-border);
    gap: 0.35rem;
}

.app-main .app-content .nav-tabs .nav-link {
    border: 1px solid var(--bs-primary);
    border-radius: 999px;
    color: var(--bs-primary);
    font-weight: 600;
    font-size: 0.96rem;
    line-height: 1.2;
    padding: 0.42rem 0.95rem;
    margin-bottom: 0.35rem;
    background: transparent;
    transition: background-color 0.14s ease, color 0.14s ease, border-color 0.14s ease;
}

.app-main .app-content .nav-tabs .nav-link:hover {
    background: rgba(13, 110, 253, 0.08);
}

.app-main .app-content .nav-tabs .nav-link.active,
.app-main .app-content .nav-tabs .nav-item.show .nav-link {
    background: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

/* Webshop: productformulier header acties rechts op desktop, onder elkaar op mobiel */
.webshop-product-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
}

.webshop-product-header .card-title {
    flex: 1 1 auto;
    min-width: 0;
    margin-bottom: 0;
}

.webshop-product-header__actions {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

@media (max-width: 575.98px) {
    .webshop-product-header__actions {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }
}

.app-main .app-content .webshop-admin-tabs .nav-link {
    border-radius: 999px !important;
    border: 1px solid var(--bs-primary) !important;
    color: var(--bs-primary) !important;
    background: transparent !important;
    font-weight: 600 !important;
    font-size: 0.96rem !important;
    line-height: 1.2 !important;
    padding: 0.42rem 0.95rem !important;
}

.app-main .app-content .webshop-admin-tabs .nav-link:hover {
    background: rgba(13, 110, 253, 0.08) !important;
}

.app-main .app-content .webshop-admin-tabs .nav-link.active {
    background: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    color: #fff !important;
}

.app-main .app-content .btn-outline-light {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-active-color: #fff;
}

.hc-section-head {
    border: 1px solid var(--hc-ui-border);
    border-radius: 0.75rem;
    background: var(--hc-ui-card-bg);
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
    padding: 0.95rem 1rem;
}

.hc-section-head__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--hc-ui-heading);
    margin: 0 0 0.35rem 0;
}

.hc-section-head__title i {
    color: var(--bs-primary, #0d6efd);
}

/* Final override: keep blue hero text readable across all admin hero variants. */
.app-main .app-content .hc-tool-header.hc-plugin-hero h1,
.app-main .app-content .hc-tool-header.hc-plugin-hero h2,
.app-main .app-content .hc-tool-header.hc-plugin-hero h3,
.app-main .app-content .hc-tool-header.hc-plugin-hero .h4,
.app-main .app-content .hc-tool-header.hc-plugin-hero .h5,
.app-main .app-content .growth-suite-hero.hc-tool-header h1,
.app-main .app-content .growth-suite-hero.hc-tool-header h2,
.app-main .app-content .growth-suite-hero.hc-tool-header h3,
.app-main .app-content .growth-suite-hero.hc-tool-header .h4,
.app-main .app-content .growth-suite-hero.hc-tool-header .h5 {
    color: #0b2a4a !important;
}

.app-main .app-content .hc-tool-header.hc-plugin-hero .text-body-secondary,
.app-main .app-content .growth-suite-hero.hc-tool-header .text-body-secondary,
.app-main .app-content .hc-tool-header.hc-plugin-hero .form-label,
.app-main .app-content .growth-suite-hero.hc-tool-header .form-label {
    color: rgba(15, 41, 71, 0.82) !important;
}

.hc-section-head__sub {
    margin: 0;
    color: var(--hc-ui-subheading);
    font-size: 0.95rem;
    line-height: 1.5;
}
.card-footer {
  display: flex !important;
  justify-content: flex-end !important;
}

/* Consolidated admin page polish */
.ws-page {
    max-width: 1400px;
}

.ws-card {
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,.05);
}

.ws-card .card-header,
.ws-card .card-footer {
    background: linear-gradient(180deg, rgba(248,249,250,1) 0%, rgba(255,255,255,1) 100%);
}

.ws-page-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.ws-section {
    padding: 1rem;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: .85rem;
    background: #fff;
    height: 100%;
}

.ws-section-title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: .9rem;
    color: #1f2937;
}

.ws-muted {
    color: #6b7280;
    font-size: .875rem;
}

.ws-sticky-actions {
    position: sticky;
    bottom: 0;
    z-index: 5;
    backdrop-filter: blur(10px);
}

.ws-gallery-list .ws-g-item {
    cursor: pointer;
    transition: all .15s ease;
    border-radius: .75rem;
}

.ws-gallery-list .ws-g-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
}

.ws-form-grid-tight .form-label {
    font-weight: 600;
    margin-bottom: .35rem;
}

.ws-meta-box {
    background: #f8fafc;
    border: 1px dashed rgba(0,0,0,.1);
    border-radius: .75rem;
    padding: .85rem;
}

.table.ws-variants-table th,
.table.ws-variants-table td {
    vertical-align: middle;
}

.table.ws-variants-table th {
    white-space: nowrap;
    font-size: .85rem;
}

.hc-appt-shell {
    display: grid;
    gap: 1rem;
}

.hc-appt-topbar,
.hc-appt-panel,
.hc-appt-table-wrap,
.hc-appt-feed-box {
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 1rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.04);
}

.hc-appt-topbar,
.hc-appt-feed-box {
    padding: 1rem;
}

.hc-appt-panel > .hc-appt-panel__body,
.hc-appt-table-wrap {
    padding: 1rem;
}

.hc-appt-section-title {
    font-weight: 700;
    margin-bottom: .5rem;
}

.hc-appt-muted {
    color: #6b7280;
    font-size: .875rem;
}

.hc-appt-sidebar-card {
    border: 1px solid rgba(0,0,0,.06);
    border-radius: .85rem;
    padding: 1rem;
    background: #fff;
}

.hc-appt-admin-dashboard {
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.06);
    background: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,.04);
}

.hc-appt-admin-cal-toolbar {
    padding-bottom: .25rem;
    border-bottom: 1px solid rgba(0,0,0,.06);
    margin-bottom: 1rem !important;
}

.hc-appt-table-wrap table {
    margin-bottom: 0;
}

.hc-appt-code-list code {
    display: block;
    user-select: all;
}

.acc-upgrade-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1200px) { .acc-upgrade-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px) { .acc-upgrade-plan-grid { grid-template-columns: 1fr; } }
.acc-upgrade-card { border: 1px solid #dee2e6; border-radius: 12px; padding: 1rem; cursor: pointer; transition: border-color .15s, box-shadow .15s; height: 100%; background: #fff; text-align: left; }
.acc-upgrade-card:hover { border-color: #86b7fe; box-shadow: 0 4px 14px rgba(13, 110, 253, 0.12); }
.acc-upgrade-card.is-selected { border-color: #0d6efd; box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.2); background: #f8f9ff; }
.acc-upgrade-card.is-current { border-color: #198754; }
.acc-upgrade-price { font-size: 1.15rem; font-weight: 700; color: #0d6efd; }
.saas-period-stack { display: flex; flex-direction: column; gap: 5px; margin-top: 2px; }
.saas-period-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; align-items: start; padding: 5px 8px; border-radius: 8px; background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%); border: 1px solid #e2e8f0; }
.acc-upgrade-card.is-selected .saas-period-item { background: linear-gradient(180deg, #f0f4ff 0%, #e8eeff 100%); border-color: #c7d2fe; }
.saas-period-item__label { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #64748b; line-height: 1.25; padding-top: 2px; }
.saas-period-item__col { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.saas-period-item__price { font-size: 0.82rem; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.2; color: #0d6efd; }
.saas-period-item__save-pill { display: inline-flex; align-items: center; padding: 1px 6px; border-radius: 999px; font-size: 0.62rem; font-weight: 600; line-height: 1.35; background: rgba(25, 135, 84, 0.12); color: #0f5132; }

.help-faq-section { margin-bottom: 2rem; }
.help-faq-section h2 { font-size: 1.25rem; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--bs-primary); }
.accordion-button:not(.collapsed) { background: rgba(13, 110, 253, 0.08); color: var(--bs-primary); }
.help-quicklinks { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
.help-quicklinks a { padding: 0.35rem 0.75rem; background: var(--bs-light); border-radius: 0.5rem; text-decoration: none; color: var(--bs-body-color); font-size: 0.9rem; }
.help-quicklinks a:hover { background: var(--bs-primary); color: #fff; }
.help-icon-box { width: 48px; height: 48px; border-radius: 12px; background: rgba(13, 110, 253, 0.12); display: inline-flex; align-items: center; justify-content: center; margin-right: 0.75rem; flex-shrink: 0; }
.help-icon-box i { font-size: 1.25rem; color: var(--bs-primary); }
.help-search-wrap { margin-bottom: 1.25rem; }
.help-hidden-by-search { display: none !important; }
details.help-ads-details { border-radius: var(--bs-border-radius, 0.375rem); }
details.help-ads-details > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
details.help-ads-details > summary::-webkit-details-marker { display: none; }
details.help-ads-details > summary .help-ads-chevron { transition: transform 0.2s ease; }
details.help-ads-details[open] > summary .help-ads-chevron { transform: rotate(-180deg); }

.support-mailbox .nav-pills .nav-link { border-radius: 0.25rem; color: var(--bs-body-color); }
.support-mailbox .nav-pills .nav-link.active,
.support-mailbox .nav-pills .show > .nav-link { background-color: var(--bs-primary); color: #fff; }
.support-mailbox .mailbox-messages tbody tr { cursor: pointer; }
.support-mailbox .mailbox-messages tbody tr.table-active { --bs-table-active-bg: rgba(var(--bs-primary-rgb), 0.12); }

.ws-help-hero { border-radius: 0.75rem; padding: 1.25rem 1.5rem; margin-bottom: 1.25rem; background: linear-gradient(135deg, rgba(13,110,253,0.12) 0%, rgba(13,202,240,0.08) 100%); border: 1px solid rgba(13,110,253,0.2); }
.ws-help-quick { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.ws-help-quick a { padding: 0.35rem 0.75rem; background: var(--bs-light); border-radius: 0.5rem; text-decoration: none; font-size: 0.9rem; }
.ws-help-quick a:hover { background: var(--bs-primary); color: #fff; }
.ws-help-status .card { height: 100%; }
.help-ws-faq-item.hidden-by-search { display: none !important; }
.ws-help-checklist .form-check { padding: 0.65rem 0.75rem; border-radius: 0.5rem; margin-bottom: 0.35rem; background: var(--bs-light); }
.ws-help-checklist .form-check-input { margin-top: 0.35rem; }
.code-copy-row { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.code-copy-row code { flex: 1; min-width: 200px; word-break: normal; font-size: 0.8rem; }

.migration-platform-modal-wp { transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease; }
.migration-platform-modal-wp:hover,
.migration-platform-modal-wp:focus-visible { background-color: var(--bs-primary); border-color: var(--bs-primary); color: #fff; box-shadow: 0 0.4rem 1.1rem rgba(var(--bs-primary-rgb, 13, 110, 253), 0.35); }
.migration-platform-modal-wp:hover .migration-platform-modal-wp-title,
.migration-platform-modal-wp:focus-visible .migration-platform-modal-wp-title,
.migration-platform-modal-wp:hover .migration-platform-modal-wp-icon,
.migration-platform-modal-wp:focus-visible .migration-platform-modal-wp-icon { color: #fff !important; }
.migration-platform-modal-wp:hover .migration-platform-modal-wp-sub,
.migration-platform-modal-wp:focus-visible .migration-platform-modal-wp-sub { color: rgba(255, 255, 255, 0.92) !important; }
.migration-platform-modal-slurp { transition: filter 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease; }
.migration-platform-modal-slurp:hover { filter: brightness(1.1); box-shadow: 0 0.45rem 1.15rem rgba(0, 0, 0, 0.22) !important; transform: translateY(-1px); color: #fff !important; }
.migration-platform-modal-slurp:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 3px; }

.hb-wrap { border: 1px solid #d7e0ea; border-radius: 12px; overflow: hidden; background: #f8fbff; }
.hb-top { border-bottom: 1px solid #d7e0ea; background: #fff; padding: 10px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.hb-status { margin-left: auto; font-size: 12px; color: #475569; }
.hb-canvas { position: relative; min-height: 680px; background: #f5f9ff; background-image: radial-gradient(#d6dee8 1px, transparent 1px); background-size: 22px 22px; }
.hb-lines { position: absolute; inset: 0; pointer-events: auto; }
.hb-node { position: absolute; width: 280px; border: 1px solid #cad7e5; border-radius: 10px; background: #fff; box-shadow: 0 8px 20px rgba(0,0,0,.08); cursor: move; user-select: none; }
.hb-node.sel { outline: 2px solid #3b82f6; }
.hb-node.trigger { border-left: 4px solid #8b5cf6; }
.hb-node.delay { border-left: 4px solid #f59e0b; }
.hb-node.condition { border-left: 4px solid #0ea5e9; }
.hb-node.email { border-left: 4px solid #16a34a; }
.hb-node.task { border-left: 4px solid #334155; }
.hb-node.webhook { border-left: 4px solid #ef4444; }
.hb-head { padding: 8px 10px; border-bottom: 1px solid #eaf0f7; display: flex; justify-content: space-between; align-items: center; font-weight: 700; font-size: 13px; }
.hb-body { padding: 8px 10px; font-size: 12px; color: #44566f; min-height: 36px; }
.hb-mini { width: 24px; height: 24px; border: 0; border-radius: 999px; background: #e8eff8; display: inline-flex; align-items: center; justify-content: center; }
.hb-ctx { position: fixed; z-index: 3000; min-width: 180px; background: #fff; border: 1px solid #cad7e5; border-radius: 10px; box-shadow: 0 12px 24px rgba(0,0,0,.14); padding: 6px; display: none; }
.hb-ctx .ctx-btn { width: 100%; text-align: left; border: 0; background: transparent; padding: 7px 9px; border-radius: 7px; font-size: 13px; }
.hb-ctx .ctx-btn:hover { background: #eef4ff; }
.hb-mail-toolbar,
.campaign-mail-toolbar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.hb-mail-editor { min-height: 120px; border: 1px solid #ced4da; border-radius: 6px; padding: 8px; background: #fff; }
.campaign-mail-editor { min-height: 160px; border: 1px solid #ced4da; border-radius: 6px; padding: 10px; background: #fff; }
.hb-cond-preset-row { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }

.editor-shell { display:grid; grid-template-columns: 330px 1fr 370px; gap:1rem; }
.editor-panel { display:grid; gap:.75rem; align-content:start; }
.editor-canvas { min-height:70vh; background:#fff; border:1px solid #dee2e6; border-radius:.5rem; padding:1rem; }
.editor-section { border:1px dashed #adb5bd; border-radius:.45rem; padding:.75rem; margin-bottom:.75rem; background:#fff; }
.editor-section.active { border-color:var(--bs-primary); box-shadow:0 0 0 .2rem rgba(13,110,253,.14); }
.editor-block { border:1px solid #dee2e6; border-radius:.35rem; padding:.6rem; margin:.5rem 0; background:#f8f9fa; }
.editor-block.active { border-color:var(--bs-primary); }
.editor-toolbar { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
.device-toggle button.active { background:var(--bs-primary); color:#fff; }
.muted { color:#6c757d; font-size:.9rem; }
.layer-item { width:100%; text-align:left; background:#f1f3f5; color:#212529; border:1px solid #dee2e6; border-radius:.35rem; padding:.35rem .5rem; }
.layer-item.active { background:var(--bs-primary); color:#fff; border-color:var(--bs-primary); }
.layer-item.drag-over { outline:2px dashed var(--bs-primary); }
.media-grid { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:.5rem; max-height:260px; overflow:auto; }
.media-item { border:1px solid #dee2e6; border-radius:.35rem; background:#fff; padding:.4rem; }
.media-item img { width:100%; height:80px; object-fit:cover; border-radius:.3rem; }
[contenteditable="true"] { outline:none; }
[contenteditable="true"]:focus { box-shadow: inset 0 0 0 2px rgba(13,110,253,.2); border-radius:6px; }
.grid2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; }
@media (max-width: 1200px) { .editor-shell { grid-template-columns: 1fr; } }

.crm-contacts-hero {
    background: linear-gradient(135deg, color-mix(in srgb, var(--bs-primary) 12%, transparent) 0%, color-mix(in srgb, var(--bs-info) 8%, transparent) 100%);
    border: 1px solid var(--bs-border-color);
    border-radius: 1rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}
.crm-contacts-hero__title { font-weight: 650; letter-spacing: -0.02em; font-size: 1.15rem; margin: 0 0 0.35rem; color: var(--bs-secondary-color); }
.crm-contact-modal .modal-content { border: none; border-radius: 1rem; overflow: hidden; box-shadow: 0 1.25rem 3rem rgba(15, 23, 42, 0.12); }
.crm-contact-modal .modal-header { position: relative; background: linear-gradient(135deg, color-mix(in srgb, var(--bs-primary) 14%, var(--bs-body-bg)) 0%, var(--bs-body-bg) 55%); border-bottom: 1px solid var(--bs-border-color); padding: 1.25rem 1.5rem; padding-right: 3rem; }
.crm-contact-modal .modal-title { font-weight: 650; letter-spacing: -0.02em; }
.crm-contact-modal__lead { font-size: 0.875rem; color: var(--bs-secondary-color); margin: 0.35rem 0 0; max-width: 36rem; line-height: 1.45; }
.crm-contact-modal__icon { width: 3rem; height: 3rem; border-radius: 0.85rem; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--bs-primary) 18%, transparent); color: var(--bs-primary); font-size: 1.35rem; flex-shrink: 0; }
.crm-contact-modal__hero { background: var(--bs-tertiary-bg); border-radius: 0.85rem; padding: 1.25rem; margin-bottom: 1rem; border: 1px solid var(--bs-border-color-translucent); }
.crm-contact-modal__hero-label { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--bs-secondary-color); margin-bottom: 0.75rem; }
.crm-contact-modal .accordion-item { border: 1px solid var(--bs-border-color-translucent); border-radius: 0.75rem !important; margin-bottom: 0.5rem; overflow: hidden; background: var(--bs-body-bg); }
.crm-contact-modal .accordion-button { font-weight: 600; font-size: 0.9rem; padding: 0.85rem 1rem; box-shadow: none !important; }
.crm-contact-modal .accordion-button:not(.collapsed) { background: color-mix(in srgb, var(--bs-primary) 6%, var(--bs-body-bg)); color: var(--bs-body-color); }
.crm-contact-modal .accordion-body { padding: 1rem 1.1rem 1.15rem; }
.crm-contact-modal .form-floating > label { color: var(--bs-secondary-color); }
.crm-contact-modal__footer { background: var(--bs-body-bg); border-top: 1px solid var(--bs-border-color); margin: 0 -1rem -1rem; padding: 1rem 1.25rem; position: sticky; bottom: 0; }
.crm-contact-modal .modal-body { padding: 1.25rem 1rem 0; }
@media (min-width: 576px) {
    .crm-contact-modal .modal-body { padding-left: 1.5rem; padding-right: 1.5rem; }
    .crm-contact-modal__footer { margin-left: -1.5rem; margin-right: -1.5rem; padding-left: 1.5rem; padding-right: 1.5rem; }
}

/* Unified admin utility layer */
.cms-summary-reset {
    cursor: pointer;
    list-style: none;
}

.cms-alert-soft-primary {
    background: color-mix(in srgb, var(--bs-primary) 12%, var(--bs-body-bg));
}

.cms-minh-200 { min-height: 200px; }
.cms-minh-5_5rem { min-height: 5.5rem; }
.cms-maxw-140 { max-width: 140px; }
.cms-maxw-11rem { max-width: 11rem; }
.cms-maxw-22rem { max-width: 22rem; }
.cms-mt-n025rem { margin-top: -0.25rem; }
.cms-opacity-88 { opacity: .88; }
.cms-prewrap { white-space: pre-wrap; }
.cms-scrollbox-420 { max-height: 420px; overflow: auto; }
.cms-select-linked-invoice { min-width: 9rem; max-width: 14rem; }
.cms-select-payment-status { max-width: 11rem; }
.cms-select-provider { max-width: 7.5rem; }
.cms-btn-dark-gradient {
    background: linear-gradient(145deg, #3d4451 0%, #2c3038 100%);
}
.cms-w-80px { width: 80px; }
.cms-w-90px { width: 90px; }
.cms-w-100px { width: 100px; }
.cms-w-110px { width: 110px; }
.cms-w-120px { width: 120px; }
.cms-thumb-72 {
    width: 72px;
    height: 72px;
    object-fit: cover;
}
.cms-box-72 {
    width: 72px;
    height: 72px;
}

/* Consistent admin panels/forms/tables */
.card.card-outline,
.card.shadow-sm,
.hc-appt-panel,
.hc-appt-topbar,
.hc-appt-table-wrap,
.hc-appt-feed-box {
    border-radius: 1rem;
}

.card .card-header {
    border-bottom-color: rgba(0,0,0,.06);
}

.card .card-footer {
    border-top-color: rgba(0,0,0,.06);
}

.table > :not(caption) > * > th {
    font-weight: 700;
}

.form-label {
    font-weight: 600;
}

.form-text {
    color: #6b7280;
}

.btn-group > .btn,
.btn {
    border-radius: .65rem;
}

.btn-group > .btn:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > .btn:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.modal-content {
    border-radius: 1rem;
    overflow: hidden;
}

@media (max-width: 767.98px) {
    .table-responsive {
        border-radius: .85rem;
    }
}


/* Unified admin layout utilities */
.cms-admin-minw-220{min-width:220px;}
.cms-admin-maxw-42{max-width:42rem;}
.cms-admin-maxw-46{max-width:46rem;}
.cms-admin-maxw-340{max-width:340px;}
.cms-admin-maxw-95vw{max-width:95vw;}
.cms-admin-prewrap{white-space:pre-wrap;}
.cms-admin-overflow-auto{overflow:auto;}
.cms-admin-user-select-all{user-select:all;}
.cms-admin-scroll-y-280{max-height:280px;overflow:auto;}
.cms-admin-scroll-y-320{max-height:320px;overflow:auto;}
.cms-admin-scroll-y-16rem{max-height:16rem;overflow:auto;}
.cms-admin-font-075{font-size:.75rem;}
.cms-admin-font-072{font-size:.72rem;}
.cms-admin-font-08{font-size:.8rem;}
.cms-admin-progress-xs{height:6px;}
.cms-admin-progress-sm{height:8px;}
.cms-admin-progress-md{height:10px;}
.cms-admin-progress-lg{height:12px;}
.cms-admin-maxw-420{max-width:420px;}
.cms-admin-sticky-top-1{top:1rem;}
.cms-admin-sticky-top-88{top:88px;}
.cms-admin-resize-vertical{resize:vertical;}
.cms-admin-form-label-flex{display:flex;align-items:center;gap:10px;}
.cms-admin-grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px;width:100%;}
.cms-admin-minh-560{min-height:560px;}
.cms-admin-theme-preview-frame{height:70vh;min-height:460px;background:#fff;}
.cms-admin-summary-pointer summary{cursor:pointer;}
.cms-admin-legal-sample{white-space:pre-wrap;max-height:280px;overflow:auto;user-select:all;}

/* Dashboard skin */
.wf-site-dashboard .card{border:1px solid #d7dee7;border-radius:10px;box-shadow:0 1px 2px rgba(15,23,42,.03);}
.wf-site-dashboard .card-header{background:#f5f7fb;border-bottom:1px solid #dfe5ee;}
.wf-site-dashboard .wf-kpi-card .small{color:#5b6b7f!important;}
.wf-site-dashboard .wf-kpi-card .h3{font-weight:700;color:#0f172a;}
.wf-site-dashboard .btn{border-radius:6px;}
.wf-site-dashboard .table thead th{font-size:.82rem;background:#f3f5f9;}
.wf-site-dashboard .table td{vertical-align:middle;}
.wf-site-dashboard .wf-package-list .list-group-item{border:1px solid #dbe5f0;border-radius:10px;}
.wf-site-dashboard .wf-package-list .list-group-item + .list-group-item{margin-top:.6rem;}
.wf-site-dashboard .wf-dashboard-side-menu{position:sticky;top:86px;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item{border:0;border-bottom:1px solid #e4ebf3;padding:.55rem .2rem;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item:last-child{border-bottom:0;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item a{color:#1f2a37;text-decoration:none;display:flex;align-items:center;gap:.45rem;font-weight:600;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item a:hover{color:#0d6efd;}

/* Dashboard media editor */
#mediaImageEditorModal{position:fixed;inset:0;z-index:1080;}
#mediaImageEditorModal .modal-dialog{margin:.5rem auto;max-width:min(98vw,1800px);height:calc(100vh - 1rem);}
#mediaImageEditorModal .modal-content{height:100%;border-radius:.8rem;overflow:hidden;}
#mediaImageEditorModal .modal-header{border-bottom:1px solid #dce3ef;background:#fff;}
#mediaImageEditorModal .modal-body{overflow:hidden;padding:.65rem!important;background:#f3f6fb;}
#mediaImageEditorModal .media-editor-shell{display:grid;grid-template-columns:minmax(340px,390px) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:.65rem;height:calc(100vh - 9.5rem);min-height:620px;}
#mediaImageEditorModal .media-editor-shell>.media-editor-canvas-wrap{grid-column:2;grid-row:1;}
#mediaImageEditorModal .media-editor-panel{border:1px solid #d9e1ec;border-radius:.7rem;padding:.7rem;background:#fff;overflow:auto;box-shadow:0 2px 8px rgba(15,23,42,.05);}
#mediaImageEditorModal .media-editor-sidebar{display:flex;flex-direction:column;}
#mediaImageEditorModal .media-editor-tabs{display:flex;gap:.35rem;flex-wrap:wrap;}
#mediaImageEditorModal .media-editor-tab-pane{display:none;overflow:auto;padding-right:.1rem;}
#mediaImageEditorModal .media-editor-tab-pane.is-active{display:block;}
@media (max-width: 991.98px){#mediaImageEditorModal .media-editor-shell{grid-template-columns:minmax(0,1fr);height:auto;min-height:0;}#mediaImageEditorModal .media-editor-shell>.media-editor-canvas-wrap{grid-column:auto;grid-row:auto;}}

.w-110{width:110px;}
.w-140{width:140px;}
.w-160{width:160px;}
.w-180{width:180px;}
.w-220{width:220px;}
.w-240{width:240px;}
.w-36{width:36%;}
.w-40{width:40%;}
.min-w-320{min-width:320px;}
.cms-target-url-cell{max-width:520px;word-break:normal;}

.cms-target-url-cell--sm{max-width:420px;word-break:normal;}
.cms-target-url-cell--lg{max-width:640px;word-break:normal;}


/* --- WAUW admin pass: unified shells, cards, rails, builders, utilities --- */
:root{
  --cms-surface:#ffffff;
  --cms-surface-soft:#f8fafc;
  --cms-border:#d9e2ec;
  --cms-border-strong:#c8d4e3;
  --cms-text-strong:#0f172a;
  --cms-text-soft:#5b6b7f;
  --cms-shadow-sm:0 8px 24px rgba(15,23,42,.05);
  --cms-shadow-md:0 14px 32px rgba(15,23,42,.08);
  --cms-radius-lg:1rem;
  --cms-radius-md:.8rem;
}

.app-content .card,
.cms-admin-shell .card,
.wf-site-dashboard .card,
.hc-appt-panel,
.hc-appt-topbar,
.hc-appt-feed-box,
.hc-appt-table-wrap{
  border:1px solid var(--cms-border);
  border-radius:var(--cms-radius-lg);
  box-shadow:var(--cms-shadow-sm);
}

.app-content .card-header,
.cms-admin-shell .card-header{
  background:linear-gradient(180deg,#fbfdff 0%,#f5f8fc 100%);
  border-bottom:1px solid var(--cms-border);
}

.cms-admin-shell,
.cms-admin-grid{display:grid;gap:1rem;}
.cms-admin-shell--2col{grid-template-columns:minmax(0,1fr) 320px;align-items:start;}
.cms-admin-panel{background:var(--cms-surface);border:1px solid var(--cms-border);border-radius:var(--cms-radius-lg);box-shadow:var(--cms-shadow-sm);}
.cms-admin-panel__body{padding:1rem;}
.cms-admin-panel__title{font-weight:700;color:var(--cms-text-strong);margin:0 0 .5rem;}
.cms-admin-muted{color:var(--cms-text-soft)!important;}
.cms-admin-soft{background:var(--cms-surface-soft)!important;}
.cms-admin-sticky-88{position:sticky;top:88px;}
.cms-admin-minw-220{min-width:220px;}
.cms-admin-minw-180{min-width:180px;}
.cms-admin-maxw-95vw{max-width:95vw;}
.cms-admin-maxh-220{max-height:220px;overflow:auto;}
.cms-admin-maxh-260{max-height:260px;overflow:auto;}
.cms-admin-maxh-280{max-height:280px;overflow:auto;}
.cms-admin-maxh-340{max-height:340px;overflow:auto;}
.cms-admin-maxh-420{max-height:420px;overflow:auto;}
.cms-admin-maxh-560{min-height:560px;}
.cms-admin-thin-progress{height:6px;}
.cms-admin-progress-10{height:10px;}
.cms-admin-progress-8{height:8px;}
.cms-admin-progress-max-420{max-width:420px;}
.cms-admin-code-wrap,
.cms-admin-prewrap{white-space:pre-wrap;word-break:break-word;}
.cms-admin-table-cell-md{max-width:420px;white-space:normal;word-break:break-word;}
.cms-admin-table-cell-lg{max-width:640px;white-space:normal;word-break:break-word;}
.cms-admin-select-sm-max{max-width:11rem;}
.cms-admin-select-provider{max-width:7.5rem;}
.cms-admin-preview-frame{border:1px solid var(--cms-border);border-radius:var(--cms-radius-md);background:#fff;}
.cms-admin-preview-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px;width:100%;}

/* Dashboard */
.wf-site-dashboard .card{border-radius:1rem;box-shadow:var(--cms-shadow-sm);}
.wf-site-dashboard .card-header{background:linear-gradient(180deg,#fbfdff 0%,#f4f7fb 100%);}
.wf-site-dashboard .wf-kpi-card .h3{font-weight:800;color:var(--cms-text-strong);}
.wf-site-dashboard .wf-dashboard-side-menu{position:sticky;top:86px;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item{border:0;border-bottom:1px solid #e4ebf3;padding:.55rem .2rem;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item:last-child{border-bottom:0;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item a{color:#1f2a37;text-decoration:none;display:flex;align-items:center;gap:.45rem;font-weight:600;}
.wf-site-dashboard .wf-dashboard-side-menu .list-group-item a:hover{color:#0d6efd;}
.wf-site-dashboard .wf-package-list .list-group-item{border:1px solid var(--cms-border);border-radius:1rem;background:#fff;}

/* Appointments */
.hc-appt-shell{display:grid;gap:1rem;}
.hc-appt-topbar,.hc-appt-feed-box{padding:1rem;}
.hc-appt-panel>.hc-appt-panel__body,.hc-appt-table-wrap{padding:1rem;}
.hc-appt-admin-dashboard{border-radius:1rem;overflow:hidden;border:1px solid var(--cms-border);background:#fff;box-shadow:var(--cms-shadow-sm);}
.hc-appt-sidebar-card{border:1px solid var(--cms-border);border-radius:.9rem;padding:1rem;background:#fff;box-shadow:0 2px 8px rgba(15,23,42,.03);}
.hc-appt-admin-cal-toolbar{padding-bottom:.35rem;border-bottom:1px solid var(--cms-border);margin-bottom:1rem!important;}
.hc-appt-admin-month.card{border-radius:1rem;overflow:hidden;}

/* Webshop product form */
.ws-card{border-radius:1rem;overflow:hidden;box-shadow:var(--cms-shadow-sm);}
.ws-page-title{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
 .ws-section{padding:1rem;border:1px solid var(--cms-border);border-radius:.95rem;background:#fff;height:100%;box-shadow:0 2px 8px rgba(15,23,42,.03);} 
.ws-section-title{font-size:1rem;font-weight:700;margin-bottom:.9rem;color:var(--cms-text-strong);} 
.ws-sticky-actions{position:sticky;bottom:0;z-index:5;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);} 
.ws-gallery-list .ws-g-item{cursor:pointer;transition:all .15s ease;border-radius:.8rem;} 
.ws-gallery-list .ws-g-item:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.06);} 
.ws-meta-box{background:#f8fafc;border:1px dashed var(--cms-border-strong);border-radius:.75rem;padding:.85rem;} 
.ws-thumb-72{width:72px;height:72px;object-fit:cover;} 
.ws-thumb-72-empty{width:72px;height:72px;} 
.ws-variants-table th{white-space:nowrap;font-size:.85rem;} 
.ws-col-price{width:110px;} .ws-col-sku{width:100px;} .ws-col-track{width:90px;} .ws-col-stock{width:80px;} .ws-col-live{width:90px;}

/* Marketing builder */
.hb-wrap{border:1px solid var(--cms-border);border-radius:1rem;overflow:hidden;background:#f8fbff;box-shadow:var(--cms-shadow-sm);} 
.hb-top{border-bottom:1px solid var(--cms-border);background:#fff;padding:10px;display:flex;gap:8px;flex-wrap:wrap;align-items:center;} 
.hb-status{margin-left:auto;font-size:12px;color:#475569;} 
.hb-canvas{position:relative;min-height:680px;background:#f5f9ff;background-image:radial-gradient(#d6dee8 1px, transparent 1px);background-size:22px 22px;} 
.hb-lines{position:absolute;inset:0;pointer-events:auto;} 
.hb-node{position:absolute;width:280px;border:1px solid #cad7e5;border-radius:12px;background:#fff;box-shadow:0 14px 32px rgba(0,0,0,.09);cursor:move;user-select:none;} 
.hb-node.sel{outline:2px solid #3b82f6;} .hb-node.trigger{border-left:4px solid #8b5cf6;} .hb-node.delay{border-left:4px solid #f59e0b;} .hb-node.condition{border-left:4px solid #0ea5e9;} .hb-node.email{border-left:4px solid #16a34a;} .hb-node.task{border-left:4px solid #334155;} .hb-node.webhook{border-left:4px solid #ef4444;} 
.hb-head{padding:8px 10px;border-bottom:1px solid #eaf0f7;display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:13px;} 
.hb-body{padding:8px 10px;font-size:12px;color:#44566f;min-height:36px;} 
.hb-mini{width:24px;height:24px;border:0;border-radius:999px;background:#e8eff8;display:inline-flex;align-items:center;justify-content:center;} 
.hb-ctx{position:fixed;z-index:3000;min-width:180px;background:#fff;border:1px solid #cad7e5;border-radius:10px;box-shadow:0 12px 24px rgba(0,0,0,.14);padding:6px;display:none;} 
.hb-ctx .ctx-btn{width:100%;text-align:left;border:0;background:transparent;padding:7px 9px;border-radius:7px;font-size:13px;} 
.hb-ctx .ctx-btn:hover{background:#eef4ff;} 
.hb-mail-toolbar,.campaign-mail-toolbar,.hb-cond-preset-row{display:flex;gap:6px;flex-wrap:wrap;} 
.hb-mail-toolbar,.campaign-mail-toolbar{margin-bottom:8px;} 
.hb-cond-preset-row{margin-top:6px;} 
.hb-mail-editor{min-height:120px;border:1px solid #ced4da;border-radius:6px;padding:8px;background:#fff;} 
.campaign-mail-editor{min-height:160px;border:1px solid #ced4da;border-radius:6px;padding:10px;background:#fff;} 
.hb-help-summary{cursor:pointer;list-style:none;} 
.hb-textarea-lg{min-height:200px;}

/* Editor */
.editor-shell{display:grid;grid-template-columns:330px 1fr 370px;gap:1rem;} 
.editor-panel{display:grid;gap:.75rem;align-content:start;} 
.editor-canvas{min-height:70vh;background:#fff;border:1px solid var(--cms-border);border-radius:.75rem;padding:1rem;box-shadow:var(--cms-shadow-sm);} 
.editor-section{border:1px dashed #adb5bd;border-radius:.6rem;padding:.75rem;margin-bottom:.75rem;background:#fff;} 
.editor-section.active{border-color:var(--bs-primary);box-shadow:0 0 0 .2rem rgba(13,110,253,.14);} 
.editor-block{border:1px solid var(--cms-border);border-radius:.5rem;padding:.6rem;margin:.5rem 0;background:#f8f9fa;} 
.editor-block.active{border-color:var(--bs-primary);} 
.editor-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;} 
.editor-toolbar-between{justify-content:space-between;} 
.device-toggle button.active{background:var(--bs-primary);color:#fff;} 
.editor-muted{color:#6c757d;font-size:.9rem;} 
.layer-item{width:100%;text-align:left;background:#f1f3f5;color:#212529;border:1px solid #dee2e6;border-radius:.35rem;padding:.35rem .5rem;} 
.layer-item.active{background:var(--bs-primary);color:#fff;border-color:var(--bs-primary);} 
.layer-item.drag-over{outline:2px dashed var(--bs-primary);} 
.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;max-height:260px;overflow:auto;} 
.media-item{border:1px solid #dee2e6;border-radius:.35rem;background:#fff;padding:.4rem;} 
.media-item img{width:100%;height:80px;object-fit:cover;border-radius:.3rem;} 
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;} 
.editor-media-search{flex:1;} 
.editor-hidden{display:none!important;} 
.editor-folder-note{font-size:.7rem;} 
@media (max-width:1200px){.editor-shell{grid-template-columns:1fr;}}

/* Plugin/platform modal fixes */
.js-plugin-settings-modal .modal-dialog.modal-dialog-scrollable{height:calc(100vh - 2rem);height:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));margin:1rem auto;} 
.js-plugin-settings-modal .modal-dialog.modal-dialog-scrollable .modal-content{max-height:100%;} 
.js-plugin-settings-modal .modal-dialog.modal-dialog-scrollable .modal-body{overflow-y:auto;min-height:0;padding-bottom:1.25rem;} 
.js-plugin-settings-modal .modal-footer{flex:0 0 auto;padding-bottom:calc(var(--bs-modal-footer-padding,.75rem) + env(safe-area-inset-bottom,0px));} 
.js-plugin-settings-modal .tox-tinymce{max-width:100%;} 
.js-plugin-settings-modal.show{overflow-y:auto;overscroll-behavior:contain;} 
.js-plugin-settings-modal.show .modal-dialog{margin:1rem auto;height:auto;} 
.js-plugin-settings-modal.show .modal-content{max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));} 
.js-plugin-settings-modal.show .modal-body{overflow-y:auto;} 

/* migrations and misc */
.migration-platform-hero{background:linear-gradient(145deg,#3d4451 0%, #2c3038 100%);} 
.cms-note-muted{margin-top:-.25rem;} 
.kunstcollectie-banner{background:color-mix(in srgb, var(--bs-primary) 12%, var(--bs-body-bg));}


/* Enterprise admin system */
body.builder-fullscreen { margin:0 !important; padding:0 !important; }
body.builder-fullscreen .app-header,
body.builder-fullscreen .app-sidebar,
body.builder-fullscreen .app-footer,
body.builder-fullscreen .app-content-header { display:none !important; }
body.builder-fullscreen .app-wrapper { margin:0 !important; padding:0 !important; min-height:100vh; min-height:100dvh; }
body.builder-fullscreen .app-main { margin-left:0 !important; padding-top:0 !important; min-height:100vh; min-height:100dvh; }
body.builder-fullscreen .app-content,
body.builder-fullscreen .app-main { margin:0 !important; }
body.builder-fullscreen .app-content { padding:0 !important; }
body.builder-fullscreen .app-content > .container-fluid { padding:0 !important; max-width:none !important; }

.growth-suite-hero {
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    color: #0f172a;
    padding: 1.1rem;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}
.growth-suite-hero .growth-suite-hero__icon,
.hc-tool-header__icon {
    width: 2.9rem;
    height: 2.9rem;
    border-radius: .85rem;
    background: linear-gradient(135deg, #1e67e8 0%, #0d6efd 100%);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 20px rgba(13, 110, 253, 0.22);
    flex: 0 0 2.9rem;
}
.growth-suite-switcher { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:0; }
.growth-suite-switcher .btn { border-radius:999px; }
.growth-suite-switcher .btn.btn-primary { border-color:#0d6efd; background:#0d6efd; color:#fff; }
.growth-suite-switcher-mobile { display:none; }
.growth-suite-context { display:flex; flex-wrap:wrap; gap:.4rem; }
.growth-suite-rail,
.cms-admin-side-rail {
    border: 1px solid #d8e0ea;
    border-radius: .9rem;
    background: linear-gradient(180deg, rgba(248,250,252,.95) 0%, rgba(255,255,255,1) 100%);
    box-shadow: 0 8px 20px rgba(15,23,42,.04);
}
.growth-suite-rail .growth-suite-rail-label,
.cms-admin-eyebrow-label {
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #6b7280;
}
.growth-suite-rail .nav-link {
    margin: 0 .35rem .35rem;
    border-radius: .7rem;
    color: #1f2937;
    font-size: .9rem;
}
.growth-suite-rail .nav-link.active { background: #1f6feb; color: #fff; }
.cms-admin-enterprise-shell { display:grid; gap:1rem; }
.cms-admin-toolbar,
.cms-admin-surface,
.cms-admin-panel,
.cms-admin-subpanel {
    background:#fff;
    border:1px solid rgba(15,23,42,.08);
    border-radius:1rem;
    box-shadow: 0 10px 24px rgba(15,23,42,.05);
}
.cms-admin-toolbar,
.cms-admin-panel > .card-header,
.cms-admin-panel > .card-body,
.cms-admin-surface,
.cms-admin-subpanel { padding:1rem; }
.cms-admin-surface-tight { padding:.85rem; }
.cms-admin-segmented-tabs { gap:.5rem; border-bottom:0; }
.cms-admin-segmented-tabs .nav-link {
    border:1px solid rgba(15,23,42,.10);
    border-radius:999px;
    padding:.45rem .8rem;
    color:#334155;
    background:#fff;
    font-weight:600;
}
.cms-admin-segmented-tabs .nav-link.active {
    background:#0d6efd;
    color:#fff;
    border-color:#0d6efd;
}
.cms-admin-card-clean { border-radius:1rem; border:1px solid rgba(15,23,42,.08); box-shadow:0 10px 24px rgba(15,23,42,.05); overflow:hidden; }
.cms-admin-card-clean > .card-header { background:linear-gradient(180deg,#fff 0%,#f8fafc 100%); border-bottom:1px solid rgba(15,23,42,.06); }
.cms-admin-card-clean.card-outline { border-top: 3px solid #0d6efd; }
.cms-admin-card-clean.card-outline.card-warning { border-top-color: #f59e0b; }
.cms-admin-card-clean.card-outline.card-success { border-top-color: #22c55e; }
.cms-admin-card-clean.card-outline.card-info { border-top-color: #06b6d4; }
.cms-admin-card-clean.card-outline.card-secondary { border-top-color: #64748b; }
.cms-admin-card-clean.card-outline.card-light { border-top-color: #cbd5e1; }
.cms-admin-table-soft thead th { background:#f8fafc; color:#475569; font-weight:700; border-bottom-color:rgba(15,23,42,.08); }
.cms-admin-table-soft td, .cms-admin-table-soft th { vertical-align:middle; }
.cms-admin-empty-state { padding:2.5rem 1rem; text-align:center; color:#64748b; }
.cms-admin-helper { color:#64748b; font-size:.875rem; }
.cms-admin-theme-preview-frame { height:70vh; min-height:460px; background:#fff; }
.cms-admin-scrollbox { overflow:auto; }
.cms-admin-scrollbox-md { max-height:320px; }
.cms-admin-maxw-42rem { max-width:42rem; }
.cms-admin-sticky-top-1rem { top:1rem; }
.cms-admin-blog-shell .card,
.cms-admin-migrations-shell .card,
.cms-admin-plugins-shell .card,
.cms-admin-design-shell .card { border-radius:1rem; border:1px solid rgba(15,23,42,.08); box-shadow:0 10px 24px rgba(15,23,42,.05); overflow:hidden; }
.cms-admin-blog-shell .card-header,
.cms-admin-migrations-shell .card-header,
.cms-admin-plugins-shell .card-header,
.cms-admin-design-shell .card-header { background:linear-gradient(180deg,#fff 0%,#f8fafc 100%); border-bottom:1px solid rgba(15,23,42,.06); }
.cms-admin-blog-shell .table,
.cms-admin-migrations-shell .table,
.cms-admin-plugins-shell .table,
.cms-admin-design-shell .table { margin-bottom:0; }
.cms-admin-section-intro { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1rem; border:1px solid rgba(15,23,42,.08); border-radius:1rem; background:linear-gradient(180deg,#fff 0%,#f8fbff 100%); box-shadow:0 10px 24px rgba(15,23,42,.05); }
.cms-admin-section-intro__body { min-width:0; }
.cms-admin-section-intro__title { font-size:1.05rem; font-weight:700; margin-bottom:.2rem; color:#0f172a; }
.cms-admin-app-market-grid .border { border-color: rgba(15,23,42,.08) !important; border-radius:1rem; box-shadow: 0 8px 18px rgba(15,23,42,.04); }
.js-app-market-grid .js-app-market-card { min-width:0; }
.js-app-market-grid .js-app-market-card > .border { overflow:hidden; }
.js-app-market-grid .js-app-market-card .d-flex { min-width:0; }
.js-app-market-grid .js-app-market-card .min-w-0 { min-width:0; max-width:100%; }
.js-app-market-grid .js-app-market-card .fw-semibold,
.js-app-market-grid .js-app-market-card .small { overflow-wrap:anywhere; word-break:break-word; }
.js-app-market-grid .js-app-market-card .text-truncate { display:block; white-space:normal !important; overflow:visible; text-overflow:unset; }
@media (max-width: 767.98px) {
    .growth-suite-switcher { display:none; }
    .growth-suite-switcher-mobile { display:block; width:100%; }
}

.cms-admin-theme-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
}
.theme-card-item {
    border: 1px solid #d8dde6;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 6px 16px rgba(16,24,40,.05);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.theme-card-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(16,24,40,.10);
    border-color: rgba(13,110,253,.35);
}
.theme-card-item.active { border-color:#16a34a; box-shadow:0 0 0 3px rgba(22,163,74,.12),0 10px 20px rgba(22,163,74,.08); }
.theme-card-image {
    aspect-ratio: 16/9;
    width: 100%;
    max-height: 220px;
    object-fit: cover;
    object-position: center top;
    background: #f3f6fb;
    display: block;
}
.theme-card-body { padding: 10px 12px; }
.theme-card-name { font-weight:700; line-height:1.2; margin-bottom:2px; }
.theme-card-meta { color:#64748b; font-size:12px; margin-bottom:8px; }
.theme-card-actions .btn {
    border-radius: 999px;
    font-weight: 600;
}
.cms-design-theme-toolbar .input-group-text {
    background: #fff;
}

/* Design hub (/design): quick actions + theme ZIP */
.cms-design-hub-kicker {
    letter-spacing: 0.08em;
}
.cms-design-hub-hero {
    position: relative;
    background: linear-gradient(135deg, #0f172a 0%, #312e81 45%, #5b21b6 100%);
}
.cms-design-hub-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(1200px 400px at 100% 0%, rgba(255, 255, 255, 0.12) 0%, transparent 55%);
    pointer-events: none;
    z-index: 0;
}
.cms-design-hub-hero :is(h1, h2, h3, .h1, .h2, .h3, .h4, .h5, .h6),
.cms-design-hub-hero .cms-design-hub-kicker {
    color: rgba(255, 255, 255, 0.98) !important;
    text-shadow: 0 1px 10px rgba(0,0,0,.25);
}
.cms-design-hub-hero p,
.cms-design-hub-hero .text-white-50,
.cms-design-hub-hero .text-muted {
    color: rgba(255, 255, 255, 0.80) !important;
}
.cms-design-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.75rem;
    background: rgba(15, 23, 42, 0.07);
    font-size: 1.15rem;
}
.cms-design-action-icon--code {
    background: rgba(79, 70, 229, 0.12);
    color: #4338ca !important;
}
.cms-design-hub .card.cms-design-action-card {
    border: none !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.07) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cms-design-hub .card.cms-design-action-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12) !important;
}
