:root {
    --araanco-color-primary: #2563eb;
    --araanco-color-button: #2563eb;
    --araanco-color-sidebar-top: #3a1f75;
    --araanco-color-sidebar-bottom: #7f5ecd;
    --araanco-color-card-header-start: #4c2d93;
    --araanco-color-card-header-end: #7b5bc7;
    --araanco-color-page-action-bar: #5b3ba4;
    --araanco-color-success: #16a34a;
    --araanco-color-danger: #dc2626;
    --araanco-radius-general: 18px;
    --araanco-radius-header: 30px;
}

html[data-araanco-control-theme='box'] {
    --araanco-box-canvas: #f4f6fb;
    --araanco-box-surface: #ffffff;
    --araanco-box-surface-muted: #f8fafc;
    --araanco-box-border: rgb(226 232 240 / 0.86);
    --araanco-box-text: #172033;
    --araanco-box-muted: #738097;
    --araanco-sidebar-text: #d8e4e7;
    --araanco-sidebar-muted: #a9c0c5;
    --araanco-sidebar-soft: rgb(255 255 255 / .075);
    color-scheme: light;
}

html.dark[data-araanco-control-theme='box'] {
    --araanco-box-canvas: #0d1020;
    --araanco-box-surface: #171a2e;
    --araanco-box-surface-muted: #1c2037;
    --araanco-box-border: rgb(101 111 148 / 0.22);
    --araanco-box-text: #f1f3fb;
    --araanco-box-muted: #9ba5bd;
    color-scheme: dark;
}

html[data-araanco-control-theme='box'] .fi-body,
html[data-araanco-control-theme='box'] .fi-main {
    background: var(--araanco-box-canvas);
}

html[data-araanco-control-theme='box'] .fi-main {
    min-height: 100vh;
    max-width: none !important;
    padding-block: 1.35rem 2rem;
}

html[data-araanco-control-theme='box'] .fi-main-ctn {
    background:
        radial-gradient(
            circle at 15% 0%,
            color-mix(in srgb, var(--araanco-color-primary) 7%, transparent),
            transparent 28rem
        ),
        var(--araanco-box-canvas);
}

html[data-araanco-control-theme='box'] .fi-page {
    gap: 1.25rem;
}

html[data-araanco-control-theme='box'] .fi-header-heading {
    color: var(--araanco-box-text);
    font-size: clamp(1.35rem, 2vw, 1.8rem);
    font-weight: 900;
    letter-spacing: -0.025em;
}

html[data-araanco-control-theme='box'] .fi-header-subheading {
    max-width: 64rem;
    color: var(--araanco-box-muted);
    line-height: 1.8;
}

/* Karyar Box shell: the top bar is disabled by the panel provider. */
html[data-araanco-control-theme='box'] .fi-sidebar {
    border: 0;
    background:
        linear-gradient(
            180deg,
            var(--araanco-color-sidebar-top),
            var(--araanco-color-sidebar-bottom)
        );
    box-shadow: 14px 0 34px rgb(15 23 42 / 0.16);
}

html[dir='rtl'][data-araanco-control-theme='box'] .fi-sidebar {
    box-shadow: -14px 0 34px rgb(15 23 42 / 0.16);
}

html[data-araanco-control-theme='box'] .fi-sidebar-header {
    display: grid;
    gap: .7rem;
    padding: 1rem .85rem .65rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

html[data-araanco-control-theme='box'] .fi-sidebar-header .fi-logo {
    color: #fff;
    font-size: 1.06rem;
    font-weight: 900;
    letter-spacing: -.025em;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav {
    padding: .65rem .72rem 1rem;
    scrollbar-width: thin;
    scrollbar-color: rgb(255 255 255 / .22) transparent;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav::-webkit-scrollbar {
    width: 6px;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav::-webkit-scrollbar-track {
    background: transparent;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgb(255 255 255 / .20);
}

html[data-araanco-control-theme='box'] .fi-sidebar-group {
    margin: 0 0 .58rem !important;
    padding: .32rem .38rem .4rem !important;
    border: 1px solid rgb(255 255 255 / .045) !important;
    border-radius: 1rem !important;
    background: rgb(255 255 255 / .035) !important;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .018) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-label {
    color: rgb(255 255 255 / .72) !important;
    font-size: .77rem !important;
    font-weight: 800 !important;
    letter-spacing: .025em;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-btn {
    min-height: 2.65rem !important;
    padding: .42rem .55rem !important;
    border-radius: .78rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-collapse-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-group-btn .fi-icon {
    color: rgb(255 255 255 / .58) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-items {
    gap: .22rem !important;
    margin-top: .15rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav > ul > .fi-sidebar-item {
    margin-bottom: .55rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button {
    min-height: 2.78rem !important;
    padding: .5rem .72rem !important;
    border-radius: .78rem !important;
    color: var(--araanco-sidebar-text) !important;
    background: transparent;
    box-shadow: none;
    transition: background-color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav > ul > .fi-sidebar-item > .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-nav > ul > .fi-sidebar-item > .fi-sidebar-item-button {
    min-height: 3rem !important;
    border: 1px solid rgb(255 255 255 / .045) !important;
    border-radius: 1rem !important;
    background: rgb(255 255 255 / .035) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-label,
html[data-araanco-control-theme='box'] .fi-sidebar-item-icon {
    color: var(--araanco-sidebar-text) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-label {
    font-size: .84rem !important;
    font-weight: 650 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-icon {
    width: 1.12rem !important;
    height: 1.12rem !important;
    opacity: .88;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-btn:hover,
html[data-araanco-control-theme='box'] .fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-button:hover {
    background: var(--araanco-sidebar-soft) !important;
    transform: translateX(1px);
}

html[dir='rtl'][data-araanco-control-theme='box'] .fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-btn:hover,
html[dir='rtl'][data-araanco-control-theme='box'] .fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-button:hover {
    transform: translateX(-1px);
}

html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: linear-gradient(135deg, rgb(255 255 255 / .20), rgb(255 255 255 / .11)) !important;
    box-shadow:
        inset 0 0 0 1px rgb(255 255 255 / .08),
        0 8px 18px rgb(0 0 0 / .10) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active .fi-sidebar-item-label,
html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active .fi-sidebar-item-icon {
    color: #fff !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-footer {
    margin: 0 !important;
    padding: .65rem .78rem .8rem !important;
    border-top: 1px solid rgb(255 255 255 / .11);
    background: transparent !important;
    box-shadow: none !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-footer .fi-user-menu {
    width: 100%;
}

html[data-araanco-control-theme='box'] .fi-sidebar-footer .fi-user-menu-trigger {
    width: 100%;
    min-height: 2.8rem;
    gap: .65rem;
    padding: .46rem .68rem;
    border: 0;
    border-radius: .72rem;
    background: rgb(255 255 255 / .035);
    box-shadow: none;
    color: #fff;
}

html[data-araanco-control-theme='box'] .fi-sidebar-footer .fi-user-menu-trigger:hover,
html[data-araanco-control-theme='box'] .fi-sidebar-footer .fi-user-menu-trigger:focus-visible {
    background: rgb(255 255 255 / .095);
}

html[data-araanco-control-theme='box'] .fi-sidebar-footer .fi-user-menu-trigger-text {
    color: #fff;
    font-size: .82rem;
    font-weight: 750;
}

/* Compact language and appearance controls below the brand. */
.araanco-sidebar-tools {
    display: grid;
    gap: .5rem;
}

.araanco-sidebar-language {
    position: relative;
}

.araanco-sidebar-language summary {
    display: flex;
    min-height: 2.55rem;
    align-items: center;
    gap: .55rem;
    padding: .48rem .65rem;
    border: 1px solid rgb(255 255 255 / .06);
    border-radius: .78rem;
    background: rgb(255 255 255 / .04);
    color: #fff;
    cursor: pointer;
    list-style: none;
}

.araanco-sidebar-language summary::-webkit-details-marker {
    display: none;
}

.araanco-sidebar-language summary:hover {
    background: rgb(255 255 255 / .08);
}

.araanco-sidebar-language summary svg,
.araanco-sidebar-theme-switcher svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.araanco-sidebar-tool-copy {
    min-width: 0;
    flex: 1;
    overflow: hidden;
    font-size: .79rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.araanco-sidebar-tool-chevron {
    color: rgb(255 255 255 / .52);
}

.araanco-sidebar-language-menu {
    position: absolute;
    inset-inline: 0;
    z-index: 80;
    margin-top: .38rem;
    padding: .38rem;
    border: 1px solid var(--araanco-box-border);
    border-radius: .78rem;
    background: var(--araanco-box-surface);
    box-shadow: 0 18px 38px rgb(15 23 42 / .18);
}

.araanco-sidebar-language-option {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .5rem .58rem;
    border: 0;
    border-radius: .58rem;
    background: transparent;
    color: var(--araanco-box-text);
    font-size: .8rem;
    text-align: start;
    cursor: pointer;
}

.araanco-sidebar-language-option:hover {
    background: var(--araanco-box-surface-muted);
}

.araanco-sidebar-language-option[aria-current='true'] {
    color: var(--araanco-color-primary);
    font-weight: 800;
    background: color-mix(in srgb, var(--araanco-color-primary) 9%, transparent);
}

.araanco-sidebar-theme-switcher {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .3rem;
    padding: .3rem;
    border: 1px solid rgb(255 255 255 / .06);
    border-radius: .78rem;
    background: rgb(255 255 255 / .04);
}

.araanco-sidebar-theme-switcher button {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: .58rem;
    background: transparent;
    color: rgb(255 255 255 / .68);
    cursor: pointer;
}

.araanco-sidebar-theme-switcher button:hover,
.araanco-sidebar-theme-switcher button.is-active {
    background: rgb(255 255 255 / .12);
    color: #fff;
}

/* Main surfaces mirror Karyar Box: flatter, smaller radii, quiet shadows. */
html[data-araanco-control-theme='box'] .fi-section,
html[data-araanco-control-theme='box'] .fi-ta-ctn,
html[data-araanco-control-theme='box'] .fi-wi-chart,
html[data-araanco-control-theme='box'] .fi-wi-stats-overview {
    border: 1px solid var(--araanco-box-border);
    border-radius: .75rem !important;
    background: var(--araanco-box-surface);
    box-shadow: 0 14px 34px rgb(20 28 52 / .055);
}

html[data-araanco-control-theme='box'] .fi-btn,
html[data-araanco-control-theme='box'] .fi-input-wrp,
html[data-araanco-control-theme='box'] .fi-select-input,
html[data-araanco-control-theme='box'] .fi-textarea {
    border-radius: .5625rem !important;
}

html[data-araanco-control-theme='box'] .fi-dropdown-panel,
html[data-araanco-control-theme='box'] .fi-modal-window {
    border-radius: .8rem !important;
}

/* Theme settings page now follows the same tabbed, compact Karyar settings language. */
.araanco-theme-settings {
    display: grid;
    gap: 1rem;
}

.araanco-theme-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    padding: .42rem;
    border: 1px solid var(--araanco-box-border);
    border-radius: .78rem;
    background: color-mix(in srgb, var(--araanco-box-surface) 94%, transparent);
    box-shadow: 0 10px 26px rgb(15 23 42 / .045);
}

.araanco-theme-tab {
    display: inline-flex;
    min-height: 2.3rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: .62rem;
    background: transparent;
    color: var(--araanco-box-muted);
    padding: .48rem .9rem;
    font-size: .84rem;
    font-weight: 800;
    cursor: pointer;
}

.araanco-theme-tab:hover {
    background: color-mix(in srgb, var(--araanco-color-primary) 7%, transparent);
    color: var(--araanco-color-primary);
}

.araanco-theme-tab.is-active {
    background: var(--araanco-color-primary);
    color: #fff;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--araanco-color-primary) 22%, transparent);
}

.araanco-theme-tab-panel {
    display: grid;
    gap: 1rem;
}

.araanco-theme-card {
    overflow: hidden;
    border: 1px solid var(--araanco-box-border);
    border-radius: .75rem;
    background: var(--araanco-box-surface);
    box-shadow: 0 14px 34px rgb(15 23 42 / .055);
}

.araanco-theme-card__head {
    padding: .95rem 1.15rem;
    background: linear-gradient(
        135deg,
        var(--araanco-color-card-header-start),
        var(--araanco-color-card-header-end)
    );
    color: #fff;
}

.araanco-theme-card__head h2 {
    margin: 0;
    font-size: .96rem;
    font-weight: 850;
}

.araanco-theme-card__head p {
    margin: .28rem 0 0;
    color: rgb(255 255 255 / .76);
    font-size: .8rem;
}

.araanco-theme-card__body {
    padding: 1.15rem;
}

.araanco-theme-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.araanco-theme-grid--colors {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.araanco-theme-field {
    display: grid;
    gap: .42rem;
}

.araanco-theme-label {
    color: var(--araanco-box-text);
    font-size: .8rem;
    font-weight: 750;
}

.araanco-theme-help {
    color: var(--araanco-box-muted);
    font-size: .74rem;
    line-height: 1.7;
}

.araanco-theme-input,
.araanco-theme-select {
    width: 100%;
    min-height: 2.5rem;
    border: 1px solid var(--araanco-box-border);
    border-radius: .625rem;
    background: var(--araanco-box-surface);
    color: var(--araanco-box-text);
    padding: .48rem .68rem;
    font-size: .84rem;
}

.araanco-theme-color-row {
    display: grid;
    grid-template-columns: 2.8rem minmax(0, 1fr);
    gap: .48rem;
    align-items: center;
}

.araanco-theme-color {
    width: 100%;
    height: 2.5rem;
    border: 1px solid var(--araanco-box-border);
    border-radius: .625rem;
    background: transparent;
    padding: .14rem;
    cursor: pointer;
}

.araanco-theme-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .6rem;
    margin-top: .9rem;
}

.araanco-theme-button {
    display: inline-flex;
    min-height: 2.35rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: .625rem;
    padding: .5rem .9rem;
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
}

.araanco-theme-button--primary {
    background: var(--araanco-color-button);
    color: #fff;
}

.araanco-theme-button--soft {
    background: color-mix(in srgb, var(--araanco-color-primary) 10%, transparent);
    color: var(--araanco-color-primary);
}

.araanco-theme-button--danger {
    background: color-mix(in srgb, var(--araanco-color-danger) 10%, transparent);
    color: var(--araanco-color-danger);
}

.araanco-theme-upload-grid {
    display: grid;
    grid-template-columns: 1.15fr 1.1fr 1.35fr .7fr .7fr;
    gap: .75rem;
    align-items: end;
}

.araanco-theme-locale-checks {
    display: flex;
    flex-wrap: wrap;
    gap: .42rem;
}

.araanco-theme-check {
    display: inline-flex;
    align-items: center;
    gap: .32rem;
    border: 1px solid var(--araanco-box-border);
    border-radius: 999px;
    padding: .32rem .55rem;
    color: var(--araanco-box-text);
    font-size: .74rem;
    background: var(--araanco-box-surface-muted);
}

.araanco-theme-table-wrap {
    margin-top: .9rem;
    overflow-x: auto;
}

.araanco-theme-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
}

.araanco-theme-table th,
.araanco-theme-table td {
    border-bottom: 1px solid var(--araanco-box-border);
    padding: .72rem .62rem;
    text-align: start;
    vertical-align: middle;
}

.araanco-theme-table th {
    color: var(--araanco-box-muted);
    background: var(--araanco-box-surface-muted);
    font-size: .72rem;
    font-weight: 800;
}

.araanco-theme-preview {
    display: grid;
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
    overflow: hidden;
    min-height: 10rem;
    margin-top: .9rem;
    border: 1px solid var(--araanco-box-border);
    border-radius: .75rem;
}

.araanco-theme-preview__sidebar {
    padding: .9rem;
    background: linear-gradient(180deg, var(--araanco-color-sidebar-top), var(--araanco-color-sidebar-bottom));
}

.araanco-theme-preview__sidebar span {
    display: block;
    height: .65rem;
    margin-bottom: .55rem;
    border-radius: 999px;
    background: rgb(255 255 255 / .55);
}

.araanco-theme-preview__main {
    padding: .9rem;
    background: var(--araanco-box-canvas);
}

.araanco-theme-preview__header {
    min-height: 2.25rem;
    border-radius: .62rem;
    background: linear-gradient(135deg, var(--araanco-color-card-header-start), var(--araanco-color-card-header-end));
}

.araanco-theme-preview__button {
    width: 5.6rem;
    min-height: 2rem;
    margin-top: .9rem;
    border-radius: .56rem;
    background: var(--araanco-color-button);
}

[x-cloak] {
    display: none !important;
}

@media (max-width: 980px) {
    .araanco-theme-grid,
    .araanco-theme-grid--colors {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .araanco-theme-upload-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    html[data-araanco-control-theme='box'] .fi-main {
        padding-block: .85rem 1.25rem;
    }

    .araanco-theme-grid,
    .araanco-theme-grid--colors,
    .araanco-theme-upload-grid {
        grid-template-columns: 1fr;
    }

    .araanco-theme-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V3 START */
:root {
    --araanco-color-sidebar-text: #f7f2ff;
    --araanco-color-sidebar-icon: #e6dcff;
    --araanco-color-sidebar-active: #ffffff;
    --araanco-color-header-text: #ffffff;
    --araanco-color-page-background: #f4f6fb;
    --araanco-color-card-background: #ffffff;
    --araanco-color-card-border: #e1e6ef;
    --araanco-radius-sidebar: 28px;
    --araanco-sidebar-width: 258px;
    --araanco-shell-gap: 18px;
    --araanco-header-height: 72px;
}

html[data-araanco-control-theme='box'] {
    --araanco-box-canvas: var(--araanco-color-page-background, #f4f6fb);
    --araanco-box-surface: var(--araanco-color-card-background, #ffffff);
    --araanco-box-border: var(--araanco-color-card-border, #e1e6ef);
    --araanco-sidebar-text: var(--araanco-color-sidebar-text, #f7f2ff);
    --araanco-sidebar-muted: color-mix(in srgb, var(--araanco-color-sidebar-text, #f7f2ff) 72%, transparent);
}

html[data-araanco-control-theme='box'] .fi-body,
html[data-araanco-control-theme='box'] .fi-layout,
html[data-araanco-control-theme='box'] .fi-main,
html[data-araanco-control-theme='box'] .fi-main-ctn {
    background-color: var(--araanco-box-canvas) !important;
}

html[data-araanco-control-theme='box'] .fi-main-ctn {
    background-image:
        radial-gradient(
            circle at 10% 0%,
            color-mix(in srgb, var(--araanco-color-primary, #2563eb) 5%, transparent),
            transparent 30rem
        ) !important;
}

/* Desktop floating Karyar shell. */
@media (min-width: 1024px) {
    html[data-araanco-control-theme='box'] {
        --sidebar-width: var(--araanco-sidebar-width) !important;
    }

    html[data-araanco-control-theme='box'] .fi-sidebar {
        top: var(--araanco-shell-gap) !important;
        bottom: var(--araanco-shell-gap) !important;
        width: var(--araanco-sidebar-width) !important;
        height: auto !important;
        overflow: hidden !important;
        border: 1px solid rgb(255 255 255 / .12) !important;
        border-radius: var(--araanco-radius-sidebar) !important;
        background:
            radial-gradient(
                115% 58% at 12% 0%,
                rgb(255 255 255 / .10) 0%,
                transparent 45%
            ),
            linear-gradient(
                165deg,
                var(--araanco-color-sidebar-top) 0%,
                color-mix(
                    in srgb,
                    var(--araanco-color-sidebar-top) 48%,
                    var(--araanco-color-sidebar-bottom) 52%
                ) 54%,
                var(--araanco-color-sidebar-bottom) 100%
            ) !important;
        box-shadow:
            0 22px 48px color-mix(in srgb, var(--araanco-color-sidebar-top) 23%, transparent),
            inset 0 1px 0 rgb(255 255 255 / .12) !important;
        backdrop-filter: blur(16px) saturate(135%) !important;
    }

    html[dir='rtl'][data-araanco-control-theme='box'] .fi-sidebar {
        right: var(--araanco-shell-gap) !important;
        left: auto !important;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-sidebar {
        left: var(--araanco-shell-gap) !important;
        right: auto !important;
    }

    html[dir='rtl'][data-araanco-control-theme='box'] .fi-main-ctn {
        margin-right: calc(var(--araanco-sidebar-width) + (var(--araanco-shell-gap) * 2)) !important;
        margin-left: 0 !important;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-main-ctn {
        margin-left: calc(var(--araanco-sidebar-width) + (var(--araanco-shell-gap) * 2)) !important;
        margin-right: 0 !important;
    }

    html[data-araanco-control-theme='box'] .fi-main {
        max-width: none !important;
        padding: var(--araanco-shell-gap) var(--araanco-shell-gap) 2.25rem !important;
    }

    html[data-araanco-control-theme='box'] .fi-header {
        position: sticky !important;
        top: var(--araanco-shell-gap) !important;
        z-index: 45 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        min-height: var(--araanco-header-height) !important;
        margin: 0 0 1.45rem !important;
        padding: .95rem 1.65rem !important;
        overflow: visible !important;
        border: 1px solid rgb(255 255 255 / .15) !important;
        border-radius: var(--araanco-radius-header) !important;
        background:
            radial-gradient(
                110% 165% at 12% -45%,
                rgb(255 255 255 / .11) 0%,
                transparent 44%
            ),
            linear-gradient(
                102deg,
                var(--araanco-color-card-header-start) 0%,
                color-mix(
                    in srgb,
                    var(--araanco-color-card-header-start) 42%,
                    var(--araanco-color-card-header-end) 58%
                ) 55%,
                var(--araanco-color-card-header-end) 100%
            ) !important;
        box-shadow:
            0 18px 40px color-mix(in srgb, var(--araanco-color-card-header-start) 18%, transparent),
            inset 0 1px 0 rgb(255 255 255 / .13) !important;
        backdrop-filter: blur(15px) saturate(135%) !important;
    }

    html[data-araanco-control-theme='box'] .fi-header-heading-subheading-ctn {
        min-width: 0 !important;
        margin: 0 !important;
    }

    html[data-araanco-control-theme='box'] .fi-header-heading {
        margin: 0 !important;
        color: var(--araanco-color-header-text) !important;
        font-size: clamp(1.25rem, 1.7vw, 1.65rem) !important;
        font-weight: 800 !important;
        letter-spacing: -.025em !important;
    }

    html[data-araanco-control-theme='box'] .fi-header-subheading {
        margin-top: .25rem !important;
        color: color-mix(in srgb, var(--araanco-color-header-text) 76%, transparent) !important;
        font-size: .82rem !important;
        line-height: 1.7 !important;
    }

    html[data-araanco-control-theme='box'] .fi-header-actions-ctn {
        position: relative !important;
        z-index: 46 !important;
        align-self: center !important;
        margin: 0 !important;
    }
}

/* Header stack: logo -> profile -> compact controls -> navigation. */
html[data-araanco-control-theme='box'] .fi-sidebar-header-ctn {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    gap: .9rem !important;
    padding: 1.3rem .85rem .7rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-header-logo-ctn {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: .05rem 0 .35rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-header .fi-logo {
    color: #fff !important;
    font-size: 1.05rem !important;
    font-weight: 900 !important;
    letter-spacing: -.03em !important;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-identity {
    display: grid;
    gap: .72rem;
    width: 100%;
    min-width: 0;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-card {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    gap: .58rem;
    padding: .48rem .52rem;
    border: 1px solid rgb(255 255 255 / .18);
    border-radius: 1rem;
    background: rgb(255 255 255 / .08);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .07);
    backdrop-filter: blur(12px);
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.55rem;
    height: 2.55rem;
    flex: 0 0 2.55rem;
    border: 2px solid rgb(255 255 255 / .30);
    border-radius: 999px;
    background: linear-gradient(145deg, #fff, #eee9ff);
    color: var(--araanco-color-sidebar-top);
    font-size: .9rem;
    font-weight: 900;
    box-shadow: 0 5px 12px rgb(30 15 70 / .15);
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-copy {
    display: grid;
    gap: .06rem;
    min-width: 0;
    flex: 1 1 auto;
    line-height: 1.35;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-name {
    overflow: hidden;
    color: var(--araanco-color-sidebar-text) !important;
    font-size: .78rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-role {
    overflow: hidden;
    color: color-mix(in srgb, var(--araanco-color-sidebar-text) 70%, transparent) !important;
    font-size: .64rem;
    font-weight: 520;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-logout {
    flex: 0 0 auto;
    margin: 0;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-logout-button,
html[data-araanco-control-theme='box'] .araanco-sidebar-tool-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.15rem;
    height: 2.15rem;
    padding: 0 .48rem;
    border: 1px solid rgb(255 255 255 / .15);
    border-radius: .75rem;
    background: rgb(255 255 255 / .07);
    color: color-mix(in srgb, var(--araanco-color-sidebar-text) 86%, transparent);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .06);
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-logout-button:hover,
html[data-araanco-control-theme='box'] .araanco-sidebar-tool-button:hover,
html[data-araanco-control-theme='box'] .araanco-sidebar-tool-button.is-active {
    border-color: rgb(255 255 255 / .27);
    background: rgb(255 255 255 / .14);
    color: #fff;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-logout-button svg,
html[data-araanco-control-theme='box'] .araanco-sidebar-tool-button svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-quick-tools {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
    width: 100%;
    padding-bottom: .15rem;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-theme-switcher {
    display: flex;
    align-items: center;
    gap: .25rem;
    padding-inline-start: .35rem;
    border-inline-start: 1px solid rgb(255 255 255 / .14);
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language {
    position: relative;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language summary {
    list-style: none;
    cursor: pointer;
    gap: .3rem;
    font-size: .62rem;
    font-weight: 800;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language summary::-webkit-details-marker {
    display: none;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language-menu {
    position: absolute;
    z-index: 800;
    top: calc(100% + .45rem);
    inset-inline-start: 0;
    display: grid;
    width: 11.5rem;
    padding: .35rem;
    border: 1px solid rgb(255 255 255 / .16);
    border-radius: .9rem;
    background: linear-gradient(145deg, var(--araanco-color-sidebar-top), var(--araanco-color-sidebar-bottom));
    box-shadow: 0 18px 38px rgb(20 10 55 / .25);
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: .55rem .62rem;
    border-radius: .65rem;
    color: var(--araanco-color-sidebar-text);
    font-size: .72rem;
    text-align: start;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language-option:hover,
html[data-araanco-control-theme='box'] .araanco-sidebar-language-option[aria-current='true'] {
    background: rgb(255 255 255 / .12);
}

/* Native Filament sidebar footer is replaced by the Karyar-style identity card. */
html[data-araanco-control-theme='box'] .fi-sidebar-footer {
    display: none !important;
}

/* Navigation is intentionally transparent and accordion-like, like current Karyar Box. */
html[data-araanco-control-theme='box'] .fi-sidebar-nav {
    margin-top: .35rem !important;
    padding: .45rem .68rem 1.4rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-nav > ul {
    gap: .18rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: .85rem !important;
    background: transparent !important;
    box-shadow: none !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group + .fi-sidebar-group {
    margin-top: .12rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-btn {
    min-height: 2.75rem !important;
    padding: .48rem .62rem !important;
    border-radius: .82rem !important;
    background: transparent !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-btn:hover {
    background: rgb(255 255 255 / .07) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-label,
html[data-araanco-control-theme='box'] .fi-sidebar-group-btn .fi-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-group-collapse-btn {
    color: color-mix(in srgb, var(--araanco-color-sidebar-text) 88%, transparent) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-label {
    font-size: .76rem !important;
    font-weight: 720 !important;
    letter-spacing: 0 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-items {
    gap: .08rem !important;
    margin: .05rem 0 .18rem !important;
    padding-inline-start: .2rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button {
    min-height: 2.58rem !important;
    padding: .44rem .62rem !important;
    border: 0 !important;
    border-radius: .78rem !important;
    background: transparent !important;
    color: var(--araanco-color-sidebar-text) !important;
    box-shadow: none !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-label {
    color: var(--araanco-color-sidebar-text) !important;
    font-size: .75rem !important;
    font-weight: 580 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-item-btn .fi-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button .fi-icon {
    color: var(--araanco-color-sidebar-icon) !important;
    opacity: .92 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-btn:hover,
html[data-araanco-control-theme='box'] .fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-button:hover {
    background: rgb(255 255 255 / .075) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: color-mix(in srgb, var(--araanco-color-sidebar-active) 13%, transparent) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--araanco-color-sidebar-active) 15%, transparent),
        inset 0 1px 0 rgb(255 255 255 / .08) !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active .fi-sidebar-item-label,
html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active .fi-sidebar-item-icon {
    color: var(--araanco-color-sidebar-active) !important;
}

/* Karyar-like white surfaces and softer large radii. */
html[data-araanco-control-theme='box'] :is(
    .fi-section,
    .fi-ta-ctn,
    .fi-wi-stats-overview,
    .fi-wi-chart,
    .fi-modal-window,
    .fi-dropdown-panel
) {
    border-color: var(--araanco-color-card-border) !important;
    border-radius: var(--araanco-radius-general) !important;
    background: var(--araanco-color-card-background) !important;
    box-shadow: 0 14px 34px rgb(45 38 76 / .055) !important;
}

html.dark[data-araanco-control-theme='box'] {
    --araanco-box-canvas: #0e1020;
    --araanco-box-surface: #171a2e;
    --araanco-box-border: rgb(140 136 181 / .19);
}

html.dark[data-araanco-control-theme='box'] .fi-body,
html.dark[data-araanco-control-theme='box'] .fi-layout,
html.dark[data-araanco-control-theme='box'] .fi-main,
html.dark[data-araanco-control-theme='box'] .fi-main-ctn {
    background-color: #0e1020 !important;
}

html.dark[data-araanco-control-theme='box'] :is(
    .fi-section,
    .fi-ta-ctn,
    .fi-wi-stats-overview,
    .fi-wi-chart,
    .fi-modal-window,
    .fi-dropdown-panel
) {
    border-color: rgb(140 136 181 / .19) !important;
    background: #171a2e !important;
}

/* Theme preview now mirrors the real floating sidebar + horizontal page header. */
html[data-araanco-control-theme='box'] .araanco-theme-grid--interface {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 9.5rem;
    gap: .8rem;
    min-height: 15rem;
    margin-top: 1.1rem;
    padding: .9rem;
    overflow: hidden;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: calc(var(--araanco-radius-general) + 4px);
    background: var(--araanco-color-page-background);
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__sidebar {
    order: 2;
    display: grid;
    align-content: start;
    gap: .55rem;
    padding: .85rem .65rem;
    border-radius: var(--araanco-radius-sidebar);
    background: linear-gradient(165deg, var(--araanco-color-sidebar-top), var(--araanco-color-sidebar-bottom));
    color: var(--araanco-color-sidebar-text);
    box-shadow: 0 12px 26px rgb(55 31 111 / .18);
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__sidebar strong {
    margin-bottom: .3rem;
    color: var(--araanco-color-sidebar-text);
    font-size: .68rem;
    text-align: center;
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__profile {
    height: 2.5rem;
    margin-bottom: .25rem;
    border: 1px solid rgb(255 255 255 / .18);
    border-radius: .8rem;
    background: rgb(255 255 255 / .08);
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__sidebar > span {
    height: .55rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--araanco-color-sidebar-active) 18%, transparent);
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__main {
    order: 1;
    display: grid;
    grid-template-rows: 3.4rem 1fr;
    gap: .85rem;
    min-width: 0;
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__header {
    border-radius: var(--araanco-radius-header);
    background: linear-gradient(102deg, var(--araanco-color-card-header-start), var(--araanco-color-card-header-end));
    box-shadow: 0 10px 22px rgb(63 38 124 / .13);
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
}

html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__cards i {
    min-height: 5.25rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: var(--araanco-radius-general);
    background: var(--araanco-color-card-background);
    box-shadow: 0 8px 18px rgb(45 38 76 / .045);
}

@media (max-width: 1023px) {
    html[data-araanco-control-theme='box'] .fi-sidebar {
        top: 0 !important;
        bottom: 0 !important;
        height: 100dvh !important;
        border-radius: 0 !important;
    }

    html[data-araanco-control-theme='box'] .araanco-theme-grid--interface {
        grid-template-columns: 1fr;
    }

    html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar {
        grid-template-columns: 1fr;
    }

    html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__sidebar {
        order: 1;
        grid-template-columns: repeat(4, 1fr);
        border-radius: var(--araanco-radius-general);
    }

    html[data-araanco-control-theme='box'] .araanco-theme-preview--karyar .araanco-theme-preview__main {
        order: 2;
    }
}
/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V3 END */

/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V4 START */
/* Structural pass: wider inset sidebar, full-height floating shell, larger navigation/profile, and full-width page hero. */
:root {
    --araanco-sidebar-width: 312px;
    --araanco-shell-gap: 24px;
    --araanco-content-sidebar-gap: 24px;
}

@media (min-width: 1024px) {
    html[data-araanco-control-theme='box'] .fi-sidebar {
        position: fixed !important;
        top: var(--araanco-shell-gap) !important;
        bottom: auto !important;
        width: var(--araanco-sidebar-width) !important;
        height: calc(100dvh - (var(--araanco-shell-gap) * 2)) !important;
        min-height: calc(100dvh - (var(--araanco-shell-gap) * 2)) !important;
        max-height: calc(100dvh - (var(--araanco-shell-gap) * 2)) !important;
        display: flex !important;
        flex-direction: column !important;
    }

    html[dir='rtl'][data-araanco-control-theme='box'] .fi-sidebar {
        right: var(--araanco-shell-gap) !important;
        left: auto !important;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-sidebar {
        left: var(--araanco-shell-gap) !important;
        right: auto !important;
    }

    html[data-araanco-control-theme='box'] .fi-sidebar-nav {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
    }

    /* Keep exactly one visual gap between the full-width content/hero and the sidebar. */
    html[dir='rtl'][data-araanco-control-theme='box'] .fi-main-ctn {
        width: auto !important;
        max-width: none !important;
        margin-right: calc(var(--araanco-sidebar-width) + var(--araanco-shell-gap) + var(--araanco-content-sidebar-gap)) !important;
        margin-left: 0 !important;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-main-ctn {
        width: auto !important;
        max-width: none !important;
        margin-left: calc(var(--araanco-sidebar-width) + var(--araanco-shell-gap) + var(--araanco-content-sidebar-gap)) !important;
        margin-right: 0 !important;
    }

    html[data-araanco-control-theme='box'] .fi-main {
        width: 100% !important;
        max-width: none !important;
        padding-top: var(--araanco-shell-gap) !important;
        padding-bottom: 2.25rem !important;
    }

    html[dir='rtl'][data-araanco-control-theme='box'] .fi-main {
        padding-right: 0 !important;
        padding-left: var(--araanco-shell-gap) !important;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-main {
        padding-left: 0 !important;
        padding-right: var(--araanco-shell-gap) !important;
    }

    html[data-araanco-control-theme='box'] :is(.fi-page, .fi-page > *, .araanco-theme-settings) {
        width: 100% !important;
        max-width: none !important;
    }

    html[data-araanco-control-theme='box'] .fi-header {
        width: 100% !important;
        max-width: none !important;
        align-self: stretch !important;
        margin-inline: 0 !important;
    }
}

/* Larger brand / profile block to match the Karyar visual hierarchy. */
html[data-araanco-control-theme='box'] .fi-sidebar-header {
    gap: 1rem !important;
    padding: 1.45rem 1rem .8rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-header .fi-logo {
    font-size: 1.16rem !important;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-card {
    min-height: 5.35rem;
    gap: .78rem;
    padding: .72rem .76rem;
    border-radius: 1.15rem;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-avatar {
    width: 3.35rem;
    height: 3.35rem;
    flex-basis: 3.35rem;
    font-size: 1.03rem;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-copy {
    gap: .14rem;
    line-height: 1.45;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-name {
    font-size: 1rem !important;
    font-weight: 820 !important;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-role {
    font-size: .78rem !important;
    font-weight: 540 !important;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-logout-button,
html[data-araanco-control-theme='box'] .araanco-sidebar-tool-button {
    min-width: 2.45rem;
    height: 2.45rem;
    border-radius: .82rem;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-logout-button svg,
html[data-araanco-control-theme='box'] .araanco-sidebar-tool-button svg {
    width: 1.13rem;
    height: 1.13rem;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language summary {
    font-size: .72rem !important;
}

/* Navigation typography and hit areas. */
html[data-araanco-control-theme='box'] .fi-sidebar-nav {
    padding-inline: .9rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-btn {
    min-height: 3rem !important;
    padding: .56rem .7rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-label {
    font-size: .94rem !important;
    font-weight: 760 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button {
    min-height: 2.92rem !important;
    padding: .52rem .72rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-label {
    font-size: .94rem !important;
    font-weight: 620 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-item-btn .fi-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button .fi-icon {
    width: 1.22rem !important;
    height: 1.22rem !important;
}

/* Slightly larger page hero text while keeping the V3 color system intact. */
@media (min-width: 1024px) {
    html[data-araanco-control-theme='box'] .fi-header {
        padding-inline: 1.85rem !important;
    }

    html[data-araanco-control-theme='box'] .fi-header-heading {
        font-size: clamp(1.45rem, 1.85vw, 1.8rem) !important;
    }

    html[data-araanco-control-theme='box'] .fi-header-subheading {
        font-size: .9rem !important;
    }
}
/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V4 END */

/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V5 START */
/*
 * Layout polish requested after V4 visual review:
 * - page hero is truly fixed and top-aligned with the floating sidebar
 * - navigation type is lighter and a little smaller
 * - all top-level Filament boxes use the full available content width
 * - dashboard widgets receive consistent inner gutters and inter-card spacing
 */

@media (min-width: 1024px) {
    /*
     * Keep the horizontal page hero anchored to the viewport. Using fixed
     * positioning instead of sticky avoids movement caused by ancestor
     * scrolling/overflow contexts and guarantees exact alignment with the
     * sidebar's top edge.
     */
    html[data-araanco-control-theme='box'] .fi-header {
        position: fixed !important;
        top: var(--araanco-shell-gap) !important;
        z-index: 60 !important;
        width: auto !important;
        min-height: var(--araanco-header-height) !important;
        max-width: none !important;
        margin: 0 !important;
    }

    html[dir='rtl'][data-araanco-control-theme='box'] .fi-header {
        right: calc(var(--araanco-sidebar-width) + var(--araanco-shell-gap) + var(--araanco-content-sidebar-gap)) !important;
        left: var(--araanco-shell-gap) !important;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-header {
        right: var(--araanco-shell-gap) !important;
        left: calc(var(--araanco-sidebar-width) + var(--araanco-shell-gap) + var(--araanco-content-sidebar-gap)) !important;
    }

    /* Reserve the hero's former document-flow height so page content never sits underneath it. */
    html[data-araanco-control-theme='box'] .fi-page {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        padding-top: calc(var(--araanco-header-height) + 1.35rem) !important;
    }
}

/* Navigation: retain hierarchy without the heavy V4 weight. */
html[data-araanco-control-theme='box'] .fi-sidebar-group-btn {
    min-height: 2.82rem !important;
    padding: .5rem .68rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-group-label {
    font-size: .875rem !important;
    font-weight: 560 !important;
    letter-spacing: 0 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button {
    min-height: 2.72rem !important;
    padding: .47rem .7rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-label {
    font-size: .875rem !important;
    font-weight: 500 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active .fi-sidebar-item-label {
    font-weight: 600 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-item-btn .fi-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-item-button .fi-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-group-btn .fi-icon,
html[data-araanco-control-theme='box'] .fi-sidebar-group-collapse-btn {
    width: 1.1rem !important;
    height: 1.1rem !important;
}

/*
 * Full-width surface contract.
 * Panel-level maxContentWidth is already Width::Full; these rules remove
 * residual width/grid constraints from box-like schema components while
 * deliberately leaving individual form fields and their column layout alone.
 */
html[data-araanco-control-theme='box'] :is(
    .fi-page,
    .fi-page > *,
    .fi-form,
    .fi-infolist,
    .fi-ta,
    .fi-ta-ctn,
    .fi-section,
    .fi-sc-section,
    .fi-sc-tabs,
    .fi-sc-wizard,
    .fi-widgets-grid,
    .fi-wi,
    .fi-wi-stats-overview,
    .fi-wi-chart,
    .araanco-theme-settings
) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
}

/* Section/Tabs/Wizard are the visual boxes; span the parent schema grid fully. */
html[data-araanco-control-theme='box'] :is(
    .fi-sc-section,
    .fi-sc-tabs,
    .fi-sc-wizard
) {
    grid-column: 1 / -1 !important;
}

/* Prevent common Filament max-width utility wrappers from narrowing resource content. */
html[data-araanco-control-theme='box'] .fi-page :is(
    .max-w-xl,
    .max-w-2xl,
    .max-w-3xl,
    .max-w-4xl,
    .max-w-5xl,
    .max-w-6xl,
    .max-w-7xl
) {
    max-width: none !important;
    width: 100% !important;
}

/* Dashboard: give every module breathing room instead of letting content touch the card edges. */
html[data-araanco-control-theme='box'] .fi-widgets-grid {
    gap: 1.25rem !important;
    align-items: stretch !important;
}

html[data-araanco-control-theme='box'] .fi-wi-stats-overview {
    box-sizing: border-box !important;
    padding: 1.05rem 1.1rem 1.15rem !important;
    overflow: hidden !important;
}

html[data-araanco-control-theme='box'] .fi-wi-stats-overview :is(
    .fi-section,
    .fi-sc-section
) {
    width: 100% !important;
    max-width: none !important;
}

/* StatsOverview can contain an internal uncontained Section in Filament 5. */
html[data-araanco-control-theme='box'] .fi-wi-stats-overview .fi-sc-section {
    padding: 0 !important;
}

html[data-araanco-control-theme='box'] .fi-wi-stats-overview .fi-section {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html[data-araanco-control-theme='box'] .fi-wi-stats-overview :is(
    .fi-wi-stats-overview-header,
    .fi-section-header
) {
    min-height: auto !important;
    margin: 0 !important;
    padding: .05rem .15rem .85rem !important;
    background: transparent !important;
}

html[data-araanco-control-theme='box'] .fi-wi-stats-overview :is(
    .fi-section-content-ctn,
    .fi-wi-stats-overview-stats-ctn
) {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

html[data-araanco-control-theme='box'] .fi-wi-stats-overview-stats-ctn,
html[data-araanco-control-theme='box'] .fi-wi-stats-overview .fi-section-content {
    gap: 1rem !important;
}

/* Individual dashboard stat cards no longer touch one another or the group boundary. */
html[data-araanco-control-theme='box'] .fi-wi-stats-overview-stat {
    box-sizing: border-box !important;
    min-width: 0 !important;
    padding: 1rem 1.05rem !important;
    border-radius: calc(var(--araanco-radius-general) * .78) !important;
}

/* Generic dashboard charts/tables/sections get matching internal gutters. */
html[data-araanco-control-theme='box'] .fi-widgets-grid > :is(.fi-wi-chart, .fi-section, .fi-ta-ctn) {
    padding: 1rem !important;
}

@media (max-width: 1023px) {
    /* Desktop-only fixed hero is disabled on compact layouts. */
    html[data-araanco-control-theme='box'] .fi-header {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
    }

    html[data-araanco-control-theme='box'] .fi-page {
        padding-top: 0 !important;
    }

    html[data-araanco-control-theme='box'] .fi-wi-stats-overview {
        padding: .85rem !important;
    }
}
/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V5 END */

/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V6 START */
/*
 * Navigation/hero polish:
 * - hero top edge aligns with the floating sidebar and remains locked while scrolling
 * - hero title is smaller and lighter
 * - sidebar navigation typography is slightly smaller/lighter
 * - accordion behavior is implemented by the V6 theme-head helper
 */

@media (min-width: 1024px) {
    /*
     * In the Filament shell the fixed header inherits the main container's
     * desktop positioning context. V5's extra shell-gap offset therefore
     * visually doubled the top inset. Zeroing the local offset aligns the
     * hero's physical top edge with the sidebar's shell-gap edge.
     */
    html[data-araanco-control-theme='box'] .fi-header {
        position: fixed !important;
        top: 0 !important;
        margin-top: 0 !important;
        transform: translateZ(0);
        will-change: auto;
    }

    html[data-araanco-control-theme='box'] .fi-header-heading {
        font-size: clamp(1.18rem, 1.35vw, 1.42rem) !important;
        font-weight: 600 !important;
        letter-spacing: -.015em !important;
        line-height: 1.35 !important;
    }
}

/* Lighter, calmer sidebar typography. */
html[data-araanco-control-theme='box'] .fi-sidebar-group-label {
    font-size: .85rem !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item-label {
    font-size: .85rem !important;
    font-weight: 460 !important;
    letter-spacing: 0 !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-item.fi-active .fi-sidebar-item-label {
    font-weight: 560 !important;
}

/* Keep accordion controls visually subordinate to the menu copy. */
html[data-araanco-control-theme='box'] .fi-sidebar-group-collapse-btn,
html[data-araanco-control-theme='box'] .fi-sidebar-group-btn .fi-icon {
    opacity: .78 !important;
}

/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V6 END */

/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V7 START */
/*
 * Fixed-header occlusion + dashboard density + sidebar tool/brand polish:
 * - restore the floating header's top edge to the sidebar shell gap
 * - mask scrolled content above/behind the fixed hero
 * - reduce dashboard widget typography without affecting resource forms
 * - make language control icon-only and visually identical to adjacent tools
 * - add breathing room around the sidebar brand/logo
 */

@media (min-width: 1024px) {
    /* Physical alignment: hero and sidebar begin on the same shell-gap line. */
    html[data-araanco-control-theme='box'] .fi-header {
        top: var(--araanco-shell-gap) !important;
        margin-top: 0 !important;
        z-index: 70 !important;
    }

    /*
     * Fixed hero occlusion plate. It covers the viewport strip occupied by
     * the floating hero (including its rounded-corner cutouts and the gap
     * above it), so dashboard/resource content can never scroll visibly over
     * the hero or through the top shell gap.
     */
    html[data-araanco-control-theme='box'] .fi-main-ctn::before {
        content: '';
        position: fixed;
        top: 0;
        z-index: 69;
        height: calc(var(--araanco-shell-gap) + var(--araanco-header-height) + 1rem);
        background:
            radial-gradient(
                circle at 10% 0%,
                color-mix(in srgb, var(--araanco-color-primary, #2563eb) 5%, transparent),
                transparent 30rem
            ),
            var(--araanco-box-canvas);
        pointer-events: none;
    }

    html[dir='rtl'][data-araanco-control-theme='box'] .fi-main-ctn::before {
        right: calc(var(--araanco-sidebar-width) + var(--araanco-shell-gap) + var(--araanco-content-sidebar-gap));
        left: 0;
    }

    html[dir='ltr'][data-araanco-control-theme='box'] .fi-main-ctn::before {
        right: 0;
        left: calc(var(--araanco-sidebar-width) + var(--araanco-shell-gap) + var(--araanco-content-sidebar-gap));
    }

    /* Keep the normal document-flow reserve consistent with the fixed hero. */
    html[data-araanco-control-theme='box'] .fi-page {
        padding-top: calc(var(--araanco-header-height) + var(--araanco-shell-gap) + .35rem) !important;
    }
}

/* Sidebar brand/logo: visible breathing room above and below the mark. */
html[data-araanco-control-theme='box'] .fi-sidebar-header {
    padding-top: 1.8rem !important;
}

html[data-araanco-control-theme='box'] .fi-sidebar-header-logo-ctn {
    margin-top: .2rem !important;
    margin-bottom: .8rem !important;
}

/* Language selector is now icon-only, matching the adjacent appearance tools. */
html[data-araanco-control-theme='box'] .araanco-sidebar-language summary.araanco-sidebar-tool-button {
    width: 2.45rem !important;
    min-width: 2.45rem !important;
    height: 2.45rem !important;
    padding: 0 !important;
    gap: 0 !important;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-language summary.araanco-sidebar-tool-button svg {
    width: 1.13rem !important;
    height: 1.13rem !important;
}

/* Dashboard-only typography density. Resource forms/tables are untouched. */
html[data-araanco-control-theme='box'] .fi-widgets-grid .fi-section-header-heading {
    font-size: .9rem !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;
}

html[data-araanco-control-theme='box'] .fi-widgets-grid .fi-section-header-description {
    font-size: .76rem !important;
    line-height: 1.65 !important;
}

html[data-araanco-control-theme='box'] .fi-widgets-grid .fi-wi-stats-overview-stat-label {
    font-size: .76rem !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
}

html[data-araanco-control-theme='box'] .fi-widgets-grid .fi-wi-stats-overview-stat-value {
    font-size: clamp(1.08rem, 1.4vw, 1.48rem) !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    letter-spacing: -.015em !important;
}

html[data-araanco-control-theme='box'] .fi-widgets-grid .fi-wi-stats-overview-stat-description {
    font-size: .72rem !important;
    line-height: 1.55 !important;
}

html[data-araanco-control-theme='box'] .fi-widgets-grid .fi-wi-stats-overview-stat-content {
    row-gap: .38rem !important;
}

@media (max-width: 1023px) {
    html[data-araanco-control-theme='box'] .fi-main-ctn::before {
        display: none !important;
    }
}
/* ARAANCO CONTROL PLANE — KARYAR BOX SHELL V7 END */



/* ARAANCO CONTROL PLANE — COLOR PRESET SYSTEM V8 START */
/*
 * Comprehensive semantic color tokens. Presets only change color; layout,
 * typography, radii, and content density stay under their existing controls.
 */
:root {
    --araanco-color-button-text: #ffffff;
    --araanco-color-link: #5b46c5;
    --araanco-color-text-primary: #172033;
    --araanco-color-text-muted: #6b7280;
    --araanco-color-icon: #6b7280;
    --araanco-color-input-background: #ffffff;
    --araanco-color-input-border: #d8dfeb;
    --araanco-color-input-text: #172033;
    --araanco-color-input-focus: #6d4cc7;
    --araanco-color-table-header-background: #f7f5fd;
    --araanco-color-table-header-text: #3e3269;
    --araanco-color-info: #2563eb;
    --araanco-color-warning: #d97706;
}

/* Primary actions use one semantic contract across Filament components. */
html[data-araanco-control-theme='box'] .fi-btn.fi-color-primary,
html[data-araanco-control-theme='box'] .fi-ac-btn-action.fi-color-primary,
html[data-araanco-control-theme='box'] button.araanco-theme-button--primary {
    background: var(--araanco-color-button) !important;
    color: var(--araanco-color-button-text) !important;
}

html[data-araanco-control-theme='box'] .fi-btn.fi-color-primary:hover,
html[data-araanco-control-theme='box'] .fi-ac-btn-action.fi-color-primary:hover {
    background: color-mix(in srgb, var(--araanco-color-button) 88%, #000 12%) !important;
}

/* Light-mode page, surface, text and icon semantics. */
html:not(.dark)[data-araanco-control-theme='box'] .fi-body,
html:not(.dark)[data-araanco-control-theme='box'] .fi-main,
html:not(.dark)[data-araanco-control-theme='box'] .fi-layout {
    color: var(--araanco-color-text-primary) !important;
}

html:not(.dark)[data-araanco-control-theme='box'] .fi-section-header-heading,
html:not(.dark)[data-araanco-control-theme='box'] .fi-header-heading,
html:not(.dark)[data-araanco-control-theme='box'] .fi-ta-header-heading,
html:not(.dark)[data-araanco-control-theme='box'] .fi-fo-field-wrp-label,
html:not(.dark)[data-araanco-control-theme='box'] .fi-in-entry-wrp-label,
html:not(.dark)[data-araanco-control-theme='box'] .fi-wi-stats-overview-stat-value {
    color: var(--araanco-color-text-primary);
}

html:not(.dark)[data-araanco-control-theme='box'] .fi-section-header-description,
html:not(.dark)[data-araanco-control-theme='box'] .fi-header-subheading,
html:not(.dark)[data-araanco-control-theme='box'] .fi-fo-field-wrp-helper-text,
html:not(.dark)[data-araanco-control-theme='box'] .fi-wi-stats-overview-stat-label,
html:not(.dark)[data-araanco-control-theme='box'] .fi-wi-stats-overview-stat-description,
html:not(.dark)[data-araanco-control-theme='box'] .fi-ta-text-item-description {
    color: var(--araanco-color-text-muted) !important;
}

html:not(.dark)[data-araanco-control-theme='box'] a:not(.fi-sidebar-item-btn):not(.fi-btn),
html:not(.dark)[data-araanco-control-theme='box'] .fi-link {
    color: var(--araanco-color-link);
}

html:not(.dark)[data-araanco-control-theme='box'] .fi-icon:not(.fi-sidebar .fi-icon) {
    color: var(--araanco-color-icon);
}

/* Inputs/selects/textareas: same preset-aware surface and focus contract. */
html:not(.dark)[data-araanco-control-theme='box'] .fi-input-wrp,
html:not(.dark)[data-araanco-control-theme='box'] .fi-select-input,
html:not(.dark)[data-araanco-control-theme='box'] .fi-input,
html:not(.dark)[data-araanco-control-theme='box'] textarea.fi-input,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-input,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-select {
    background: var(--araanco-color-input-background) !important;
    border-color: var(--araanco-color-input-border) !important;
    color: var(--araanco-color-input-text) !important;
}

html:not(.dark)[data-araanco-control-theme='box'] .fi-input-wrp:focus-within,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-input:focus,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-select:focus {
    border-color: var(--araanco-color-input-focus) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--araanco-color-input-focus) 18%, transparent) !important;
}

/* Table chrome follows the selected palette. */
html:not(.dark)[data-araanco-control-theme='box'] .fi-ta-header,
html:not(.dark)[data-araanco-control-theme='box'] .fi-ta-header-cell,
html:not(.dark)[data-araanco-control-theme='box'] .fi-ta-header-cell-label {
    background: var(--araanco-color-table-header-background);
    color: var(--araanco-color-table-header-text) !important;
}

/* The custom Theme Settings screen itself participates in the preset. */
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-card,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-tabs {
    background: var(--araanco-color-card-background);
    border-color: var(--araanco-color-card-border);
}

html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-label,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-preset__copy strong {
    color: var(--araanco-color-text-primary);
}

html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-help,
html:not(.dark)[data-araanco-control-theme='box'] .araanco-theme-preset__copy small {
    color: var(--araanco-color-text-muted);
}

/* Ready-made palette chooser. */
.araanco-theme-presets {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .85rem;
}

.araanco-theme-preset {
    position: relative;
    display: grid;
    gap: .72rem;
    min-height: 9.2rem;
    padding: .85rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: calc(var(--araanco-radius-general) * .8);
    background: var(--araanco-color-card-background);
    text-align: start;
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.araanco-theme-preset:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--araanco-color-primary) 45%, var(--araanco-color-card-border));
    box-shadow: 0 10px 26px color-mix(in srgb, var(--araanco-color-primary) 10%, transparent);
}

.araanco-theme-preset.is-selected {
    border-color: var(--araanco-color-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--araanco-color-primary) 12%, transparent);
}

.araanco-theme-preset__swatches {
    display: grid;
    grid-template-columns: 1.3fr 1fr .72fr .58fr .58fr;
    height: 2.5rem;
    overflow: hidden;
    border-radius: .72rem;
    border: 1px solid color-mix(in srgb, #64748b 16%, transparent);
}

.araanco-theme-preset__swatches i { display: block; }

.araanco-theme-preset__copy {
    display: grid;
    gap: .25rem;
}

.araanco-theme-preset__copy strong {
    font-size: .88rem;
    font-weight: 650;
}

.araanco-theme-preset__copy small {
    font-size: .72rem;
    line-height: 1.65;
}

.araanco-theme-preset__badge {
    position: absolute;
    top: .55rem;
    inset-inline-end: .55rem;
    padding: .18rem .42rem;
    border-radius: 999px;
    background: var(--araanco-color-primary);
    color: #fff;
    font-size: .65rem;
    font-weight: 650;
}

@media (max-width: 1280px) {
    .araanco-theme-presets { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
    .araanco-theme-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 540px) {
    .araanco-theme-presets { grid-template-columns: 1fr; }
}
/* ARAANCO CONTROL PLANE — COLOR PRESET SYSTEM V8 END */

/* ARAANCO CONTROL PLANE — MODULAR DASHBOARD V9 START */
.araanco-dashboard-runtime-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem;
    margin-bottom: 1rem;
}

.araanco-dashboard-runtime-tab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    padding: .8rem 1rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: calc(var(--araanco-radius-general) * .72);
    background: var(--araanco-color-card-background);
    color: var(--araanco-color-text-primary);
    cursor: pointer;
    transition: .16s ease;
}

.araanco-dashboard-runtime-tab:hover,
.araanco-dashboard-runtime-tab.is-active {
    border-color: color-mix(in srgb, var(--araanco-color-primary) 55%, var(--araanco-color-card-border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--araanco-color-primary) 10%, transparent);
}

.araanco-dashboard-runtime-tab > span {
    font-size: .88rem;
    font-weight: 650;
}

.araanco-dashboard-runtime-tab small {
    padding: .2rem .48rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--araanco-color-text-muted) 10%, transparent);
    color: var(--araanco-color-text-muted);
    font-size: .67rem;
}

.araanco-dashboard-runtime-tab small.is-enabled {
    background: color-mix(in srgb, var(--araanco-color-success) 12%, transparent);
    color: var(--araanco-color-success);
}

.araanco-dashboard-runtime-tab small.is-disabled {
    background: color-mix(in srgb, var(--araanco-color-warning) 12%, transparent);
    color: var(--araanco-color-warning);
}

.araanco-dashboard-designer {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
    gap: 1rem;
    align-items: start;
}

.araanco-dashboard-designer__modules {
    display: grid;
    gap: .75rem;
}

.araanco-dashboard-module {
    display: grid;
    gap: .8rem;
    padding: .9rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: calc(var(--araanco-radius-general) * .72);
    background: color-mix(in srgb, var(--araanco-color-card-background) 96%, var(--araanco-color-primary) 4%);
}

.araanco-dashboard-module__heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.araanco-dashboard-module__heading > div {
    display: grid;
    gap: .2rem;
}

.araanco-dashboard-module__heading strong {
    font-size: .86rem;
    font-weight: 650;
    color: var(--araanco-color-text-primary);
}

.araanco-dashboard-module__heading small {
    font-size: .7rem;
    line-height: 1.65;
    color: var(--araanco-color-text-muted);
}

.araanco-dashboard-switch {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    white-space: nowrap;
    font-size: .7rem;
    color: var(--araanco-color-text-muted);
}

.araanco-dashboard-switch input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--araanco-color-primary);
}

.araanco-dashboard-module__controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .8rem;
    align-items: end;
}

.araanco-dashboard-order-controls {
    display: grid;
    grid-template-columns: auto auto;
    gap: .35rem;
}

.araanco-dashboard-order-controls > span {
    grid-column: 1 / -1;
    font-size: .7rem;
    font-weight: 600;
    color: var(--araanco-color-text-muted);
}

.araanco-dashboard-order-controls button {
    width: 2.35rem;
    height: 2.35rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: .72rem;
    background: var(--araanco-color-card-background);
    color: var(--araanco-color-text-primary);
    cursor: pointer;
}

.araanco-dashboard-order-controls button:hover {
    border-color: var(--araanco-color-primary);
    color: var(--araanco-color-primary);
}

.araanco-dashboard-preview-wrap {
    position: sticky;
    top: calc(var(--araanco-shell-gap) + var(--araanco-header-height) + 1rem);
    padding: .9rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: var(--araanco-radius-general);
    background: color-mix(in srgb, var(--araanco-color-page-background) 82%, var(--araanco-color-card-background));
}

.araanco-dashboard-preview-head {
    display: grid;
    gap: .18rem;
    margin-bottom: .7rem;
}

.araanco-dashboard-preview-head strong {
    font-size: .82rem;
    color: var(--araanco-color-text-primary);
}

.araanco-dashboard-preview-head small {
    font-size: .68rem;
    color: var(--araanco-color-text-muted);
}

.araanco-dashboard-preview {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: .55rem;
    min-height: 15rem;
    padding: .7rem;
    border-radius: calc(var(--araanco-radius-general) * .8);
    background: var(--araanco-color-page-background);
}

.araanco-dashboard-preview__module {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .4rem;
    min-height: 5.2rem;
    padding: .65rem;
    border: 1px solid var(--araanco-color-card-border);
    border-radius: calc(var(--araanco-radius-general) * .62);
    background: var(--araanco-color-card-background);
    box-shadow: 0 8px 22px color-mix(in srgb, #0f172a 7%, transparent);
}

.araanco-dashboard-preview__module.is-full { grid-column: span 12; }
.araanco-dashboard-preview__module.is-half { grid-column: span 6; }
.araanco-dashboard-preview__module.is-third { grid-column: span 4; }

.araanco-dashboard-preview__module > span {
    grid-column: 1 / -1;
    font-size: .67rem;
    font-weight: 650;
    color: var(--araanco-color-text-primary);
}

.araanco-dashboard-preview__module i {
    display: block;
    min-height: 1.8rem;
    border-radius: .5rem;
    background: color-mix(in srgb, var(--araanco-color-primary) 10%, var(--araanco-color-card-background));
}

.araanco-dashboard-designer > .araanco-theme-actions {
    grid-column: 1 / -1;
}

@media (max-width: 1100px) {
    .araanco-dashboard-designer { grid-template-columns: 1fr; }
    .araanco-dashboard-preview-wrap { position: static; }
}

@media (max-width: 640px) {
    .araanco-dashboard-runtime-tabs { grid-template-columns: 1fr; }
    .araanco-dashboard-module__controls { grid-template-columns: 1fr; }
    .araanco-dashboard-preview__module.is-half,
    .araanco-dashboard-preview__module.is-third { grid-column: span 12; }
}
/* ARAANCO CONTROL PLANE — MODULAR DASHBOARD V9 END */
/* ARAANCO CONTROL PLANE - DASHBOARD TYPOGRAPHY CONTROLS V9.4 START */
/*
 * The dashboard typography controls are intentionally global across runtimes.
 * Scope is attached to <html> by theme-head only while the current Filament
 * page is the Dashboard, so resource forms and tables remain untouched.
 */
html[data-araanco-control-theme='box'][data-araanco-dashboard-page='1'] :is(
    .fi-section-header-heading,
    .fi-wi-stats-overview-header-heading
) {
    font-size: var(--araanco-dashboard-box-title-size, 14px) !important;
    line-height: 1.45 !important;
}

html[data-araanco-control-theme='box'][data-araanco-dashboard-page='1'] :is(
    .fi-section-header-description,
    .fi-wi-stats-overview-header-description
) {
    font-size: var(--araanco-dashboard-box-subtitle-size, 12px) !important;
    line-height: 1.55 !important;
}

html[data-araanco-control-theme='box'][data-araanco-dashboard-page='1'] .fi-wi-stats-overview-stat-label {
    font-size: var(--araanco-dashboard-card-title-size, 12px) !important;
    line-height: 1.4 !important;
}

html[data-araanco-control-theme='box'][data-araanco-dashboard-page='1'] .fi-wi-stats-overview-stat-value {
    font-size: var(--araanco-dashboard-card-content-size, 16px) !important;
    line-height: 1.38 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

html[data-araanco-control-theme='box'][data-araanco-dashboard-page='1'] .fi-wi-stats-overview-stat-description {
    font-size: var(--araanco-dashboard-card-footer-size, 11px) !important;
    line-height: 1.5 !important;
}

html[data-araanco-control-theme='box'][data-araanco-dashboard-page='1'] .fi-wi-stats-overview-stat-content {
    row-gap: .3rem !important;
}

/* Dashboard typography designer. */
.araanco-dashboard-typography-settings {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding: 1rem;
    border: 1px solid var(--araanco-color-card-border, #e1e6ef);
    border-radius: var(--araanco-radius-general, 18px);
    background: color-mix(in srgb, var(--araanco-color-card-background, #fff) 96%, var(--araanco-color-primary, #6d4cc7) 4%);
}

.araanco-dashboard-typography-settings__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.araanco-dashboard-typography-settings__head h3 {
    margin: 0;
    font-size: .95rem;
    font-weight: 650;
    color: var(--araanco-color-text-primary, #172033);
}

.araanco-dashboard-typography-settings__head p {
    margin: .25rem 0 0;
    font-size: .78rem;
    line-height: 1.7;
    color: var(--araanco-color-text-muted, #6b7280);
}

.araanco-dashboard-typography-settings__head > span {
    flex: 0 0 auto;
    padding: .34rem .58rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--araanco-color-primary, #6d4cc7) 10%, transparent);
    color: var(--araanco-color-primary, #6d4cc7);
    font-size: .68rem;
    font-weight: 600;
}

.araanco-dashboard-typography-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.araanco-dashboard-typography-preview {
    display: grid;
    gap: .75rem;
    padding: 1rem;
    border: 1px solid var(--araanco-color-card-border, #e1e6ef);
    border-radius: calc(var(--araanco-radius-general, 18px) - 2px);
    background: var(--araanco-color-card-background, #fff);
}

.araanco-dashboard-typography-preview__heading {
    display: grid;
    gap: .18rem;
}

.araanco-dashboard-typography-preview__heading strong {
    font-size: var(--preview-dashboard-box-title, 14px);
    line-height: 1.45;
    font-weight: 600;
    color: var(--araanco-color-text-primary, #172033);
}

.araanco-dashboard-typography-preview__heading small {
    font-size: var(--preview-dashboard-box-subtitle, 12px);
    line-height: 1.55;
    color: var(--araanco-color-text-muted, #6b7280);
}

.araanco-dashboard-typography-preview__card {
    display: grid;
    gap: .3rem;
    min-width: 0;
    padding: .9rem 1rem;
    border: 1px solid var(--araanco-color-card-border, #e1e6ef);
    border-radius: calc(var(--araanco-radius-general, 18px) - 4px);
    background: var(--araanco-color-card-background, #fff);
}

.araanco-dashboard-typography-preview__card > span {
    font-size: var(--preview-dashboard-card-title, 12px);
    line-height: 1.4;
    color: var(--araanco-color-text-muted, #6b7280);
}

.araanco-dashboard-typography-preview__card > b {
    min-width: 0;
    font-size: var(--preview-dashboard-card-content, 16px);
    line-height: 1.38;
    font-weight: 600;
    color: var(--araanco-color-text-primary, #172033);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.araanco-dashboard-typography-preview__card > small {
    font-size: var(--preview-dashboard-card-footer, 11px);
    line-height: 1.5;
    color: var(--araanco-color-text-muted, #6b7280);
}

.araanco-dashboard-typography-actions {
    margin-top: 0 !important;
}

@media (max-width: 1100px) {
    .araanco-dashboard-typography-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .araanco-dashboard-typography-settings__head {
        flex-direction: column;
    }

    .araanco-dashboard-typography-grid {
        grid-template-columns: 1fr;
    }
}
/* ARAANCO CONTROL PLANE - DASHBOARD TYPOGRAPHY CONTROLS V9.4 END */
/* AraanCo Control Plane profile-card link (V18.3.4 P3) */
html[data-araanco-control-theme='box'] .araanco-sidebar-profile-link {
    display: flex;
    align-items: center;
    gap: inherit;
    min-width: 0;
    flex: 1 1 auto;
    color: inherit;
    text-decoration: none;
    border-radius: .9rem;
    outline: none;
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-link:focus-visible {
    box-shadow: 0 0 0 2px rgb(255 255 255 / .72);
}

html[data-araanco-control-theme='box'] .araanco-sidebar-profile-link:hover .araanco-sidebar-profile-name {
    text-decoration: underline;
    text-decoration-thickness: .08em;
    text-underline-offset: .18em;
}

/* AraanCo Control Plane profile polish (V18.3.4 P4) */
.araanco-profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: stretch;
}

.araanco-profile-section {
    min-width: 0;
}

.araanco-profile-section > .fi-section-content-ctn,
.araanco-profile-section .fi-section-content {
    height: 100%;
}

.araanco-profile-account-summary {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    margin-bottom: 1.25rem;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 1rem;
    background: rgba(148, 163, 184, .08);
}

.araanco-profile-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 4rem;
    width: 4rem;
    height: 4rem;
    border: 1px solid rgba(148, 163, 184, .32);
    border-radius: 9999px;
    background: rgba(255, 255, 255, .85);
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1;
}

.araanco-profile-account-copy {
    min-width: 0;
}

.araanco-profile-account-name {
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.4;
}

.araanco-profile-account-email {
    margin-top: .2rem;
    color: #64748b;
    font-size: .875rem;
    overflow-wrap: anywhere;
}

.araanco-profile-form {
    display: grid;
    gap: 1rem;
}

.araanco-profile-field-grid {
    display: grid;
    gap: 1rem;
}

.araanco-profile-field-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.araanco-profile-field {
    min-width: 0;
}

.araanco-profile-label {
    display: block;
    margin-bottom: .4rem;
    font-size: .875rem;
    font-weight: 650;
}

.araanco-profile-help {
    margin: .4rem 0 0;
    color: #64748b;
    font-size: .75rem;
    line-height: 1.55;
}

.araanco-profile-error {
    margin: .4rem 0 0;
    color: #dc2626;
    font-size: .8rem;
}

.araanco-profile-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: .25rem;
}

.araanco-profile-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.araanco-profile-stat {
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: .9rem;
    background: rgba(148, 163, 184, .08);
}

.araanco-profile-stat--wide {
    grid-column: 1 / -1;
}

.araanco-profile-stat-label {
    margin-bottom: .45rem;
    color: #64748b;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.araanco-profile-stat-value {
    min-width: 0;
    font-size: .9rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.araanco-profile-identities {
    display: grid;
    gap: 1rem;
}

.araanco-profile-identity-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .3);
    border-radius: 1rem;
    background: rgba(255, 255, 255, .62);
}

.araanco-profile-identity-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .85rem;
    padding: 1rem;
    border-bottom: 1px solid rgba(148, 163, 184, .24);
    background: rgba(148, 163, 184, .07);
}

.araanco-profile-identity-title {
    font-weight: 750;
}

.araanco-profile-identity-user {
    margin-top: .2rem;
    color: #64748b;
    font-size: .8rem;
    overflow-wrap: anywhere;
}

.araanco-profile-identity-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    padding: 1rem;
}

.araanco-profile-identity-item {
    min-width: 0;
    padding: .8rem;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: .75rem;
    background: rgba(148, 163, 184, .055);
}

.araanco-profile-identity-item--wide {
    grid-column: 1 / -1;
}

.araanco-profile-identity-label {
    display: block;
    margin-bottom: .35rem;
    color: #64748b;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.araanco-profile-identity-value {
    display: block;
    min-width: 0;
    font-size: .83rem;
    font-weight: 650;
    overflow-wrap: anywhere;
}

.araanco-profile-verified {
    color: #059669;
    font-weight: 800;
}

.araanco-profile-empty {
    padding: 2rem 1rem;
    border: 1px dashed rgba(148, 163, 184, .45);
    border-radius: 1rem;
    color: #64748b;
    text-align: center;
    font-size: .875rem;
}

.dark .araanco-profile-account-summary,
.dark .araanco-profile-stat,
.dark .araanco-profile-identity-item {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .09);
}

.dark .araanco-profile-avatar {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .12);
}

.dark .araanco-profile-account-email,
.dark .araanco-profile-help,
.dark .araanco-profile-stat-label,
.dark .araanco-profile-identity-user,
.dark .araanco-profile-identity-label,
.dark .araanco-profile-empty {
    color: #94a3b8;
}

.dark .araanco-profile-identity-card {
    background: rgba(255, 255, 255, .025);
    border-color: rgba(255, 255, 255, .1);
}

.dark .araanco-profile-identity-head {
    background: rgba(255, 255, 255, .035);
    border-bottom-color: rgba(255, 255, 255, .08);
}

@media (max-width: 1100px) {
    .araanco-profile-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .araanco-profile-field-grid--two,
    .araanco-profile-stat-grid,
    .araanco-profile-identity-details {
        grid-template-columns: 1fr;
    }

    .araanco-profile-stat--wide,
    .araanco-profile-identity-item--wide {
        grid-column: auto;
    }

    .araanco-profile-account-summary {
        align-items: flex-start;
    }
}