html,
body {
    min-height: 100%;
}

body {
    --edm-surface: #ffffff;
    --edm-surface-soft: #f8faf8;
    --edm-border: #d8e4e8;
    --edm-text-soft: #65727b;
    --edm-grid: rgba(69, 118, 128, .08);
    font-family: var(--edm-font);
    min-height: 100vh;
    color: #10201f;
    letter-spacing: 0;
    background:
        linear-gradient(var(--edm-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--edm-grid) 1px, transparent 1px),
        linear-gradient(115deg, #edf6f7 0%, #fbfbf7 62%, #fffaf2 100%);
    background-size: 18px 18px, 18px 18px, auto;
}

[data-bs-theme="dark"] body {
    --edm-surface: #15191c;
    --edm-surface-soft: #1b2025;
    --edm-border: #303944;
    --edm-text-soft: #c8d0d8;
    --edm-grid: rgba(255,255,255,.035);
    color: #edf2f7;
    background:
        linear-gradient(var(--edm-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--edm-grid) 1px, transparent 1px),
        linear-gradient(115deg, #102033 0%, #07090a 58%, #050607 100%);
    background-size: 18px 18px, 18px 18px, auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 800;
    letter-spacing: 0;
}

body,
.form-control,
.form-select,
.btn,
.table {
    font-size: .92rem;
}

.app-shell {
    display: flex;
}

.sidebar {
    position: fixed;
    inset: 12px auto 12px 12px;
    width: 278px;
    padding: 12px;
    flex-direction: column;
    background: var(--edm-card-bg);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 42px rgba(23, 43, 54, .08);
    z-index: 1020;
}

[data-bs-theme="dark"] .sidebar {
    background: rgba(15, 19, 23, .92);
    box-shadow: 0 18px 42px rgba(0,0,0,.22);
}

.sidebar-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 124px;
    margin-bottom: 12px;
    color: var(--bs-body-color);
    text-decoration: none;
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,250,.72));
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

[data-bs-theme="dark"] .sidebar-brand {
    background: rgba(255,255,255,.04);
}

.sidebar-brand img {
    width: 174px;
    height: 118px;
    object-fit: contain;
}

.sidebar-brand .logo-dark {
    display: none;
}

[data-bs-theme="dark"] .sidebar-brand .logo-light {
    display: none;
}

[data-bs-theme="dark"] .sidebar-brand .logo-dark {
    display: block;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 5px;
    overflow-y: auto;
    padding-right: 2px;
}

.nav-section {
    margin: 16px 4px 5px;
    color: var(--edm-text-soft);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .04em;
}

.sidebar-nav a,
.sidebar-logout {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 8px 10px;
    color: #44515a;
    text-decoration: none;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    background: rgba(255,255,255,.62);
    font-size: .84rem;
    font-weight: 400;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

[data-bs-theme="dark"] .sidebar-nav a,
[data-bs-theme="dark"] .sidebar-logout {
    color: var(--edm-text-soft);
    background: rgba(255,255,255,.035);
}

.sidebar-nav a i,
.sidebar-logout i {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 11%, transparent);
    border-radius: 8px;
    font-size: .9rem;
}

.sidebar-nav a:hover,
.sidebar-logout:hover {
    color: #10201f;
    background: #fff;
}

.sidebar-nav a.active {
    color: #10201f;
    background: #fff;
    border-color: var(--edm-border);
    box-shadow: none;
    font-weight: 650;
}

.sidebar-nav a.active::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    background: var(--edm-primary);
    border-radius: 8px 0 0 8px;
}

[data-bs-theme="dark"] .sidebar-nav a:hover,
[data-bs-theme="dark"] .sidebar-logout:hover,
[data-bs-theme="dark"] .sidebar-nav a.active {
    color: #fff;
    background: rgba(255,255,255,.07);
}

[data-bs-theme="dark"] .sidebar-nav a,
[data-bs-theme="dark"] .sidebar-logout,
[data-bs-theme="dark"] .sidebar-brand {
    border-color: #35424d;
}

.sidebar-logout {
    margin-top: auto;
}

.sidebar-bottom {
    display: grid;
    gap: 8px;
    margin-top: auto;
    padding-top: 10px;
}

.sidebar-bottom .sidebar-logout {
    margin-top: 0;
}

.sidebar-flash {
    margin: 0;
    min-height: 0;
    padding: 8px 30px 8px 10px;
    border-radius: 8px;
    font-size: .74rem;
    font-weight: 500;
    line-height: 1.22;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .06), 0 1px 4px rgba(23, 43, 54, .03);
}

.sidebar-flash .btn-close {
    padding: 9px;
    font-size: .62rem;
}

[data-bs-theme="dark"] .sidebar-flash {
    border-color: #35424d;
}

.mobile-sidebar {
    --bs-offcanvas-bg: var(--edm-card-bg);
    border-right: 1px solid var(--edm-border);
}

[data-bs-theme="dark"] .mobile-sidebar {
    --bs-offcanvas-bg: #0f1317;
}

.mobile-sidebar .offcanvas-body {
    display: flex;
    flex-direction: column;
}

.sidebar-toggle {
    position: fixed;
    top: 16px;
    left: 16px;
    z-index: 1030;
    width: 44px;
    height: 40px;
    border-radius: 8px;
}

.content-area {
    width: 100%;
    min-height: 100vh;
    padding-left: 302px;
}

.content-inner {
    width: min(1480px, 100%);
    padding: 12px 14px 28px;
}

.topbar {
    position: relative;
    z-index: 20;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 86px;
    margin-bottom: 16px;
    padding: 14px 16px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 12%, transparent) 0%, rgba(240,247,251,.78) 24%, rgba(255,255,255,.88) 58%, rgba(255,255,255,.74) 100%),
        var(--edm-card-bg);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    backdrop-filter: blur(18px);
}

[data-bs-theme="dark"] .topbar {
    background: rgba(21, 25, 28, .86);
}

.topbar h1 {
    margin: 0;
    font-size: clamp(1.28rem, 1.8vw, 1.72rem);
    font-weight: 520;
}

.topbar-actions {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.manifest-chip {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    width: min(430px, 44vw);
    padding: 7px 10px 7px 8px;
    color: #10201f;
    text-decoration: none;
    background: rgba(255,255,255,.82);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(23, 43, 54, .06), 0 1px 4px rgba(23, 43, 54, .025);
    appearance: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.manifest-chip:hover {
    color: #10201f;
    border-color: var(--edm-primary);
}

.manifest-chip-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 12%, transparent);
    border-radius: 8px;
    font-size: 1rem;
}

.manifest-chip-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.manifest-chip-copy strong,
.manifest-chip-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.manifest-chip-copy strong {
    font-size: .78rem;
    font-weight: 800;
}

.manifest-chip-copy small {
    color: var(--edm-text-soft);
    font-size: .66rem;
}

.manifest-chip-days {
    display: inline-grid;
    place-items: center;
    min-width: 58px;
    min-height: 32px;
    padding: 5px 9px;
    color: #fff;
    background: var(--edm-primary-fill);
    border-radius: 8px;
    font-size: .72rem;
    font-weight: 900;
}

.manifest-chip-chevron {
    color: var(--edm-text-soft);
    font-size: .78rem;
}

.manifest-dropdown {
    width: min(460px, calc(100vw - 32px));
    padding: 8px;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(23, 43, 54, .14);
}

.manifest-dropdown-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 8px 10px;
    border-bottom: 1px solid var(--edm-border);
}

.manifest-dropdown-head strong {
    font-size: .8rem;
    font-weight: 800;
}

.manifest-dropdown-head span {
    color: var(--edm-text-soft);
    font-size: .72rem;
    font-weight: 700;
}

.manifest-dropdown-list {
    display: grid;
    gap: 6px;
    max-height: min(360px, 52vh);
    overflow-y: auto;
    padding: 8px 2px;
}

.manifest-dropdown-item {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 52px;
    padding: 8px;
    color: #10201f;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 8px;
}

.manifest-dropdown-item:hover {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
    border-color: color-mix(in srgb, var(--edm-primary) 24%, var(--edm-border));
}

.manifest-dropdown-date {
    display: inline-grid;
    place-items: center;
    min-height: 34px;
    color: #fff;
    background: var(--edm-primary-fill);
    border-radius: 8px;
    font-size: .72rem;
    font-weight: 900;
}

.manifest-dropdown-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.manifest-dropdown-copy strong,
.manifest-dropdown-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.manifest-dropdown-copy strong {
    font-size: .8rem;
    font-weight: 750;
}

.manifest-dropdown-copy small {
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.manifest-dropdown-empty {
    padding: 14px 8px;
    color: var(--edm-text-soft);
    font-size: .78rem;
}

.manifest-dropdown-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px;
    color: #10201f;
    text-decoration: none;
    border-top: 1px solid var(--edm-border);
    border-radius: 0 0 6px 6px;
    font-size: .78rem;
    font-weight: 750;
}

.manifest-dropdown-footer i {
    color: var(--edm-primary);
}

.manifest-dropdown-footer:hover {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
}

.manifest-chip-due {
    border-color: #e55353;
    background: color-mix(in srgb, #e55353 9%, #ffffff);
}

.manifest-chip-due .manifest-chip-icon,
.manifest-chip-due .manifest-chip-days {
    color: #fff;
    background: #e55353;
}

.manifest-chip-soon {
    border-color: #d98b20;
    background: color-mix(in srgb, #f5a623 12%, #ffffff);
}

.manifest-chip-soon .manifest-chip-icon,
.manifest-chip-soon .manifest-chip-days {
    color: #fff;
    background: #d98b20;
}

.manifest-chip-stable .manifest-chip-icon,
.manifest-chip-stable .manifest-chip-days {
    color: #fff;
    background: #148a5b;
}

[data-bs-theme="dark"] .manifest-chip {
    color: #e8eef4;
    background: rgba(255,255,255,.05);
    border-color: #35424d;
}

[data-bs-theme="dark"] .manifest-chip:hover {
    color: #e8eef4;
    border-color: var(--edm-primary);
}

[data-bs-theme="dark"] .manifest-chip-due {
    background: color-mix(in srgb, #e55353 18%, #15191c);
    border-color: #e55353;
}

[data-bs-theme="dark"] .manifest-chip-soon {
    background: color-mix(in srgb, #d98b20 18%, #15191c);
    border-color: #d98b20;
}

[data-bs-theme="dark"] .manifest-dropdown {
    background: rgba(23, 30, 36, .98);
    border-color: #35424d;
    box-shadow: 0 18px 48px rgba(0,0,0,.34);
}

[data-bs-theme="dark"] .manifest-dropdown-head,
[data-bs-theme="dark"] .manifest-dropdown-footer {
    border-color: #35424d;
}

[data-bs-theme="dark"] .manifest-dropdown-item,
[data-bs-theme="dark"] .manifest-dropdown-footer {
    color: #e8eef4;
}

[data-bs-theme="dark"] .manifest-dropdown-item:hover,
[data-bs-theme="dark"] .manifest-dropdown-footer:hover {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

.user-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 6px 12px 6px 6px;
    background: rgba(255,255,255,.8);
    border: 1px solid var(--edm-border);
    border-radius: 999px;
    appearance: none;
    cursor: pointer;
}

[data-bs-theme="dark"] .user-chip {
    background: rgba(255,255,255,.05);
}

.user-avatar {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    color: #fff;
    background: var(--edm-primary);
    border-radius: 50%;
    font-weight: 800;
    overflow: hidden;
}

.user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.user-meta {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.user-meta strong {
    font-size: .82rem;
    font-weight: 650;
}

.user-meta span {
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.user-menu-chevron {
    color: var(--edm-text-soft);
    font-size: .78rem;
}

.user-dropdown {
    z-index: 1080;
    min-width: 210px;
    padding: 8px;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(23, 43, 54, .14);
}

.user-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 6px;
    min-height: 38px;
    font-size: .86rem;
}

.user-dropdown .dropdown-item i {
    color: var(--edm-primary);
}

[data-bs-theme="dark"] .user-dropdown {
    background: rgba(23, 30, 36, .98);
    border-color: #35424d;
    box-shadow: 0 18px 48px rgba(0,0,0,.34);
}

.bento-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 96px));
    justify-content: start;
    gap: 16px;
}

.customers-layout {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    justify-content: stretch;
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.customers-layout > .customer-left-stack {
    grid-column: 1 / span 8;
    display: grid;
    grid-template-rows: minmax(260px, 1fr) auto;
    gap: 16px;
    min-height: 0;
    height: 100%;
    order: 1;
}

.customers-layout > .customer-edit-card {
    grid-column: 9 / span 4;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
    order: 2;
}

.customer-edit-card {
    gap: 8px !important;
}

.bento.customer-edit-card > :not(.bento-title) {
    width: calc(100% - 24px);
    margin-left: 12px;
    margin-right: 12px;
}

.bento.customer-edit-card > :last-child {
    margin-bottom: 12px;
}

.customer-edit-card .bento-title,
.customer-list-card .bento-title {
    min-height: 88px;
    padding: 24px 24px 20px;
}

.customer-list-card,
.customer-detail-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.customer-list-card .bento-title,
.customer-detail-card .bento-title {
    flex: 0 0 auto;
}

.customer-list-card .list-search {
    flex: 0 0 auto;
    margin: 16px 24px 8px;
}

.bento.customer-list-card > .table-responsive {
    flex: 1 1 auto;
    min-height: 0;
    margin: 0 24px 18px;
    overflow: auto;
}

.customer-detail-body {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr);
    align-items: stretch;
    gap: 16px;
    flex: 0 0 auto;
    min-height: 0;
    margin: 14px 24px 18px;
}

.customer-detail-card .bento-title {
    min-height: 88px;
    padding: 24px 24px 20px;
}

.customer-address-block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    min-height: 0;
    height: 100%;
    padding: 14px 16px;
    color: #10201f;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    font-size: .96rem;
    font-weight: 400;
    line-height: 1.45;
}

.customer-address-block .is-company {
    font-weight: 720;
}

.customer-detail-meta {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: 42px;
    gap: 8px;
    min-width: 0;
}

.customer-detail-item {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 42px;
    padding: 8px 10px;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.customer-detail-item span {
    color: var(--edm-text-soft);
    font-size: .68rem;
    font-weight: 720;
    text-transform: uppercase;
}

.customer-detail-item strong,
.customer-detail-item a {
    min-width: 0;
    color: #10201f;
    font-size: .8rem;
    font-weight: 620;
    line-height: 1.25;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-bs-theme="dark"] .customer-address-block,
[data-bs-theme="dark"] .customer-detail-item {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .customer-detail-item strong,
[data-bs-theme="dark"] .customer-detail-item a {
    color: #e8eef4;
}

.content-inner:has(.customers-layout),
.content-inner:has(.articles-layout),
.content-inner:has(.ads-layout),
.content-inner:has(.designer-layout),
.content-inner:has(.users-layout),
.content-inner:has(.dashboard-layout),
.content-inner:has(.pdf-layout),
.content-inner:has(.exports-layout),
.content-inner:has(.backups-layout),
.content-inner:has(.edm-data-layout),
.content-inner:has(.settings-layout) {
    width: 100%;
    max-width: none;
}

.content-inner:has(.customers-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.articles-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.ads-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.designer-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.users-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.pdf-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.exports-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.settings-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.content-inner:has(.backups-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    padding-bottom: 14px;
}

.articles-layout,
.users-layout,
.dashboard-layout,
.pdf-layout,
.exports-layout,
.backups-layout,
.settings-layout {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    justify-content: stretch;
    width: 100%;
}

.articles-layout {
    grid-template-rows: minmax(0, 1fr);
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.articles-layout > .bento {
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.exports-layout {
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.exports-layout > .bento {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.users-layout {
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.users-layout > .bento {
    min-height: 0;
    height: 100%;
}

.pdf-layout {
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.pdf-layout > .bento {
    min-height: 0;
    height: 100%;
}

.pdf-upload-card {
    overflow-y: auto;
}

.pdf-upload-card .form-section:has(.document-list) {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.pdf-view-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.pdf-view-card > .bento-title {
    flex: 0 0 auto;
}

.pdf-view-card > .form-section {
    margin: 24px;
}

.user-form-card {
    overflow-y: auto;
}

.user-list-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.user-list-card > .table-responsive {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.backups-layout {
    grid-template-rows: auto minmax(0, 1fr);
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.backup-history-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.backup-history-card > .table-responsive {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.backup-history-action-col {
    width: 74px;
    text-align: right;
    white-space: nowrap;
}

.backup-history-action-col form {
    display: inline-flex;
    margin: 0;
}

.article-list-card,
.article-side-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.article-table-wrap {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    margin: 0 24px 12px;
}

.article-list-head,
.article-row {
    display: grid;
    grid-template-columns: 88px 180px minmax(0, 1fr) 110px 100px 104px;
    align-items: center;
    gap: 0;
}

.article-list-head {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 34px;
    padding: 0 12px 0 18px;
    color: #5f7380;
    font-size: .62rem;
    font-weight: 740;
    text-transform: uppercase;
    background: var(--edm-surface);
}

.article-list-head span,
.article-row > span {
    padding: 0 10px;
}

.article-list-head span:first-child,
.article-row > span:first-child {
    padding-left: 0;
}

.article-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    min-height: 0;
}

.article-row {
    position: relative;
    min-height: 54px;
    padding: 7px 12px 7px 18px;
    color: #10201f;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    cursor: pointer;
    overflow: hidden;
}

.article-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: transparent;
}

.article-row:hover,
.article-row:focus-visible,
.article-row.is-active {
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
    border-color: color-mix(in srgb, var(--edm-primary) 24%, var(--edm-border));
    outline: none;
}

.article-row:hover::before,
.article-row:focus-visible::before,
.article-row.is-active::before {
    background: var(--edm-primary);
}

.article-row span {
    min-width: 0;
    overflow: hidden;
    font-size: .78rem;
    line-height: 1.25;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-row .article-name {
    font-weight: 500;
}

.article-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.article-actions form {
    margin: 0;
}

.article-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
}

.article-group-form,
.article-group-section {
    flex: 0 0 auto;
}

.article-management-footer {
    display: grid;
    grid-template-columns: minmax(320px, .45fr) minmax(0, 1fr);
    align-items: start;
    gap: 16px;
    flex: 0 0 290px;
    min-height: 0;
    margin: 0 24px 24px;
    padding-top: 16px;
    border-top: 1px solid var(--edm-border);
}

.article-side-body {
    display: grid;
    align-content: start;
    flex: 1 1 auto;
    gap: 12px;
    padding: 18px;
    min-height: 0;
    overflow-y: auto;
}

.article-stat-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    min-height: 42px;
    padding: 8px 10px;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.article-stat-line span {
    color: var(--edm-text-soft);
    font-size: .72rem;
    font-weight: 760;
    text-transform: uppercase;
}

.article-stat-line strong {
    color: var(--edm-primary);
    font-size: 1rem;
    line-height: 1;
}

.article-group-form {
    display: grid;
    gap: 7px;
}

.article-assignment-form {
    display: grid;
    gap: 12px;
}

.article-assignment-block {
    display: grid;
    gap: 10px;
    padding: 10px;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.article-assignment-choice {
    display: grid;
    gap: 8px;
    padding: 10px;
    background: rgba(255,255,255,.66);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
}

.article-assignment-choice-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 8px;
}

.article-assignment-choice-head > span {
    color: var(--edm-text-soft);
    font-size: .72rem;
    font-weight: 720;
}

.article-assignment-choice-head .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
}

.article-assignment-selected {
    display: grid;
    align-content: start;
    gap: 0;
    height: 82px;
    padding: 4px 8px;
    overflow-y: auto;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
}

.article-assignment-pill,
.article-assignment-empty {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    max-width: 100%;
    padding: 4px 0;
    overflow: hidden;
    font-size: .74rem;
    font-weight: 400;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-assignment-pill {
    color: #10201f;
    border-bottom: 1px solid rgba(191, 210, 222, .72);
}

.article-assignment-empty {
    color: var(--edm-text-soft);
    font-style: italic;
}

.article-assignment-search {
    margin: 0 0 14px;
}

.article-assignment-picker {
    display: grid;
    gap: 8px;
    max-height: min(56vh, 520px);
    overflow-y: auto;
    padding-right: 4px;
}

.article-assignment-picker-row {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 8px 10px;
    color: #10201f;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.article-assignment-picker-row input {
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: var(--edm-primary);
}

.article-assignment-picker-row span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.article-assignment-picker-row strong,
.article-assignment-picker-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-assignment-picker-row strong {
    font-size: .78rem;
    font-weight: 680;
}

.article-assignment-picker-row small {
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.article-group-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 8px;
}

.article-group-entry .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    min-height: 38px;
    padding: 0;
}

.article-group-list {
    display: grid;
    gap: 8px;
    max-height: 244px;
    overflow-y: auto;
    padding-right: 4px;
}

.article-group-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 7px 8px 7px 12px;
    color: #10201f;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.article-group-item span {
    min-width: 0;
    overflow: hidden;
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-group-item form {
    margin: 0;
}

.article-group-item .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
}

.ads-layout {
    grid-template-columns: repeat(16, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.ads-layout > .bento {
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.ads-landfill-card,
.ad-assignment-card,
.ad-preview-card,
.ads-layout .customer-ad-list-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.designer-layout {
    grid-template-columns: repeat(16, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow: hidden;
}

.designer-layout > .bento {
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.bento {
    position: relative;
    background: var(--edm-card-bg);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    padding: 0;
    box-shadow: 0 12px 28px rgba(23, 43, 54, .12), 0 2px 8px rgba(23, 43, 54, .05);
    backdrop-filter: blur(12px);
    overflow: hidden;
}

.bento:focus-within {
    border-color: var(--edm-border);
}

.bento:focus-within::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    background: var(--edm-primary);
    border-radius: 8px 0 0 8px;
}

.bento:not(:has(.bento-title)) {
    padding: 14px;
}

.bento > .table-responsive,
.bento > .vstack,
.bento > .row,
.bento > ul,
.bento > p {
    margin: 24px;
}

.bento.vstack > .bento-title {
    width: 100%;
}

.bento.vstack > :not(.bento-title) {
    width: calc(100% - 48px);
    margin-left: 24px;
    margin-right: 24px;
}

.bento.vstack > :last-child {
    margin-bottom: 24px;
}

[data-bs-theme="dark"] .bento {
    background: rgba(21, 25, 28, .88);
    border-color: #35424d;
    box-shadow: 0 18px 46px rgba(0,0,0,.18);
}

.bento-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    min-height: 88px;
    margin: 0;
    padding: 24px 24px 20px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 12%, transparent) 0%, rgba(240,247,251,.78) 24%, rgba(255,255,255,.88) 58%, rgba(255,255,255,.74) 100%);
    border-bottom: 1px solid var(--edm-border);
}

[data-bs-theme="dark"] .bento-title {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 18%, transparent) 0%, rgba(26,34,41,.9) 34%, rgba(21,25,28,.84) 100%);
}

.bento-title h2 {
    margin: 0;
    font-size: .92rem;
    font-weight: 720;
}

.bento-title p {
    margin: 2px 0 0;
    color: var(--edm-text-soft);
    font-size: .7rem;
    font-weight: 600;
}

.icon-action {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 8px;
}

.metric-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 30px 24px 24px;
}

.metric-card {
    min-height: 112px;
    padding: 18px 16px;
    background: rgba(255,255,255,.9);
    border: 1px solid var(--edm-border);
    border-left: 4px solid var(--edm-primary);
    border-radius: 8px;
}

[data-bs-theme="dark"] .metric-card {
    background: rgba(255,255,255,.04);
}

.metric-card span {
    display: block;
    margin-bottom: 16px;
    color: var(--edm-text-soft);
    font-size: .78rem;
}

.metric-card strong,
.metric {
    display: block;
    color: #10201f;
    font-size: clamp(1.7rem, 2.7vw, 2.35rem);
    font-weight: 760;
    line-height: 1;
}

[data-bs-theme="dark"] .metric-card strong,
[data-bs-theme="dark"] .metric {
    color: #fff;
}

.mini-chart {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    align-items: end;
    gap: 18px;
    min-height: 270px;
    padding: 24px 14px 10px;
    background:
        radial-gradient(circle, rgba(63, 107, 116, .16) 1px, transparent 1px),
        rgba(255,255,255,.52);
    background-size: 20px 20px;
    border-radius: 8px;
    margin: 24px 24px 24px;
}

.mini-chart span {
    display: block;
    width: 18px;
    max-width: 100%;
    justify-self: center;
    background: #aed1cb;
    border-radius: 999px 999px 2px 2px;
}

.chart-select {
    width: 120px;
}

.span-3 { grid-column: span 3; }
.span-4 { grid-column: span 4; }
.span-5 { grid-column: span 5; }
.span-6 { grid-column: span 6; }
.span-7 { grid-column: span 7; }
.span-8 { grid-column: span 8; }
.span-12 { grid-column: span 12; }

.avatar {
    width: 34px;
    height: 34px;
    object-fit: cover;
    border-radius: 50%;
    background: var(--bs-tertiary-bg);
}

.ad-thumb {
    width: 88px;
    height: 54px;
    object-fit: cover;
    border-radius: 8px;
}

.image-import {
    display: grid;
    gap: 8px;
    color: var(--edm-text-soft);
    font-size: .82rem;
}

.image-import span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #10201f;
    font-weight: 600;
}

[data-bs-theme="dark"] .image-import span {
    color: #edf2f7;
}

.image-size {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    width: max-content;
    max-width: 100%;
    padding: 5px 10px;
    color: var(--edm-text-soft);
    background: rgba(255,255,255,.7);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
}

.image-size.too-large {
    color: #fff;
    background: #d93636;
    border-color: #d93636;
}

[data-bs-theme="dark"] .image-size,
[data-bs-theme="dark"] .date-input,
[data-bs-theme="dark"] .date-trigger,
[data-bs-theme="dark"] .metric-card,
[data-bs-theme="dark"] .mode-switch span {
    color: #e8eef4;
    background: #1b2228;
    border-color: #35424d;
}

[data-bs-theme="dark"] .image-import span,
[data-bs-theme="dark"] .section-label {
    color: #e8eef4;
}

.ad-preview-card {
    grid-column: span 3;
    align-self: stretch;
}

.ad-preview {
    display: grid;
    place-items: center;
    flex: 1 1 auto;
    min-height: 0;
    margin: 24px;
    padding: 0;
    background: #fff;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    overflow: hidden;
}

[data-bs-theme="dark"] .ad-preview {
    background: rgba(18, 24, 29, .72);
    border-color: #35424d;
}

.ad-preview img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    aspect-ratio: 9 / 16;
    object-fit: contain;
    border-radius: 0;
}

#adAssignmentForm.ad-upload-locked {
    position: relative;
}

#adAssignmentForm.ad-upload-locked > * {
    pointer-events: none;
}

#adAssignmentForm.ad-upload-locked::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 5;
    background: rgba(255, 255, 255, .58);
    border-radius: inherit;
}

#adAssignmentForm.ad-upload-locked::before {
    content: attr(data-busy-label);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 6;
    transform: translate(-50%, -50%);
    max-width: calc(100% - 48px);
    padding: 10px 14px;
    color: #10201f;
    font-size: .86rem;
    font-weight: 700;
    text-align: center;
    background: #ffffff;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(23, 43, 54, .16);
}

[data-bs-theme="dark"] #adAssignmentForm.ad-upload-locked::after {
    background: rgba(12, 16, 20, .58);
}

[data-bs-theme="dark"] #adAssignmentForm.ad-upload-locked::before {
    color: #e8eef4;
    background: #1b2228;
    border-color: #35424d;
}

.ads-layout .customer-ad-list-card {
    grid-column: span 5;
}

.designer-customer-card {
    grid-column: 1 / span 5;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.designer-design-list-card {
    grid-column: 1 / span 5;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.designer-form-card {
    grid-column: 6 / span 6;
    grid-row: 1 / span 2;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

.designer-form-card.bento.vstack {
    gap: 12px !important;
}

.designer-form-card.bento.vstack > :not(.bento-title) {
    box-sizing: border-box;
    width: calc(100% - 32px);
    margin-left: 16px;
    margin-right: 16px;
}

.designer-form-card.bento.vstack > :last-child {
    margin-bottom: 16px;
}

.designer-stage-card {
    grid-column: 12 / span 5;
    grid-row: 1 / span 2;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.designer-layout .bento-title {
    min-height: 82px;
    padding: 20px 24px 16px;
}

.designer-customer-list,
.designer-design-list {
    display: grid;
    align-content: start;
    flex: 1 1 auto;
    gap: 8px;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    margin: 18px;
    padding-right: 4px;
}

.designer-customer-item,
.designer-design-item {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 9px 10px 9px 18px;
    color: #10201f;
    text-decoration: none;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    overflow: hidden;
}

.designer-customer-item::before,
.designer-design-item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: transparent;
}

.designer-customer-item img,
.designer-design-item img {
    width: 42px;
    height: 42px;
    object-fit: cover;
    border-radius: 8px;
}

.designer-customer-item img {
    border-radius: 50%;
}

.designer-design-item i {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 12%, transparent);
    border-radius: 8px;
}

.designer-customer-item span,
.designer-design-item span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.designer-customer-item strong,
.designer-customer-item small,
.designer-design-item strong,
.designer-design-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.designer-customer-item strong,
.designer-design-item strong {
    font-size: .8rem;
    font-weight: 660;
}

.designer-customer-item small,
.designer-design-item small {
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.designer-customer-item:hover,
.designer-customer-item.active,
.designer-design-item:hover,
.designer-design-item.active {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
    border-color: color-mix(in srgb, var(--edm-primary) 24%, var(--edm-border));
    outline: none;
}

.designer-customer-item:hover::before,
.designer-customer-item.active::before,
.designer-design-item:hover::before,
.designer-design-item.active::before {
    background: var(--edm-primary);
}

.designer-design-item:hover i,
.designer-design-item.active i {
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 12%, transparent);
}

.designer-meta-grid,
.designer-color-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.designer-form-card .form-section {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    padding: 12px;
}

.designer-form-card label,
.designer-form-card .form-control,
.designer-form-card .form-select {
    min-width: 0;
}

.designer-meta-grid label:first-child {
    grid-column: span 2;
}

.designer-meta-grid label:nth-child(3),
.designer-meta-grid label:nth-child(4) {
    grid-column: 1 / -1;
}

.designer-logo-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, auto) auto;
    align-items: end;
    gap: 12px;
}

.designer-logo-row .image-import {
    min-width: 0;
}

.designer-logo-check {
    display: inline-flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 8px !important;
    min-height: 38px;
    min-width: 0;
    color: var(--edm-text-soft);
    font-size: .78rem;
    white-space: nowrap;
}

.designer-logo-preview {
    width: 46px;
    height: 46px;
    object-fit: cover;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    background: #fff;
}

.designer-button-row,
.designer-stage-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.designer-button-row {
    justify-content: flex-end;
    margin: 0 24px 24px;
}

.designer-stage-actions form {
    margin: 0;
}

.designer-stage-wrap {
    display: grid;
    place-items: center;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 10px;
}

.designer-stage-button {
    appearance: none;
    display: grid;
    place-items: center;
    width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: zoom-in;
}

.designer-stage-button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--edm-primary) 45%, transparent);
    outline-offset: 5px;
    border-radius: 10px;
}

.designer-stage {
    position: relative;
    width: min(100%, 39vh, 405px);
    aspect-ratio: 9 / 16;
    overflow: hidden;
    color: #10201f;
    background:
        linear-gradient(155deg, color-mix(in srgb, var(--designer-color-1) 85%, #000) 0%, var(--designer-color-1) 35%, var(--designer-color-3) 100%);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 22px 54px rgba(23, 43, 54, .16);
}

.designer-stage::after {
    content: attr(data-size);
    position: absolute;
    right: 10px;
    bottom: 8px;
    padding: 4px 7px;
    color: rgba(255,255,255,.82);
    background: rgba(0,0,0,.28);
    border-radius: 6px;
    font-size: .62rem;
    font-weight: 700;
}

.designer-stage > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.designer-image-modal .modal-dialog {
    width: auto;
    max-width: calc(100vw - 32px);
    margin: 16px auto;
}

.designer-image-modal .modal-content {
    height: calc(100vh - 32px);
    color: #10201f;
    background: #fff;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 26px 80px rgba(0,0,0,.26);
    overflow: hidden;
}

.designer-image-modal .modal-header {
    min-height: 72px;
    padding: 18px 22px 14px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 12%, transparent) 0%, rgba(240,247,251,.88) 34%, #fff 100%);
    border-bottom: 1px solid var(--edm-border);
}

.designer-image-modal .modal-title {
    margin: 0;
    font-size: .98rem;
    font-weight: 720;
}

.designer-image-modal .modal-subtitle {
    margin: 2px 0 0;
    color: var(--edm-text-soft);
    font-size: .72rem;
    font-weight: 700;
}

.designer-image-modal .modal-body {
    height: calc(100vh - 105px);
    padding: 18px;
    overflow: auto;
    background: #10171d;
}

.designer-image-full {
    display: block;
    width: var(--designer-native-width);
    height: var(--designer-native-height);
    max-width: none;
    object-fit: contain;
    margin: 0 auto;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 18px 54px rgba(0,0,0,.28);
}

.designer-placeholder {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 18px;
    height: 100%;
    padding: 54px 38px;
    color: #10201f;
    text-align: center;
    background:
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.74)),
        radial-gradient(circle at 18% 20%, var(--designer-color-2), transparent 34%),
        var(--designer-color-1);
}

.designer-placeholder img {
    max-width: 62%;
    max-height: 120px;
    object-fit: contain;
}

.designer-placeholder strong {
    font-size: 1.64rem;
    line-height: 1.05;
}

.designer-placeholder span {
    color: #43515a;
    font-size: .92rem;
    line-height: 1.4;
}

.designer-ad-form {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(120px, .7fr)) auto;
    align-items: end;
    gap: 10px;
    margin: 0 18px 18px;
    padding: 12px;
    background: rgba(255,255,255,.58);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
}

.designer-ad-form label {
    display: grid;
    gap: 5px;
    color: var(--edm-text-soft);
    font-size: .76rem;
    font-weight: 700;
}

[data-bs-theme="dark"] .designer-customer-item,
[data-bs-theme="dark"] .designer-design-item,
[data-bs-theme="dark"] .designer-ad-form {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .designer-customer-item:hover,
[data-bs-theme="dark"] .designer-customer-item.active,
[data-bs-theme="dark"] .designer-design-item:hover,
[data-bs-theme="dark"] .designer-design-item.active {
    color: #e8eef4;
    background: rgba(42, 65, 92, .72);
    border-color: color-mix(in srgb, var(--edm-primary) 42%, #35424d);
}

[data-bs-theme="dark"] .designer-stage {
    color: #e8eef4;
    background:
        linear-gradient(155deg, color-mix(in srgb, var(--designer-color-1) 34%, #071018) 0%, #101820 46%, color-mix(in srgb, var(--designer-color-3) 24%, #101820) 100%);
    border-color: #35424d;
    box-shadow: 0 22px 54px rgba(0,0,0,.34);
}

[data-bs-theme="dark"] .designer-placeholder {
    color: #f3f7fb;
    background:
        linear-gradient(180deg, rgba(12,18,24,.78), rgba(12,18,24,.9)),
        radial-gradient(circle at 18% 20%, color-mix(in srgb, var(--designer-color-2) 22%, transparent), transparent 36%),
        color-mix(in srgb, var(--designer-color-1) 32%, #0d141b);
}

[data-bs-theme="dark"] .designer-placeholder span {
    color: rgba(232, 238, 244, .72);
}

[data-bs-theme="dark"] .designer-image-modal .modal-content {
    color: #e8eef4;
    background: #15191c;
    border-color: #35424d;
}

[data-bs-theme="dark"] .designer-image-modal .modal-header {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 18%, transparent) 0%, #1a2229 34%, #15191c 100%);
    border-color: #35424d;
}

.customer-ad-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    margin: 18px;
    padding-right: 4px;
}

.customer-ad-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 66px;
    padding: 9px 10px;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    cursor: pointer;
}

.customer-ad-item.no-thumb {
    grid-template-columns: minmax(0, 1fr) auto;
}

.customer-ad-item:hover,
.customer-ad-item:focus-visible,
.customer-ad-item.active {
    border-color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 10%, #ffffff);
    outline: none;
}

.customer-ad-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.customer-ad-copy strong,
.customer-ad-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-ad-copy strong {
    font-size: .82rem;
    font-weight: 650;
}

.customer-ad-copy small {
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.customer-ad-copy .badge {
    width: max-content;
}

.customer-ad-actions {
    display: flex;
    gap: 5px;
}

.customer-ad-actions .btn {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
}

.empty-note {
    margin: 0;
    color: var(--edm-text-soft);
    font-size: .82rem;
}

.ad-notes-section textarea.form-control {
    min-height: 152px;
}

[data-bs-theme="dark"] .customer-ad-item {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .customer-ad-item:hover,
[data-bs-theme="dark"] .customer-ad-item:focus-visible,
[data-bs-theme="dark"] .customer-ad-item.active {
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

.date-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.ad-duration-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: max-content;
    max-width: 100%;
    margin: 0 0 12px;
    padding: 4px;
    background: rgba(255,255,255,.78);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
}

.ad-duration-toggle button {
    min-width: 86px;
    min-height: 32px;
    padding: 6px 12px;
    color: var(--edm-text-soft);
    font: inherit;
    font-size: .78rem;
    font-weight: 700;
    background: transparent;
    border: 0;
    border-radius: 6px;
}

.ad-duration-toggle button.active {
    color: #fff;
    background: var(--edm-primary-fill);
    box-shadow: 0 4px 10px rgba(36, 87, 255, .18);
}

[data-bs-theme="dark"] .ad-duration-toggle {
    background: #1b2228;
    border-color: #35424d;
}

.date-grid label {
    display: grid;
    gap: 5px;
    color: var(--edm-text-soft);
    font-size: .76rem;
    font-weight: 700;
}

.date-input {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 3px rgba(23, 43, 54, .035);
}

.date-input .form-control {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.date-input input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    opacity: 0;
    -webkit-appearance: none;
}

.date-input input[type="date"] {
    appearance: textfield;
}

.date-trigger {
    display: grid;
    place-items: center;
    color: var(--edm-primary);
    background: #fff;
    border: 0;
    border-left: 1px solid var(--edm-border);
}

.date-trigger i {
    font-size: 1rem;
}

.customer-avatar-preview {
    width: 54px;
    height: 54px;
    object-fit: cover;
    border: 1px solid var(--edm-border);
    border-radius: 50%;
    background: #fff;
}

.form-section {
    padding: 14px;
    background: rgba(255,255,255,.58);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .055), 0 1px 4px rgba(23, 43, 54, .03);
}

[data-bs-theme="dark"] .form-section {
    background: rgba(18, 24, 29, .72);
}

.section-label {
    margin-bottom: 10px;
    color: #10201f;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.form-section label {
    display: grid;
    gap: 5px;
    color: var(--edm-text-soft);
    font-size: .76rem;
    font-weight: 600;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.form-grid label:first-child:nth-last-child(3),
.form-grid label:first-child:nth-last-child(3) ~ label {
    grid-column: span 1;
}

.customer-edit-card .form-section {
    padding: 9px 10px;
}

.customer-edit-card .customer-flat-section {
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.customer-edit-card .customer-flat-section + .customer-flat-section {
    margin-top: -2px;
}

.customer-edit-card .section-label {
    margin-bottom: 6px;
    font-size: .7rem;
}

.customer-edit-card .form-grid {
    gap: 8px;
}

.customer-edit-card .form-section label {
    gap: 3px;
    font-size: .7rem;
}

.customer-edit-card .form-section .form-control,
.customer-edit-card .form-section .form-select {
    min-height: 32px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: .82rem;
}

.customer-edit-card .form-section textarea.form-control {
    min-height: 52px;
}

.customer-edit-card .customer-notes-section textarea.form-control {
    min-height: 46px;
}

.customer-edit-card .btn-primary {
    min-height: 34px;
}

.address-grid {
    grid-template-columns: 2fr .7fr .8fr 1.5fr;
}

.address-grid label:nth-child(5),
.address-grid label:nth-child(6) {
    grid-column: span 2;
}

.title-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 112px;
    gap: 12px;
}

.title-line .form-select {
    min-width: 0;
}

.avatar-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 128px;
    align-items: center;
    gap: 14px;
}

.avatar-section > div {
    min-width: 0;
}

.avatar-file-row {
    max-width: 320px;
}

.avatar-crop-panel {
    position: relative;
    display: grid;
    grid-template-columns: 96px 18px;
    gap: 8px;
    align-items: stretch;
    justify-self: end;
    width: 122px;
    height: 96px;
}

.avatar-cropper {
    position: relative;
    width: 96px;
    height: 96px;
    overflow: hidden;
    background: #eef4f6;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    cursor: grab;
    user-select: none;
    touch-action: none;
    grid-row: 1;
    grid-column: 1;
}

.avatar-cropper:active {
    cursor: grabbing;
}

.avatar-cropper img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: 100%;
    min-width: 100%;
    max-width: none;
    object-fit: contain;
    display: block;
    transform: translate(-50%, -50%);
    transform-origin: center;
    will-change: transform;
}

.crop-circle {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 3px solid var(--edm-primary);
    border-radius: 50%;
    box-shadow: 0 0 0 999px rgba(16, 32, 31, .18), 0 4px 14px rgba(16, 32, 31, .18);
    pointer-events: none;
}

.user-active-toggle {
    cursor: pointer;
}

.user-active-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.user-active-toggle span {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 8px 11px;
    color: #10201f;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.user-active-toggle i {
    width: 7px;
    height: 22px;
    background: #c43d3d;
    border-radius: 999px;
}

.user-active-toggle input:checked + span i {
    background: #19985f;
}

.user-active-toggle strong {
    font-size: .82rem;
    font-weight: 680;
}

.user-active-toggle strong::before {
    content: attr(data-inactive);
}

.user-active-toggle input:checked + span strong::before {
    content: attr(data-active);
}

.user-active-toggle input:focus-visible + span {
    box-shadow: 0 0 0 .14rem color-mix(in srgb, var(--edm-primary) 20%, transparent), 0 6px 16px rgba(23, 43, 54, .045);
}

.user-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--edm-text-soft);
    font-size: .78rem;
    font-weight: 650;
}

.user-status::before {
    content: "";
    width: 6px;
    height: 18px;
    border-radius: 999px;
    background: #c43d3d;
}

.user-status.is-active::before {
    background: #19985f;
}

[data-bs-theme="dark"] .user-active-toggle span {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

.zoom-slider {
    align-self: center;
    justify-self: center;
    width: 16px;
    height: 96px;
    margin: 0;
    writing-mode: vertical-lr;
    direction: rtl;
    transform: none;
    padding: 0;
    appearance: none;
    background: transparent;
}

.zoom-slider::-webkit-slider-runnable-track {
    width: 8px;
    border-radius: 999px;
    background: #e6ebf0;
}

.zoom-slider::-webkit-slider-thumb {
    appearance: none;
    width: 18px;
    height: 18px;
    margin-left: -5px;
    border: 0;
    border-radius: 50%;
    background: var(--edm-primary);
    box-shadow: 0 2px 7px rgba(23, 43, 54, .18);
}

.zoom-slider::-moz-range-track {
    width: 8px;
    border-radius: 999px;
    background: #e6ebf0;
}

.zoom-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border: 0;
    border-radius: 50%;
    background: var(--edm-primary);
    box-shadow: 0 2px 7px rgba(23, 43, 54, .18);
}

.form-section .form-control {
    min-height: 38px;
    font-size: .9rem;
}

.form-section textarea.form-control {
    min-height: 88px;
}

.settings-form .form-section {
    display: grid;
    gap: 14px;
}

.settings-form {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    justify-content: stretch;
    align-items: start;
    align-content: start;
    grid-template-rows: none;
    grid-auto-rows: auto;
    height: calc(100vh - 128px);
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 4px;
}

.settings-form .span-4 {
    grid-column: span 4;
    min-height: 0;
}

.settings-form > .bento {
    min-height: 0;
    height: auto;
    overflow: visible;
}

.settings-form .settings-system-card {
    grid-column: span 8;
}

.settings-appearance-card.bento.vstack {
    gap: 10px !important;
}

.settings-appearance-card .bento-title {
    min-height: 78px;
    padding-top: 18px;
    padding-bottom: 14px;
}

.settings-appearance-card.bento.vstack > :not(.bento-title) {
    width: calc(100% - 40px);
    margin-left: 20px;
    margin-right: 20px;
}

.settings-appearance-card.bento.vstack > :last-child {
    margin-bottom: 20px;
}

.settings-appearance-card .form-section {
    gap: 10px;
    padding: 11px 12px;
}

.settings-app-name-inline {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    color: var(--edm-text-soft);
    font-size: .78rem;
    font-weight: 700;
}

.settings-app-name-inline .form-control {
    min-height: 36px;
}

.settings-appearance-card .section-label {
    margin-bottom: 6px;
}

.settings-appearance-card .form-section .form-control,
.settings-appearance-card .form-section .form-select {
    min-height: 34px;
}

.settings-appearance-card .mode-switch span {
    min-height: 34px;
}

.settings-appearance-card .settings-mode-icons {
    grid-template-columns: repeat(3, 42px);
    justify-content: start;
    gap: 8px;
}

.settings-appearance-card .settings-mode-icons span {
    width: 42px;
    min-height: 38px;
    font-size: 1rem;
}

.settings-appearance-card .color-presets {
    gap: 6px;
}

.settings-appearance-card .color-presets button {
    width: 27px;
    height: 27px;
}

.settings-appearance-card .settings-two-col {
    gap: 10px;
    margin-top: 8px !important;
}

.settings-appearance-card .settings-two-col label {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
}

.settings-appearance-card .settings-two-col .form-control-color {
    width: 54px;
    height: 42px;
}

.settings-appearance-card .range-label {
    margin-top: 6px !important;
}

.settings-card-style-row {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: end;
}

.settings-card-style-row label:first-child {
    min-width: 92px;
}

.settings-card-style-row label:first-child .form-control-color {
    width: 58px;
    height: 42px;
}

.settings-card-style-row .range-label {
    margin-top: 0 !important;
}

.mode-switch {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.mode-switch label {
    cursor: pointer;
}

.mode-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.mode-switch span {
    display: grid;
    place-items: center;
    min-height: 38px;
    color: #44515a;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    font-weight: 650;
}

.mode-switch input:checked + span {
    color: #fff;
    background: var(--edm-primary-fill);
    border-color: var(--edm-primary);
}

.color-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.color-presets button {
    width: 32px;
    height: 32px;
    padding: 0;
    background: var(--swatch);
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--edm-border), 0 4px 10px rgba(23, 43, 54, .1);
}

.settings-two-col {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.range-label {
    margin-top: 4px;
}

.settings-preview-card,
.font-preview {
    margin: 0 24px 24px;
    overflow: hidden;
    background: rgba(255,255,255,.58);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .055), 0 1px 4px rgba(23, 43, 54, .03);
}

[data-bs-theme="dark"] .settings-preview-card,
[data-bs-theme="dark"] .font-preview {
    background: rgba(18, 24, 29, .72);
}

.settings-preview-head {
    padding: 14px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 12%, transparent), transparent);
    border-bottom: 1px solid var(--edm-border);
    font-weight: 750;
}

.settings-preview-body,
.font-preview {
    display: grid;
    gap: 4px;
    padding: 16px;
}

.settings-preview-body span,
.font-preview span {
    color: var(--edm-text-soft);
    font-size: .78rem;
}

.settings-system-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(180px, .65fr);
    align-items: start;
}

.settings-system-grid > label {
    min-width: 0;
}

.settings-system-grid .btn,
.settings-system-grid .form-control,
.settings-system-grid .form-select {
    max-width: 100%;
}

.settings-save {
    width: max-content;
    margin: 0 24px 24px;
}

@media (min-width: 1200px) and (min-height: 980px) {
    .settings-form {
        align-items: stretch;
        align-content: stretch;
        grid-template-rows: auto minmax(0, 1fr);
        overflow: hidden;
    }

    .settings-form > .bento {
        height: 100%;
        overflow: hidden;
    }

    .settings-system-card,
    .settings-form > .bento:nth-last-child(1) {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }
}

.backup-update-actions {
    display: grid;
    gap: 10px;
    margin: 0 24px 24px;
}

.backup-update-actions form,
.backup-update-actions .btn {
    width: 100%;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-border-color: transparent;
    border-collapse: separate;
    border-spacing: 0 8px;
}

.table thead th {
    color: #5f7380;
    font-size: .62rem;
    text-transform: uppercase;
    font-weight: 700;
    padding: 8px 10px;
}

[data-bs-theme="dark"] .table thead th {
    color: #8ea2b2;
}

[data-bs-theme="dark"] .article-list-head {
    color: #8ea2b2;
    background: var(--edm-surface);
}

[data-bs-theme="dark"] .article-row {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-group-item {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-assignment-block {
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-assignment-choice {
    background: rgba(16, 22, 28, .7);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-assignment-selected {
    background: rgba(16, 22, 28, .84);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-assignment-pill {
    color: #e8eef4;
    border-bottom-color: #35424d;
}

[data-bs-theme="dark"] .article-assignment-picker-row {
    color: #e8eef4;
    background: rgba(16, 22, 28, .84);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-stat-line {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .article-row:hover,
[data-bs-theme="dark"] .article-row:focus-visible,
[data-bs-theme="dark"] .article-row.is-active {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

.table td {
    font-size: .78rem;
    vertical-align: middle;
}

.customer-row,
.user-row {
    cursor: pointer;
}

.customer-row td,
.user-row td,
.soft-row td {
    background: rgba(255,255,255,.76);
    border-top: 1px solid var(--edm-border);
    border-bottom: 1px solid var(--edm-border);
    padding: 7px 10px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

[data-bs-theme="dark"] .customer-row td,
[data-bs-theme="dark"] .user-row td,
[data-bs-theme="dark"] .soft-row td {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-top-color: #35424d;
    border-bottom-color: #35424d;
}

[data-bs-theme="dark"] .customer-row td:first-child,
[data-bs-theme="dark"] .user-row td:first-child {
    border-left-color: #35424d;
}

[data-bs-theme="dark"] .customer-row td:last-child,
[data-bs-theme="dark"] .user-row td:last-child {
    border-right-color: #35424d;
}

.customer-row td:first-child,
.user-row td:first-child,
.soft-row td:first-child {
    border-left: 1px solid var(--edm-border);
    border-radius: 8px 0 0 8px;
}

.customer-row td:last-child,
.user-row td:last-child,
.soft-row td:last-child {
    border-right: 1px solid var(--edm-border);
    border-radius: 0 8px 8px 0;
}

.customer-row:hover td,
.user-row:hover td {
    background: color-mix(in srgb, var(--edm-primary) 4%, #fff);
}

.customer-row.is-active td,
.user-row.is-active td {
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
}

[data-bs-theme="dark"] .customer-row:hover td,
[data-bs-theme="dark"] .user-row:hover td {
    background: color-mix(in srgb, var(--edm-primary) 14%, #171e24);
}

[data-bs-theme="dark"] .customer-row.is-active td,
[data-bs-theme="dark"] .user-row.is-active td {
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
}

.customer-row.is-active td:first-child,
.user-row.is-active td:first-child {
    box-shadow: inset 4px 0 0 var(--edm-primary);
    border-left-color: var(--edm-primary);
}

.customer-row-actions-cell {
    width: 90px;
    text-align: right;
    white-space: nowrap;
}

.customer-row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    white-space: nowrap;
}

.customer-row-actions form {
    display: inline-flex;
    margin: 0;
}

.customer-row-actions .btn {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
}

.list-search {
    position: relative;
    margin: 24px 24px 10px;
}

.list-search i {
    position: absolute;
    left: 13px;
    top: 50%;
    color: var(--edm-text-soft);
    transform: translateY(-50%);
    pointer-events: none;
}

.list-search .form-control {
    padding-left: 38px;
}

.customer-picker-field {
    display: grid;
    gap: 5px;
}

.customer-picker-label {
    color: var(--edm-text-soft);
    font-size: .76rem;
    font-weight: 600;
}

.customer-picker-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 54px;
    padding: 10px 12px;
    color: #10201f;
    text-align: left;
    background: rgba(255,255,255,.86);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(23, 43, 54, .035);
    font-size: .9rem;
}

.customer-picker-button span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.customer-picker-button strong,
.customer-picker-item strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 620;
}

.customer-picker-button small,
.customer-picker-item small,
.customer-picker-gln {
    overflow: hidden;
    color: var(--edm-text-soft);
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.selected-customer-address {
    display: grid;
    gap: 2px;
    margin-top: 8px;
    padding: 8px 10px;
    color: #10201f;
    background: rgba(255,255,255,.52);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    font-size: .8rem;
    line-height: 1.25;
}

.selected-customer-address span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-picker-modal .modal-content,
.edm-site-picker-modal .modal-content {
    background: var(--edm-card-bg);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 22px 70px rgba(23, 43, 54, .18);
    overflow: hidden;
}

.customer-picker-modal .modal-header,
.edm-site-picker-modal .modal-header {
    align-items: flex-start;
    min-height: 86px;
    padding: 22px 24px 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 12%, transparent) 0%, rgba(240,247,251,.78) 24%, rgba(255,255,255,.88) 58%, rgba(255,255,255,.74) 100%);
    border-bottom: 1px solid var(--edm-border);
}

.customer-picker-modal .modal-title,
.edm-site-picker-modal .modal-title {
    margin: 0;
    font-size: .98rem;
    font-weight: 680;
}

.customer-picker-modal .modal-subtitle,
.edm-site-picker-modal .modal-subtitle {
    margin: 2px 0 0;
    color: var(--edm-text-soft);
    font-size: .74rem;
    font-weight: 600;
}

.customer-picker-search {
    position: relative;
    margin-bottom: 12px;
}

.customer-picker-search i {
    position: absolute;
    left: 13px;
    top: 50%;
    color: var(--edm-text-soft);
    transform: translateY(-50%);
    pointer-events: none;
}

.customer-picker-search .form-control {
    padding-left: 38px;
}

.customer-picker-list {
    display: grid;
    gap: 8px;
    max-height: min(58vh, 520px);
    overflow-y: auto;
    padding-right: 4px;
}

.customer-picker-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 9px 12px;
    color: #10201f;
    text-decoration: none;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    cursor: pointer;
}

.customer-picker-item:hover,
.customer-picker-item.active {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
    border-color: color-mix(in srgb, var(--edm-primary) 45%, var(--edm-border));
}

.customer-picker-item.active {
    box-shadow: inset 5px 0 0 var(--edm-primary), 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.landfill-source-button {
    width: 100%;
    justify-content: center;
    min-height: 38px;
}

.edm-site-picker-search {
    margin: 0 0 12px;
}

.edm-site-picker-list {
    display: grid;
    gap: 8px;
    max-height: min(58vh, 520px);
    overflow-y: auto;
    padding-right: 4px;
}

.edm-site-picker-item {
    appearance: none;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 58px;
    padding: 9px 12px 9px 16px;
    color: #10201f;
    font: inherit;
    text-align: left;
    background: rgba(255,255,255,.9);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    cursor: pointer;
}

.edm-site-picker-item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: transparent;
}

.edm-site-picker-item:hover,
.edm-site-picker-item.active,
.edm-site-picker-item:focus-visible {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 8%, #fff);
    border-color: color-mix(in srgb, var(--edm-primary) 42%, var(--edm-border));
}

.edm-site-picker-item:hover::before,
.edm-site-picker-item.active::before,
.edm-site-picker-item:focus-visible::before {
    background: var(--edm-primary);
}

.edm-site-picker-item:focus-visible {
    outline: none;
}

.edm-site-picker-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.edm-site-picker-copy strong,
.edm-site-picker-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edm-site-picker-copy strong {
    font-size: .86rem;
    font-weight: 680;
}

.edm-site-picker-copy small {
    color: var(--edm-text-soft);
    font-size: .72rem;
}

.edm-site-picker-gln {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 116px;
    min-height: 34px;
    padding: 6px 10px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 9%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--edm-primary) 20%, var(--edm-border));
    border-radius: 8px;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.customer-picker-avatar {
    width: 38px;
    height: 38px;
    object-fit: cover;
    border-radius: 50%;
}

.customer-picker-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.customer-picker-gln:empty {
    display: none;
}

.customer-picker-empty {
    margin: 14px 0 0;
    color: var(--edm-text-soft);
    font-size: .82rem;
}

.article-edit-modal .modal-content,
.landfill-edit-modal .modal-content {
    color: #10201f;
    background: #fff;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 22px 70px rgba(23, 43, 54, .22);
    overflow: hidden;
}

.article-edit-modal .modal-header,
.landfill-edit-modal .modal-header {
    align-items: flex-start;
    min-height: 86px;
    padding: 22px 24px 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 12%, transparent) 0%, rgba(240,247,251,.9) 24%, #fff 62%, #fff 100%);
    border-bottom: 1px solid var(--edm-border);
}

.article-edit-modal .modal-title,
.landfill-edit-modal .modal-title {
    margin: 0;
    font-size: .98rem;
    font-weight: 680;
}

.article-edit-modal .modal-subtitle,
.landfill-edit-modal .modal-subtitle {
    margin: 2px 0 0;
    color: var(--edm-text-soft);
    font-size: .74rem;
    font-weight: 600;
}

.article-edit-modal .modal-body,
.article-edit-modal .modal-footer,
.landfill-edit-modal .modal-body,
.landfill-edit-modal .modal-footer {
    background: #fff;
}

.article-edit-modal .form-section,
.landfill-edit-modal .form-section {
    display: grid;
    gap: 12px;
    background: #fff;
}

[data-bs-theme="dark"] .article-edit-modal .modal-content,
[data-bs-theme="dark"] .article-edit-modal .modal-body,
[data-bs-theme="dark"] .article-edit-modal .modal-footer,
[data-bs-theme="dark"] .article-edit-modal .form-section,
[data-bs-theme="dark"] .landfill-edit-modal .modal-content,
[data-bs-theme="dark"] .landfill-edit-modal .modal-body,
[data-bs-theme="dark"] .landfill-edit-modal .modal-footer,
[data-bs-theme="dark"] .landfill-edit-modal .form-section {
    color: #e8eef4;
    background: #15191c;
}

[data-bs-theme="dark"] .article-edit-modal .modal-header,
[data-bs-theme="dark"] .landfill-edit-modal .modal-header {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 18%, transparent) 0%, #1a2229 34%, #15191c 100%);
    border-color: #35424d;
}

.delete-confirm-modal .modal-content {
    color: #10201f;
    background: #fff;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 22px 70px rgba(23, 43, 54, .22);
    overflow: hidden;
}

.delete-confirm-modal .modal-header {
    align-items: flex-start;
    min-height: 86px;
    padding: 22px 24px 18px;
    background:
        linear-gradient(90deg, rgba(220, 53, 69, .12) 0%, rgba(240,247,251,.9) 24%, #fff 62%, #fff 100%);
    border-bottom: 1px solid var(--edm-border);
}

.delete-confirm-modal .modal-title {
    margin: 0;
    font-size: .98rem;
    font-weight: 680;
}

.delete-confirm-modal .modal-subtitle {
    margin: 2px 0 0;
    color: var(--edm-text-soft);
    font-size: .74rem;
    font-weight: 600;
}

.delete-confirm-modal .modal-body {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 22px 24px;
    background: #fff;
}

.delete-confirm-modal .modal-body p {
    margin: 0;
    font-size: .92rem;
    font-weight: 560;
}

.delete-confirm-modal .modal-footer {
    padding: 16px 24px 22px;
    background: #fff;
    border-top: 1px solid var(--edm-border);
}

.delete-confirm-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: #dc3545;
    background: rgba(220, 53, 69, .1);
    border: 1px solid rgba(220, 53, 69, .22);
    border-radius: 8px;
}

.delete-confirm-modal .btn {
    min-width: 124px;
}

.completion-modal .modal-content {
    color: #10201f;
    background: #fff;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 22px 70px rgba(23, 43, 54, .22);
    overflow: hidden;
}

.completion-modal .modal-header {
    align-items: flex-start;
    min-height: 86px;
    padding: 22px 24px 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 14%, transparent) 0%, rgba(240,247,251,.9) 24%, #fff 62%, #fff 100%);
    border-bottom: 1px solid var(--edm-border);
}

.completion-modal .modal-title {
    margin: 0;
    font-size: .98rem;
    font-weight: 680;
}

.completion-modal .modal-subtitle {
    margin: 2px 0 0;
    color: var(--edm-text-soft);
    font-size: .74rem;
    font-weight: 600;
}

.completion-modal .modal-body {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 22px 24px;
}

.completion-modal .modal-body p {
    margin: 0;
    font-size: .92rem;
    font-weight: 560;
}

.completion-modal .modal-footer {
    padding: 16px 24px 22px;
    background: #fff;
    border-top: 1px solid var(--edm-border);
}

.completion-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 11%, transparent);
    border-radius: 50%;
}

.completion-icon i {
    font-size: 1.25rem;
}

[data-bs-theme="dark"] .delete-confirm-modal .modal-content,
[data-bs-theme="dark"] .delete-confirm-modal .modal-body,
[data-bs-theme="dark"] .delete-confirm-modal .modal-footer {
    color: #e8eef4;
    background: #15191c;
}

[data-bs-theme="dark"] .delete-confirm-modal .modal-header {
    background:
        linear-gradient(90deg, rgba(220, 53, 69, .18) 0%, #1a2229 34%, #15191c 100%);
    border-color: #35424d;
}

[data-bs-theme="dark"] .completion-modal .modal-content,
[data-bs-theme="dark"] .completion-modal .modal-body,
[data-bs-theme="dark"] .completion-modal .modal-footer {
    color: #e8eef4;
    background: #15191c;
}

[data-bs-theme="dark"] .completion-modal .modal-header {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 20%, transparent) 0%, #1a2229 34%, #15191c 100%);
    border-color: #35424d;
}

[data-bs-theme="dark"] .customer-picker-button,
[data-bs-theme="dark"] .customer-picker-item,
[data-bs-theme="dark"] .selected-customer-address {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .customer-picker-modal .modal-content,
[data-bs-theme="dark"] .edm-site-picker-modal .modal-content {
    background: var(--edm-card-bg);
    box-shadow: 0 24px 80px rgba(0,0,0,.36);
}

[data-bs-theme="dark"] .customer-picker-modal .modal-header,
[data-bs-theme="dark"] .edm-site-picker-modal .modal-header {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--edm-primary) 18%, transparent) 0%, rgba(26,34,41,.9) 34%, rgba(21,25,28,.84) 100%);
}

[data-bs-theme="dark"] .customer-picker-item:hover,
[data-bs-theme="dark"] .customer-picker-item.active {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

[data-bs-theme="dark"] .edm-site-picker-item {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .edm-site-picker-item:hover,
[data-bs-theme="dark"] .edm-site-picker-item.active,
[data-bs-theme="dark"] .edm-site-picker-item:focus-visible {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

[data-bs-theme="dark"] .edm-site-picker-copy small {
    color: rgba(232, 238, 244, .72);
}

[data-bs-theme="dark"] .edm-site-picker-gln {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

.document-list {
    display: grid;
    gap: 8px;
}

.landfill-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding-right: 4px;
}

.landfill-list-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 58px;
    background: rgba(255,255,255,.86);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    overflow: hidden;
}

.landfill-list-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: transparent;
    z-index: 1;
}

.landfill-list-row:hover,
.landfill-list-row:has(.landfill-list-item.active) {
    background: color-mix(in srgb, var(--edm-primary) 7%, #ffffff);
    border-color: color-mix(in srgb, var(--edm-primary) 24%, var(--edm-border));
}

.landfill-list-row:hover::before,
.landfill-list-row:has(.landfill-list-item.active)::before {
    background: var(--edm-primary);
}

.landfill-list-item {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 58px;
    padding: 10px 12px 10px 20px;
    color: #10201f;
    text-decoration: none;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
}

.landfill-list-item::before {
    content: none;
}

.landfill-list-item:hover {
    color: #10201f;
    background: transparent;
}

.landfill-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    padding-right: 10px;
    position: relative;
    z-index: 2;
}

.landfill-actions form {
    margin: 0;
}

.landfill-edit-button,
.landfill-delete-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
}

.landfill-form .btn {
    margin-top: 6px;
}

.landfill-form-compact {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.landfill-form-compact .section-label {
    margin-bottom: 8px;
}

.landfill-form-compact .form-control {
    min-height: 36px;
}

.ads-landfill-card > .form-section:last-child {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.ad-assignment-card {
    overflow-y: auto;
}

.landfill-list-item span:first-child {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.landfill-list small {
    color: var(--edm-text-soft);
    font-size: .72rem;
}

.landfill-list-item.active {
    color: #10201f;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
}

.landfill-list-item.active small {
    color: var(--edm-text-soft);
}

[data-bs-theme="dark"] .landfill-list-row {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .landfill-list-row:hover,
[data-bs-theme="dark"] .landfill-list-row:has(.landfill-list-item.active) {
    color: #e8eef4;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

[data-bs-theme="dark"] .landfill-list-item,
[data-bs-theme="dark"] .landfill-list-item.active {
    color: #fff;
    background: transparent;
    border-color: transparent;
}

[data-bs-theme="dark"] .landfill-list small,
[data-bs-theme="dark"] .landfill-list-item.active small {
    color: rgba(232, 238, 244, .72);
}

.document-list a,
.document-row,
.action-tile,
.module-card .form-section {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    color: #10201f;
    text-decoration: none;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    padding: 10px 12px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.document-row {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 42px;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    padding: 0;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.document-row > a:first-child {
    flex: 1 1 auto;
    min-width: 0;
    color: inherit;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.document-row > a:first-child span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-delete {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    min-height: 34px;
    margin-right: 6px;
    color: #dc3545;
    background: transparent;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
}

.document-delete:hover {
    color: #dc3545;
    background: rgba(220, 53, 69, .1);
}

.document-list a.active,
.document-row.active,
.action-tile:hover,
.module-card:hover .form-section {
    color: #fff;
    background: var(--edm-primary-fill);
    border-color: var(--edm-primary);
}

.document-list i,
.document-row i,
.action-tile i,
.module-card i {
    color: var(--edm-primary);
    font-size: 1.05rem;
}

.document-list a.active i,
.document-row.active > a:first-child i,
.action-tile:hover i,
.module-card:hover i {
    color: #fff;
}

.document-row.active .document-delete {
    color: #fff;
    background: transparent;
    border: 0;
}

[data-bs-theme="dark"] .document-delete,
[data-bs-theme="dark"] .document-row.active .document-delete {
    color: #ff5c73;
    background: transparent;
    border: 0;
}

.document-row.active .document-delete i,
.document-row.active .document-delete:hover i,
[data-bs-theme="dark"] .document-row.active .document-delete i {
    color: #fff;
}

.document-row.active .document-delete:hover {
    color: #fff;
    background: rgba(255,255,255,.12);
}

.document-row.active .document-delete:hover i {
    color: #fff;
}

.export-file-card,
.export-viewer-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.export-file-list {
    display: grid;
    gap: 8px;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    margin: 18px;
    padding-right: 4px;
}

.export-file-item {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 10px 12px 10px 18px;
    color: #10201f;
    text-decoration: none;
    background: color-mix(in srgb, var(--edm-primary) 10%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--edm-primary) 20%, var(--edm-border));
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    overflow: hidden;
}

.export-file-item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: var(--edm-primary);
}

.export-file-item i {
    color: var(--edm-primary);
    font-size: 1.18rem;
}

.export-file-item span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.export-file-item strong,
.export-file-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.export-file-item strong {
    font-size: .82rem;
    font-weight: 660;
}

.export-file-item small {
    color: var(--edm-text-soft);
    font-size: .7rem;
}

.export-file-item:hover,
.export-file-item.active {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 16%, #ffffff);
    border-color: var(--edm-primary);
    box-shadow: 0 8px 20px rgba(36, 87, 255, .12), 0 1px 4px rgba(23, 43, 54, .025);
}

.export-file-item:hover i,
.export-file-item.active i,
.export-file-item:hover small,
.export-file-item.active small {
    color: var(--edm-primary);
}

.export-file-item:hover small,
.export-file-item.active small {
    color: var(--edm-text-soft);
}

.json-viewer {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    margin: 18px;
    padding: 14px;
    color: #10201f;
    background: rgba(255,255,255,.82);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    font-size: .74rem;
    line-height: 1.45;
    overflow: auto;
    white-space: pre;
}

.export-viewer-empty {
    margin: 18px;
}

[data-bs-theme="dark"] .export-file-item,
[data-bs-theme="dark"] .json-viewer {
    color: #e8eef4;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: color-mix(in srgb, var(--edm-primary) 36%, #35424d);
}

[data-bs-theme="dark"] .export-file-item:hover,
[data-bs-theme="dark"] .export-file-item.active {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 28%, #17202a);
    border-color: var(--edm-primary);
}

.edm-data-layout {
    align-items: stretch;
    grid-template-columns: repeat(18, minmax(0, 1fr));
    grid-template-rows: auto minmax(0, 1fr);
    justify-content: stretch;
    width: 100%;
    height: calc(100vh - 120px);
    min-height: 0;
    overflow: hidden;
}

.content-inner:has(.edm-data-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
    width: 100%;
    max-width: none;
    padding: 12px 14px 14px;
}

.edm-page-toolbar {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    min-width: 0;
    min-height: 58px;
    padding: 10px 14px;
}

.edm-page-toolbar > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.edm-page-toolbar strong,
.edm-page-toolbar span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edm-page-toolbar strong {
    font-size: .82rem;
    font-weight: 700;
}

.edm-page-toolbar span {
    color: var(--edm-text-soft);
    font-size: .72rem;
}

.edm-import-inline {
    display: inline-grid;
    grid-template-columns: minmax(220px, 320px) auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    margin: 0;
}

.edm-import-file {
    position: relative;
    display: block;
    min-width: 0;
}

.edm-import-file i {
    position: absolute;
    left: 11px;
    top: 50%;
    z-index: 1;
    color: var(--edm-text-soft);
    transform: translateY(-50%);
    pointer-events: none;
}

.edm-import-file .form-control {
    min-height: 42px;
    padding-left: 34px;
    font-size: .82rem;
}

.edm-import-inline .btn {
    min-height: 42px;
    white-space: nowrap;
}

.edm-import-progress {
    grid-column: 1 / -1;
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 8px 10px;
    background: color-mix(in srgb, var(--edm-primary) 8%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--edm-primary) 18%, var(--edm-border));
    border-radius: 8px;
}

.edm-import-progress[hidden] {
    display: none;
}

.edm-import-progress > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}

.edm-import-progress strong,
.edm-import-progress span {
    font-size: .72rem;
    line-height: 1.1;
}

.edm-import-progress strong {
    color: var(--edm-text);
    font-weight: 700;
}

.edm-import-progress span {
    color: var(--edm-primary);
    font-weight: 800;
}

.edm-import-progress-track {
    overflow: hidden;
    height: 7px;
    background: color-mix(in srgb, var(--edm-primary) 12%, #ffffff);
    border-radius: 999px;
}

.edm-import-progress-track span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--edm-primary), #18a058);
    border-radius: inherit;
    transition: width .42s ease;
}

.edm-import-summary {
    display: none;
}

.edm-summary-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 18px 16px;
}

.edm-summary-grid > div {
    display: grid;
    gap: 2px;
    min-height: 52px;
    padding: 9px 12px;
    background: color-mix(in srgb, var(--edm-primary) 9%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--edm-primary) 18%, var(--edm-border));
    border-radius: 8px;
}

.edm-summary-grid strong {
    color: var(--edm-primary);
    font-size: 1.18rem;
    line-height: 1;
}

.edm-summary-grid span {
    color: var(--edm-text-soft);
    font-size: .78rem;
    font-weight: 650;
}

.edm-data-layout > .edm-import-card {
    grid-row: 2;
    grid-column: span 6;
}

.edm-import-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.edm-import-card .bento-title {
    flex: 0 0 auto;
}

.edm-import-card > .list-search {
    flex: 0 0 auto;
    margin: 16px 24px 8px;
}

.edm-site-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 10px;
    margin: 16px 24px 8px;
}

.edm-site-toolbar .list-search {
    margin: 0;
}

.edm-site-count {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 10px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 8%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--edm-primary) 18%, var(--edm-border));
    border-radius: 8px;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.edm-site-toolbar form {
    margin: 0;
}

.edm-site-toolbar .btn {
    width: 100%;
    min-height: 42px;
    white-space: nowrap;
}

.edm-import-list {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
    max-height: none;
    margin: 0 24px 18px;
    padding-right: 4px;
    overflow-y: auto;
}

.edm-import-card > .bento-title + .edm-import-list {
    margin-top: 16px;
}

.edm-import-item {
    position: relative;
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 64px;
    padding: 7px 10px;
    color: #10201f;
    text-align: left;
    text-decoration: none;
    background: rgba(255,255,255,.76);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
    overflow: visible;
}

.edm-site-item,
.edm-total-site-item {
    min-height: 82px;
}

button.edm-import-item {
    cursor: pointer;
}

.edm-import-item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: transparent;
}

.edm-import-item > span {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.edm-import-item strong,
.edm-import-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.35;
}

.edm-import-item strong {
    font-size: .78rem;
    font-weight: 700;
}

.edm-import-item small {
    color: var(--edm-text-soft);
    font-size: .66rem;
}

.edm-import-item em {
    display: grid;
    place-items: center;
    min-width: 34px;
    height: 30px;
    color: #fff;
    background: var(--edm-primary);
    border-radius: 8px;
    font-style: normal;
    font-weight: 700;
    font-size: .78rem;
}

.edm-operator-badges {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.edm-operator-badges i {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    color: #fff;
    background: #168a4a;
    border-radius: 999px;
    font-size: .86rem;
}

.edm-import-item:hover,
.edm-import-item.active {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 4%, #fff);
    border-color: var(--edm-border);
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

button.edm-import-item.active {
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
    border-left-color: var(--edm-primary);
    padding-left: 14px;
    padding-top: 7px;
    padding-bottom: 7px;
}

button.edm-import-item.active::before {
    background: var(--edm-primary);
}

[data-bs-theme="dark"] .edm-summary-grid > div,
[data-bs-theme="dark"] .edm-import-item {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .edm-import-progress {
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .edm-import-progress strong {
    color: #e8eef4;
}

[data-bs-theme="dark"] .edm-import-progress-track {
    background: rgba(255, 255, 255, .08);
}

[data-bs-theme="dark"] .edm-site-count {
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .edm-import-item:hover,
[data-bs-theme="dark"] .edm-import-item.active {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: #35424d;
}

.module-card {
    color: inherit;
    text-decoration: none;
}

.action-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 24px;
}

.infocenter-layout {
    align-items: stretch;
    grid-template-rows: minmax(300px, 330px) minmax(405px, 440px) minmax(0, 1fr);
    height: calc(100vh - 134px);
    min-height: 0;
    overflow: hidden;
}

.content-inner:has(.infocenter-layout) {
    box-sizing: border-box;
    height: 100vh;
    overflow: hidden;
}

.infocenter-layout .list-search {
    margin: 10px 12px 6px;
}

.infocenter-customer-panel,
.infocenter-command,
.infocenter-customer-detail,
.infocenter-top-articles,
.infocenter-graphics,
.infocenter-pulse,
.infocenter-ledger,
.infocenter-activity {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.infocenter-customer-panel {
    grid-row: 1 / 3;
}

.infocenter-graphics {
    grid-row: span 2;
}

.infocenter-customer-list,
.infocenter-activity-list,
.infocenter-article-list {
    display: grid;
    gap: 6px;
    margin: 10px 12px 12px;
    padding-right: 4px;
    overflow-y: auto;
}

.infocenter-customer-list {
    flex: 1 1 auto;
    max-height: none;
    min-height: 0;
}

.infocenter-customer-item,
.infocenter-activity-item,
.infocenter-article-item {
    display: grid;
    align-items: center;
    gap: 8px;
    min-height: 50px;
    padding: 8px 9px;
    color: #10201f;
    text-decoration: none;
    background: rgba(255,255,255,.72);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.infocenter-customer-item {
    display: flex;
    align-items: center;
    grid-template-columns: none;
}

.infocenter-customer-item img,
.infocenter-customer-initial {
    align-self: center;
    flex: 0 0 34px;
}

.infocenter-customer-item img,
.infocenter-customer-initial {
    width: 34px;
    height: 34px;
    border-radius: 50%;
}

.infocenter-customer-item img {
    display: block;
    object-fit: cover;
}

.infocenter-customer-initial {
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--edm-primary);
    font-weight: 760;
}

.infocenter-customer-copy,
.infocenter-activity-item span,
.infocenter-article-item span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.infocenter-customer-copy {
    flex: 1 1 auto;
}

.infocenter-customer-copy strong,
.infocenter-customer-copy small,
.infocenter-activity-item strong,
.infocenter-activity-item small,
.infocenter-article-item strong,
.infocenter-article-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.infocenter-customer-copy strong,
.infocenter-activity-item strong,
.infocenter-article-item strong {
    font-size: .8rem;
    font-weight: 680;
}

.infocenter-customer-copy small,
.infocenter-activity-item small,
.infocenter-article-item small {
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.infocenter-customer-money,
.infocenter-activity-item em,
.infocenter-article-item em {
    color: #10201f;
    font-size: .74rem;
    font-style: normal;
    font-weight: 760;
    white-space: nowrap;
}

.infocenter-customer-item:hover,
.infocenter-customer-item.active {
    color: #10201f;
    background: color-mix(in srgb, var(--edm-primary) 7%, #fff);
    border-color: color-mix(in srgb, var(--edm-primary) 45%, var(--edm-border));
}

.infocenter-customer-item.active {
    box-shadow: inset 5px 0 0 var(--edm-primary), 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.infocenter-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 12px;
}

.infocenter-kpi,
.infocenter-customer-stats div,
.infocenter-pulse-stack div {
    min-height: 78px;
    padding: 10px 12px;
    background: rgba(255,255,255,.82);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(23, 43, 54, .045), 0 1px 4px rgba(23, 43, 54, .025);
}

.infocenter-kpi.primary {
    border-left: 5px solid var(--edm-primary);
}

.infocenter-kpi span,
.infocenter-customer-stats span,
.infocenter-pulse-stack span {
    display: block;
    color: var(--edm-text-soft);
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
}

.infocenter-kpi strong {
    display: block;
    margin-top: 8px;
    color: #10201f;
    font-size: clamp(1.12rem, 1.55vw, 1.48rem);
    font-weight: 780;
    line-height: 1;
}

.infocenter-kpi small {
    display: block;
    margin-top: 8px;
    color: var(--edm-text-soft);
    font-size: .68rem;
}

.infocenter-customer-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 12px;
}

.infocenter-customer-stats div,
.infocenter-pulse-stack div {
    min-height: 62px;
}

.infocenter-customer-stats strong,
.infocenter-pulse-stack strong {
    display: block;
    margin-top: 6px;
    color: #10201f;
    font-size: .98rem;
    font-weight: 760;
}

.infocenter-customer-meta {
    display: grid;
    gap: 6px;
    margin: 0 12px 12px;
}

.infocenter-customer-meta span {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 6px 8px;
    color: #10201f;
    background: rgba(255,255,255,.7);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    font-size: .78rem;
}

.infocenter-customer-meta i {
    color: var(--edm-primary);
}

.infocenter-article-item {
    grid-template-columns: minmax(0, 1fr) auto;
}

.infocenter-pulse-stack {
    display: grid;
    gap: 8px;
    margin: 10px 12px 12px;
}

.infocenter-graph-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(118px, 1fr);
    gap: 10px;
    flex: 1 1 auto;
    min-height: 0;
    margin: 12px;
}

.infocenter-graph-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 10px;
    background: rgba(255,255,255,.82);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(19, 29, 34, .04);
}

.infocenter-graph-card-wide {
    grid-column: span 2;
}

.graph-label {
    color: var(--edm-text-soft);
    font-size: .7rem;
    font-weight: 760;
    text-transform: uppercase;
}

.infocenter-line-chart {
    width: 100%;
    min-height: 74px;
    margin-top: 4px;
    overflow: visible;
}

.line-chart-grid {
    fill: none;
    stroke: rgba(111, 130, 144, .18);
    stroke-width: 1;
}

.line-chart-line {
    fill: none;
    stroke: var(--edm-primary);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.2;
    opacity: .82;
}

.infocenter-month-axis {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 2px;
    color: var(--edm-text-soft);
    font-size: .58rem;
    font-weight: 700;
    text-align: center;
}

.infocenter-graph-bars {
    display: grid;
    gap: 8px;
    margin-top: 8px;
}

.infocenter-graph-row {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) 86px;
    align-items: center;
    gap: 8px;
    min-height: 28px;
}

.infocenter-graph-row span {
    color: var(--edm-text-soft);
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
}

.infocenter-graph-row strong {
    color: #10201f;
    font-size: .66rem;
    font-weight: 760;
    text-align: right;
    white-space: nowrap;
}

.infocenter-graph-track {
    height: 8px;
    overflow: hidden;
    background: rgba(39, 110, 231, .1);
    border-radius: 999px;
}

.infocenter-graph-track i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--edm-primary), var(--edm-accent));
    border-radius: inherit;
}

.infocenter-graph-donut-card {
    align-items: center;
    justify-content: space-between;
}

.infocenter-donut {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(112px, 58%);
    aspect-ratio: 1;
    margin-top: 8px;
    border-radius: 50%;
    position: relative;
}

.infocenter-donut::after {
    content: "";
    position: absolute;
    inset: 18px;
    background: rgba(255,255,255,.95);
    border-radius: inherit;
}

.infocenter-donut strong,
.infocenter-donut small {
    position: relative;
    z-index: 1;
    text-align: center;
}

.infocenter-donut strong {
    color: #10201f;
    font-size: .74rem;
    font-weight: 780;
}

.infocenter-donut small {
    margin-top: 2px;
    color: var(--edm-text-soft);
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
}

.infocenter-donut-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 10px;
    margin-top: 8px;
    color: var(--edm-text-soft);
    font-size: .62rem;
    font-weight: 700;
}

.infocenter-donut-legend span::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 4px;
    border-radius: 50%;
    background: #9aa9b8;
}

.infocenter-donut-legend .legend-advertisement::before { background: var(--edm-primary); }
.infocenter-donut-legend .legend-design_generation::before { background: var(--edm-accent); }

.infocenter-customer-rank {
    display: grid;
    gap: 8px;
    margin-top: 8px;
}

.infocenter-top-customers-card .infocenter-customer-rank {
    min-height: 0;
}

.infocenter-rank-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    position: relative;
    min-height: 28px;
    padding-bottom: 9px;
}

.infocenter-rank-row span {
    overflow: hidden;
    color: #10201f;
    font-size: .68rem;
    font-weight: 720;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.infocenter-rank-row strong {
    color: #10201f;
    font-size: .66rem;
    font-weight: 760;
    white-space: nowrap;
}

.infocenter-rank-row i {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 5px;
    background: linear-gradient(90deg, var(--edm-primary), var(--edm-accent));
    border-radius: 999px;
}

.infocenter-ledger > .table-responsive {
    flex: 1 1 auto;
    min-height: 0;
    margin: 10px 12px 12px;
    overflow: auto;
}

.infocenter-ledger .table {
    margin-bottom: 0;
}

.infocenter-ledger .table th,
.infocenter-ledger .table td {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: .8rem;
    line-height: 1.18;
}

.infocenter-ledger .table small {
    font-size: .66rem;
    line-height: 1.15;
}

.infocenter-activity-item {
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.infocenter-activity-item i {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: var(--edm-primary);
    background: color-mix(in srgb, var(--edm-primary) 11%, transparent);
    border-radius: 8px;
}

.infocenter-layout .bento-title h2 {
    font-weight: 560 !important;
}

.infocenter-layout .bento-title p,
.infocenter-kpi span,
.infocenter-customer-stats span,
.infocenter-pulse-stack span,
.graph-label,
.infocenter-graph-row span,
.infocenter-donut small {
    font-weight: 500 !important;
}

.infocenter-customer-copy strong,
.infocenter-activity-item strong,
.infocenter-article-item strong,
.infocenter-rank-row span,
.infocenter-ledger .table strong {
    font-weight: 520 !important;
}

.infocenter-customer-money,
.infocenter-activity-item em,
.infocenter-article-item em,
.infocenter-kpi strong,
.infocenter-customer-stats strong,
.infocenter-pulse-stack strong,
.infocenter-graph-row strong,
.infocenter-rank-row strong,
.infocenter-donut strong,
.infocenter-ledger .table th,
.infocenter-ledger .table td:last-child {
    font-weight: 580 !important;
}

[data-bs-theme="dark"] .infocenter-customer-item,
[data-bs-theme="dark"] .infocenter-activity-item,
[data-bs-theme="dark"] .infocenter-article-item,
[data-bs-theme="dark"] .infocenter-kpi,
[data-bs-theme="dark"] .infocenter-customer-stats div,
[data-bs-theme="dark"] .infocenter-graph-row,
[data-bs-theme="dark"] .infocenter-graph-card,
[data-bs-theme="dark"] .infocenter-pulse-stack div,
[data-bs-theme="dark"] .infocenter-customer-meta span {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .infocenter-customer-money,
[data-bs-theme="dark"] .infocenter-activity-item em,
[data-bs-theme="dark"] .infocenter-article-item em,
[data-bs-theme="dark"] .infocenter-kpi strong,
[data-bs-theme="dark"] .infocenter-customer-stats strong,
[data-bs-theme="dark"] .infocenter-graph-row strong,
[data-bs-theme="dark"] .infocenter-donut strong,
[data-bs-theme="dark"] .infocenter-rank-row span,
[data-bs-theme="dark"] .infocenter-rank-row strong,
[data-bs-theme="dark"] .infocenter-pulse-stack strong {
    color: #fff;
}

[data-bs-theme="dark"] .infocenter-donut::after {
    background: rgba(23, 30, 36, .96);
}

[data-bs-theme="dark"] .infocenter-customer-item:hover,
[data-bs-theme="dark"] .infocenter-customer-item.active {
    color: #fff;
    background: color-mix(in srgb, var(--edm-primary) 18%, #17202a);
    border-color: var(--edm-primary);
}

[data-bs-theme="dark"] .document-list a,
[data-bs-theme="dark"] .document-row,
[data-bs-theme="dark"] .action-tile,
[data-bs-theme="dark"] .module-card .form-section {
    color: #e8eef4;
    background: rgba(23, 30, 36, .88);
    border-color: #35424d;
}

[data-bs-theme="dark"] .document-list a.active,
[data-bs-theme="dark"] .document-row.active,
[data-bs-theme="dark"] .action-tile:hover,
[data-bs-theme="dark"] .module-card:hover .form-section {
    color: #fff;
    background: var(--edm-primary-fill);
    border-color: var(--edm-primary);
}

[data-bs-theme="dark"] .list-search .form-control,
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    color: #e8eef4;
    background-color: #1b2228;
    border-color: #35424d;
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: #9aa8b5;
}

.table-responsive { border-radius: 8px; }
.btn-primary { --bs-btn-bg: var(--edm-primary); --bs-btn-border-color: var(--edm-primary); }
.btn-outline-primary { --bs-btn-color: var(--edm-primary); --bs-btn-border-color: var(--edm-primary); }
.text-accent { color: var(--edm-accent); }
.form-control,
.form-select {
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(23, 43, 54, .035);
    transition: border-color .16s ease, box-shadow .16s ease;
}

.form-control:focus,
.form-select:focus {
    box-shadow: 0 0 0 .14rem color-mix(in srgb, var(--edm-primary) 13%, transparent), 0 2px 6px rgba(23, 43, 54, .055);
}

.login-screen {
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 1rem;
}

.login-panel {
    width: min(420px, 100%);
    background: rgba(255,255,255,.9);
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    padding: 1.35rem;
    box-shadow: 0 18px 54px rgba(23, 43, 54, .12);
}

[data-bs-theme="dark"] .login-panel {
    background: rgba(21, 25, 28, .96);
    border-color: #323d49;
    box-shadow: 0 18px 54px rgba(0,0,0,.3);
}

.login-logo {
    display: block;
    width: min(210px, 66%);
    height: auto;
    object-fit: contain;
    margin: 0 auto .75rem;
}

.login-logo.logo-dark {
    display: none;
}

[data-bs-theme="dark"] .login-logo.logo-light {
    display: none;
}

[data-bs-theme="dark"] .login-logo.logo-dark {
    display: block;
}

.login-panel h1 {
    margin-bottom: 1.15rem;
    text-align: center;
    font-size: 1.05rem;
    font-weight: 620;
}

.login-panel .form-label {
    color: var(--edm-text-soft);
    font-size: .84rem;
    font-weight: 500;
}

.login-panel .form-control {
    min-height: 42px;
    font-size: .92rem;
}

[data-bs-theme="dark"] .login-panel .form-label {
    color: #d6dce3;
}

[data-bs-theme="dark"] .login-panel .form-control {
    background: #f4f7fb;
    color: #171b20;
}

.login-panel .btn {
    min-height: 42px;
    font-size: .92rem;
}

iframe.pdf-frame {
    flex: 1 1 auto;
    width: calc(100% - 48px);
    min-height: 0;
    margin: 24px;
    border: 1px solid var(--edm-border);
    border-radius: 8px;
    background: #fff;
}

@media (min-width: 992px) and (max-height: 950px) {
    .infocenter-layout {
        grid-template-rows: minmax(270px, .85fr) minmax(0, 1fr) minmax(0, .72fr);
    }

    .infocenter-graph-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: minmax(96px, .9fr) minmax(112px, 1fr);
        grid-auto-rows: minmax(88px, 1fr);
        gap: 8px;
        margin: 10px;
    }

    .infocenter-graph-card-wide {
        grid-column: 1 / -1;
    }

    .infocenter-graph-card {
        padding: 8px;
        overflow: hidden;
    }

    .infocenter-line-chart {
        min-height: 52px;
    }

    .infocenter-donut {
        width: min(92px, 54%);
        margin-top: 4px;
    }

    .infocenter-donut::after {
        inset: 15px;
    }

    .infocenter-donut-legend {
        gap: 4px 8px;
        margin-top: 4px;
        font-size: .58rem;
    }

    .infocenter-graph-bars,
    .infocenter-customer-rank {
        gap: 6px;
        margin-top: 6px;
    }

    .infocenter-graph-row,
    .infocenter-rank-row {
        min-height: 24px;
    }

    .infocenter-top-customers-card .infocenter-customer-rank {
        flex: 1 1 auto;
        overflow-y: auto;
        padding-right: 2px;
    }

    .infocenter-top-customers-card .infocenter-rank-row {
        min-height: 22px;
        padding-bottom: 7px;
    }
}

@media (max-width: 991px) {
    .content-area {
        padding-left: 0;
    }

    .content-inner {
        padding: 72px 16px 22px;
    }

    .content-inner:has(.infocenter-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.customers-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.articles-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.ads-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.designer-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.users-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.pdf-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.exports-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.settings-layout) {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.backups-layout) {
        height: auto;
        overflow: visible;
    }

    .customers-layout {
        height: auto;
        overflow: visible;
    }

    .articles-layout {
        height: auto;
        overflow: visible;
        grid-template-rows: none;
    }

    .articles-layout > .bento {
        height: auto;
        overflow: visible;
    }

    .article-management-footer {
        grid-template-columns: 1fr;
        flex-basis: auto;
    }

    .article-group-list {
        max-height: 220px;
    }

    .ads-layout {
        height: auto;
        overflow: visible;
        grid-template-rows: none;
    }

    .ads-layout > .bento {
        height: auto;
        overflow: visible;
    }

    .designer-layout {
        height: auto;
        overflow: visible;
        grid-template-rows: none;
    }

    .designer-layout > .bento {
        height: auto;
        overflow: visible;
    }

    .exports-layout {
        height: auto;
        overflow: visible;
    }

    .exports-layout > .bento {
        height: auto;
    }

    .users-layout {
        height: auto;
        overflow: visible;
    }

    .users-layout > .bento {
        height: auto;
    }

    .pdf-layout {
        height: auto;
        overflow: visible;
    }

    .pdf-layout > .bento {
        height: auto;
    }

    .pdf-upload-card,
    .pdf-view-card {
        overflow: visible;
    }

    iframe.pdf-frame {
        min-height: 70vh;
    }

    .backups-layout {
        height: auto;
        overflow: visible;
        grid-template-rows: none;
    }

    .infocenter-layout {
        height: auto;
        overflow: visible;
        grid-template-rows: none;
    }

    .topbar {
        min-height: auto;
        align-items: flex-end;
    }

    .manifest-chip {
        width: min(340px, 38vw);
    }

    .bento-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .ads-layout { grid-template-columns: repeat(8, minmax(0, 1fr)); }
    .designer-layout { grid-template-columns: repeat(8, minmax(0, 1fr)); }
    .span-3, .span-4 { grid-column: span 3; }
    .customers-layout > .customer-edit-card { grid-column: 1 / -1; }
    .customers-layout > .customer-left-stack { grid-column: span 6; }
    .ads-layout > .bento { grid-column: 1 / -1; }
    .designer-layout > .bento {
        grid-column: 1 / -1;
        grid-row: auto;
    }
    .infocenter-customer-panel,
    .infocenter-command,
    .infocenter-customer-detail,
    .infocenter-top-articles,
    .infocenter-graphics,
    .infocenter-pulse,
    .infocenter-ledger,
    .infocenter-activity {
        grid-column: span 6;
    }
    .span-5, .span-6, .span-7, .span-8, .span-12 { grid-column: span 6; }
    .articles-layout > .span-4 { grid-column: 1 / -1; }
    .pdf-layout > .bento { grid-column: 1 / -1; }
    .users-layout > .bento { grid-column: 1 / -1; }
    .settings-form .span-4,
    .settings-form .span-12 {
        grid-column: 1 / -1;
    }

    .settings-form {
        height: auto;
        overflow: visible;
        grid-template-rows: none;
        grid-auto-rows: auto;
    }

    .settings-form > .bento {
        height: auto;
        overflow: visible;
    }

    .content-inner:has(.edm-data-layout) {
        height: auto;
        overflow: visible;
    }

    .edm-data-layout {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        grid-template-rows: none;
    }

    .edm-data-layout > .edm-import-card {
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .edm-page-toolbar {
        grid-template-columns: 1fr;
    }

    .edm-import-inline {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) auto;
    }
}

@media (max-width: 575px) {
    body {
        background-size: 20px 20px, 20px 20px, auto;
    }

    .topbar {
        gap: 12px;
        flex-direction: column;
        align-items: stretch;
    }

    .topbar-actions {
        justify-content: space-between;
        gap: 10px;
    }

    .manifest-chip {
        width: 100%;
        min-width: 0;
    }

    .user-chip {
        align-self: flex-end;
    }

    .bento-grid,
    .ads-layout,
    .designer-layout,
    .edm-import-inline,
    .infocenter-kpi-grid,
    .infocenter-customer-stats,
    .infocenter-graph-grid,
    .metric-grid,
    .action-grid {
        grid-template-columns: 1fr;
    }

    .infocenter-graph-card-wide {
        grid-column: span 1;
    }

    .form-grid,
    .address-grid,
    .title-line,
    .date-grid,
    .settings-two-col,
    .settings-system-grid {
        grid-template-columns: 1fr;
    }

    .mode-switch {
        grid-template-columns: 1fr;
    }

    .settings-form {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        height: auto;
        overflow: visible;
        grid-template-rows: none;
        grid-auto-rows: auto;
    }

    .settings-form > .bento {
        height: auto;
        overflow: visible;
    }

    .settings-form .span-4,
    .settings-form .span-12 {
        grid-column: span 6;
    }

    .address-grid label:nth-child(5),
    .address-grid label:nth-child(6) {
        grid-column: auto;
    }

    .avatar-section {
        grid-template-columns: 1fr;
    }

    .avatar-crop-panel {
        justify-self: start;
        width: 122px;
    }

    .avatar-cropper {
        width: 96px;
    }

    .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-12 { grid-column: span 1; }
    .customers-layout > .customer-edit-card,
    .customers-layout > .customer-left-stack { grid-column: span 1; }
    .customers-layout > .customer-left-stack {
        grid-template-rows: auto auto;
    }
    .customer-detail-body,
    .customer-detail-meta {
        grid-template-columns: 1fr;
    }
    .ads-layout .span-4 { grid-column: span 1; }
    .ads-layout .customer-ad-list-card { grid-column: span 1; }
    .designer-customer-card,
    .designer-design-list-card,
    .designer-form-card,
    .designer-stage-card,
    .infocenter-customer-panel,
    .infocenter-command,
    .infocenter-customer-detail,
    .infocenter-top-articles,
    .infocenter-graphics,
    .infocenter-pulse,
    .infocenter-ledger,
    .infocenter-activity {
        grid-column: span 1;
    }
    .designer-meta-grid,
    .designer-color-grid,
    .designer-logo-row,
    .designer-ad-form {
        grid-template-columns: 1fr;
    }
    .designer-meta-grid label:first-child,
    .designer-meta-grid label:nth-child(3),
    .designer-meta-grid label:nth-child(4) {
        grid-column: auto;
    }
    .bento { padding: .85rem; }
    .table { min-width: 720px; }
    .login-panel {
        padding: 1.3rem;
    }
}