:root {
    --admin-bg: #f3f6f8;
    --admin-panel: #ffffff;
    --admin-ink: #1d2630;
    --admin-muted: #647184;
    --admin-line: #dce3ea;
    --admin-primary: #1769aa;
    --admin-success: #167a5b;
    --admin-warning: #a66b00;
    --admin-info: #4d6f84;
}

* {
    letter-spacing: 0;
}

body {
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--admin-ink);
}

.admin-body {
    background: var(--admin-bg);
}

.admin-header {
    background: var(--admin-topbar, var(--admin-panel));
    border-bottom: 1px solid var(--admin-line);
    position: sticky;
    top: 0;
    z-index: 1030;
}
/*.btn:hover { color:var(--admin-ink); }*/
.navbar-brand,
.login-brand {
    align-items: center;
    display: inline-flex;
    gap: .75rem;
    font-weight: 800;
}

.brand-mark {
    align-items: center;
    background: var(--admin-primary);
    border-radius: .5rem;
    color: #fff;
    display: inline-flex;
    font-size: .85rem;
    font-weight: 800;
    height: 2.2rem;
    justify-content: center;
    width: 2.2rem;
}

.brand-copy {
    color: var(--admin-ink);
    display: none;
}

.admin_logo {
    max-width: 260px;
    width: 100%;
}
.top-module-nav {
    gap: .25rem;
    margin-left: 0;
}

.top-module-nav .nav-link {
    border-radius: .45rem;
    color: var(--admin-muted);
    font-weight: 600;
    padding: .55rem .85rem;
}

.top-module-nav .nav-link.active,
.top-module-nav .nav-link:hover {
    background: var(--admin-primary-soft);
    color: var(--admin-primary);
}

.header-actions {
    align-items: center;
    display: flex;
    gap: .75rem;
}

.website-switcher {
    min-width: 180px;
}

.user-chip {
    align-items: center;
    color: var(--admin-muted);
    display: inline-flex;
    font-size: .92rem;
    font-weight: 600;
    gap: .45rem;
    white-space: nowrap;
}

.admin-shell {
    display: flex;
    min-height: calc(100vh - 65px);
}

.admin-sidebar {
    background: var(--admin-sidebar, #202a36);
    color: #fff;
    flex: 0 0 272px;
    padding: 1.25rem;
}

.sidebar-title {
    color: #aebdcb;
    font-size: .78rem;
    font-weight: 800;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.sidebar-menu {
    display: grid;
    gap: .35rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar-menu a {
    align-items: center;
    border-radius: .5rem;
    color: #d9e3ec;
    display: flex;
    gap: .7rem;
    padding: .75rem .8rem;
    text-decoration: none;
}

.sidebar-parent {
    align-items: center;
    color: #f5f8fb;
    display: flex;
    font-weight: 700;
    gap: .7rem;
    padding: .75rem .8rem .35rem;
}

.sidebar-submenu {
    display: grid;
    gap: .25rem;
    list-style: none;
    margin: .15rem 0 .6rem;
    padding: 0 0 0 1.2rem;
}

.sidebar-submenu a {
    font-size: .92rem;
    padding: .55rem .7rem;
}

.sidebar-menu a.active,
.sidebar-menu a:hover {
    background: var(--admin-primary-dark);
    color: #fff;
}

.admin-main {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.admin-content {
    flex: 1;
    padding: 1.5rem;
}

.validation-message {
    font-size: .84rem;
    font-weight: 600;
    margin-top: .35rem;
    min-height: 1.1rem;
}

.validation-error {
    color: #dc3545;
}

.validation-success {
    color: #198754;
}

.form-control.is-invalid,
.form-select.is-invalid,
.form-check-input.is-invalid {
    border-color: #dc3545;
    box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .12);
}

.form-control.is-valid,
.form-select.is-valid,
.form-check-input.is-valid {
    border-color: #198754;
}

.is-submitting {
    opacity: .9;
}

.cms-page-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.cms-editor-shell {
    display: grid;
    gap: 1rem;
    padding-bottom: 5.5rem;
}

.cms-editor-tabs {
    background: #fff;
    border: 1px solid #dbe3ea;
    border-radius: .75rem;
    gap: .35rem;
    overflow-x: auto;
    padding: .5rem;
}

.cms-editor-tabs .nav-link {
    align-items: center;
    border-radius: .55rem;
    color: #526273;
    display: flex;
    font-weight: 700;
    gap: .45rem;
    white-space: nowrap;
}

.cms-editor-tabs .nav-link.active {
    background: var(--admin-primary);
}

.wizard-progress {
    background: #fff;
    border: 1px solid #dbe3ea;
    border-radius: .85rem;
    display: grid;
    gap: .5rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: .65rem;
}

.wizard-step {
    align-items: center;
    border: 1px solid #e2e8f0;
    border-radius: .7rem;
    color: #667789;
    display: flex;
    font-weight: 800;
    gap: .65rem;
    min-height: 56px;
    padding: .75rem;
}

.wizard-step-number {
    align-items: center;
    background: #eef3f7;
    border-radius: 50%;
    display: inline-flex;
    flex: 0 0 32px;
    height: 32px;
    justify-content: center;
}

.wizard-step.active {
    border-color: var(--admin-primary);
    color: #17324d;
    box-shadow: 0 10px 24px rgba(13, 110, 253, .1);
}

.wizard-step.active .wizard-step-number,
.wizard-step.complete .wizard-step-number {
    background: var(--admin-primary);
    color: #fff;
}

.wizard-step.complete {
    color: #274761;
}

.editor-card {
    background: #fff;
    border: 1px solid #dbe3ea;
    border-radius: .75rem;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .05);
    margin-bottom: 1rem;
    padding: 1.25rem;
}

.editor-card-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.editor-card-header h2 {
    color: #182536;
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.editor-card-header p {
    color: #6c7a89;
    margin: .2rem 0 0;
}

.sticky-side {
    position: sticky;
    top: 1rem;
}

.layout-card-grid,
.media-type-grid {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.media-type-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.layout-card,
.media-type-card {
    align-items: flex-start;
    border: 1px solid #d9e2ec;
    border-radius: .7rem;
    cursor: pointer;
    display: grid;
    gap: .35rem;
    min-height: 112px;
    padding: 1rem;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.media-type-card {
    align-items: center;
    min-height: 92px;
    text-align: center;
}

.layout-card:hover,
.media-type-card:hover,
.layout-card.selected,
.media-type-card:has(input:checked) {
    border-color: var(--admin-primary);
    box-shadow: 0 10px 24px rgba(13, 110, 253, .12);
}

.layout-card input,
.media-type-card input,
.segmented-control input,
.status-choice input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.layout-card i,
.media-type-card i {
    color: var(--admin-primary);
    font-size: 1.45rem;
}

.layout-card span,
.media-type-card span {
    color: #172536;
    font-weight: 800;
}

.layout-card small {
    color: #6c7a89;
}

.status-choice-group,
.segmented-control {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.status-choice span,
.segmented-control span {
    border: 1px solid #d9e2ec;
    border-radius: 999px;
    color: #526273;
    cursor: pointer;
    display: inline-flex;
    font-weight: 700;
    padding: .45rem .8rem;
}

.status-choice input:checked + span,
.segmented-control input:checked + span {
    background: var(--admin-primary);
    border-color: var(--admin-primary);
    color: #fff;
}

.advanced-box {
    border-top: 1px solid #e6edf3;
    padding-top: .75rem;
}

.advanced-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    color: #24364a;
    display: flex;
    font-weight: 800;
    justify-content: space-between;
    padding: 0;
    width: 100%;
}

.image-preview-box {
    align-items: center;
    aspect-ratio: 16 / 5;
    background: #f5f8fb;
    border: 1px dashed #bdcad8;
    border-radius: .7rem;
    color: #6b7b8c;
    display: flex;
    justify-content: center;
    overflow: hidden;
    padding: .75rem;
}

.image-preview-box img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.layout-preview {
    display: grid;
    gap: .9rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.layout-zone {
    background: #f8fafc;
    border: 1px solid #dce5ee;
    border-radius: .75rem;
    min-height: 180px;
    padding: .8rem;
}

.zone-title {
    color: #526273;
    font-size: .78rem;
    font-weight: 900;
    margin-bottom: .6rem;
    text-transform: uppercase;
}

.zone-drop {
    display: grid;
    gap: .5rem;
    min-height: 110px;
}

.module-grid {
    display: grid;
    gap: .5rem;
    max-height: 620px;
    overflow: auto;
}

.module-group-title {
    color: #4b5563;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
    margin-top: .4rem;
    text-transform: uppercase;
}

.module-pill,
.selected-module {
    align-items: center;
    background: #fff;
    border: 1px solid #d9e2ec;
    border-radius: .6rem;
    color: #25384d;
    display: flex;
    font-weight: 700;
    gap: .5rem;
    min-height: 42px;
    padding: .6rem .7rem;
    text-align: left;
}

.module-pill:disabled {
    background: #eef3f7;
    color: #94a3b2;
    cursor: not-allowed;
}

.selected-module {
    cursor: grab;
    justify-content: space-between;
}

.selected-module.core-content-module {
    background: #f8fafc;
}

.selected-module span {
    flex: 1;
}

.selected-module small {
    color: #198754;
    font-weight: 800;
}

.selected-module button {
    align-items: center;
    background: #fff1f2;
    border: 0;
    border-radius: 999px;
    color: #b4232f;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.module-ghost {
    opacity: .55;
}

.page-content-editor-shell .ck-editor__editable {
    min-height: 340px;
}

.page-content-editor-shell.editor-fullscreen {
    background: #fff;
    inset: 1rem;
    overflow: auto;
    padding: 1rem;
    position: fixed;
    z-index: 1100;
}

.page-content-editor-shell.editor-fullscreen .ck-editor__editable {
    min-height: calc(100vh - 180px);
}

.page-content-editor {
    min-height: 340px;
}

.form-action-bar {
    align-items: center;
    background: rgba(255, 255, 255, .96);
    border: 1px solid #dbe3ea;
    border-radius: .75rem .75rem 0 0;
    bottom: 0;
    box-shadow: 0 -12px 32px rgba(15, 23, 42, .08);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    left: calc(272px + 1.5rem);
    padding: .9rem 1rem;
    position: sticky;
    right: 1.5rem;
    z-index: 20;
}

.cropper-layout {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) 220px;
}

.cropper-stage {
    align-items: center;
    background: #101820;
    border-radius: .75rem;
    display: flex;
    justify-content: center;
    min-height: 460px;
    overflow: hidden;
}

.cropper-stage img {
    display: block;
    max-height: 70vh;
    max-width: 100%;
}

.cropper-tools {
    display: grid;
    gap: .6rem;
}

.cropper-preview {
    aspect-ratio: 16 / 5;
    border: 1px solid #d9e2ec;
    border-radius: .6rem;
    overflow: hidden;
    width: 100%;
}

.front-preview-frame {
    background: #fff;
    border: 1px solid #d9e2ec;
    border-radius: .75rem;
    height: 680px;
    width: 100%;
}

.front-preview-empty {
    align-items: center;
    background: #f8fafc;
    border: 1px dashed #bdcad8;
    border-radius: .75rem;
    color: #6b7b8c;
    display: flex;
    justify-content: center;
    min-height: 220px;
    padding: 1rem;
    text-align: center;
}

@media (max-width: 1199.98px) {
    .sticky-side {
        position: static;
    }
}

@media (max-width: 991.98px) {
    .layout-card-grid,
    .media-type-grid,
    .wizard-progress,
    .layout-preview,
    .cropper-layout {
        grid-template-columns: 1fr;
    }

    .form-action-bar {
        left: 1rem;
        right: 1rem;
    }
}

@media (max-width: 767.98px) {
    .cms-page-header,
    .form-action-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .editor-card {
        padding: 1rem;
    }

    .cropper-stage {
        min-height: 300px;
    }
}

.page-header {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.35rem;
}

.page-header h1 {
    font-size: clamp(1.65rem, 2vw, 2.25rem);
    font-weight: 800;
    margin: 0;
}

.page-header p {
    color: var(--admin-muted);
    margin: .35rem 0 0;
}

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

.stat-card,
.cms-card,
.table-shell,
.form-shell,
.login-card {
    background: var(--admin-panel);
    border: 1px solid var(--admin-line);
    border-radius: .5rem;
    box-shadow: 0 16px 40px rgba(31, 43, 58, .06);
}

.stat-card {
    border-top: 4px solid var(--admin-primary);
    padding: 1rem;
}

.stat-card span {
    color: var(--admin-muted);
    display: block;
    font-size: .86rem;
    font-weight: 700;
}

.stat-card strong {
    display: block;
    font-size: 1.65rem;
    margin-top: .45rem;
}

.stat-success { border-top-color: var(--admin-success); }
.stat-warning { border-top-color: var(--admin-warning); }
.stat-info { border-top-color: var(--admin-info); }

.dashboard-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 1rem;
}

.cms-card {
    padding: 1.15rem;
}

.card-icon {
    align-items: center;
    background: var(--admin-primary-soft);
    border-radius: .5rem;
    color: var(--admin-primary);
    display: inline-flex;
    height: 2.6rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 2.6rem;
}

.cms-card h2,
.table-shell h2,
.form-shell h2 {
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0 0 .45rem;
}

.cms-card p {
    color: var(--admin-muted);
    margin: 0;
}

.table-shell,
.form-shell {
    overflow: hidden;
}

.table-shell-header {
    align-items: center;
    border-bottom: 1px solid var(--admin-line);
    display: flex;
    justify-content: space-between;
    padding: 12px 15px;
    background: #202a36;
    color: #fff;
}
.table-shell-header h2 { margin-bottom: 0; }

.table-shell-header p {
    color: var(--admin-muted);
    margin: .25rem 0 0;
}

.table-tools {
    align-items: center;
    display: flex;
    gap: .75rem;
}

.table-tools .form-control {
    min-width: 220px;
}

.table th {
    color: var(--admin-muted);
    font-size: .8rem;
    text-transform: uppercase;
}

.admin-table td,
.admin-table th {
    padding: .9rem 1.15rem;
}

.admin-table tbody tr:hover {
    background: #f8fafc;
}

.status-badge {
    border-radius: 999px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 800;
    padding: .35rem .7rem;
}

.status-active {
    background: #eaf7f1;
    color: #12684d;
}

.status-inactive {
    background: #f2f4f6;
    color: #6f7b89;
}

.action-group {
    display: inline-flex;
    gap: .35rem;
    flex-wrap: wrap;
}

.table-footer {
    border-top: 1px solid var(--admin-line);
    padding: 1rem 1.15rem;
}

.table-footer .pagination {
    margin: 0;
}

.form-shell {
    padding: 1.25rem;
}

.form-shell-wide {
    max-width: 980px;
}

.admin-form label {
    color: var(--admin-muted);
    font-size: .85rem;
    font-weight: 800;
    margin-bottom: .35rem;
}

.form-actions {
    align-items: center;
    border-top: 1px solid var(--admin-line);
    display: flex;
    gap: .65rem;
    justify-content:center;
    margin-top: 1.25rem;
    padding-top: 1.25rem;

}


.form-builder-stepper {
    background: #fff;
    border: 1px solid var(--admin-line);
    border-radius: .75rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
}

.form-builder-step {
    align-items: center;
    color: var(--admin-muted);
    display: flex;
    font-size: .88rem;
    font-weight: 800;
    gap: .6rem;
    min-height: 52px;
    padding: .65rem 1rem;
    position: relative;
}

.form-builder-step:not(:last-child)::after {
    color: #aab6c2;
    content: "\F285";
    font-family: bootstrap-icons;
    position: absolute;
    right: -.2rem;
}

.form-builder-step-number {
    align-items: center;
    background: #eef3f7;
    border-radius: 50%;
    display: inline-flex;
    flex: 0 0 28px;
    height: 28px;
    justify-content: center;
}

.form-builder-step.active { background: var(--admin-primary-soft); color: var(--admin-primary); }
.form-builder-step.active .form-builder-step-number,
.form-builder-step.complete .form-builder-step-number { background: var(--admin-primary); color: #fff; }
.form-builder-card { background: #fff; border: 1px solid var(--admin-line); border-radius: .75rem; overflow: hidden; }
.form-builder-card-header { align-items: center; border-bottom: 1px solid var(--admin-line); display: flex; gap: .8rem; padding: 1rem 1.15rem; }
.form-builder-card-header > i { align-items: center; background: var(--admin-primary-soft); border-radius: .5rem; color: var(--admin-primary); display: flex; font-size: 1.1rem; height: 38px; justify-content: center; width: 38px; }
.form-builder-card-header h2 { font-size: 1rem; font-weight: 800; margin: 0; }
.form-builder-card-header p { color: var(--admin-muted); font-size: .82rem; margin: .15rem 0 0; }
.form-builder-card-body { padding: 1.15rem; }
.form-builder-switch { align-items: center; border-bottom: 1px solid #edf1f5; display: flex; justify-content: space-between; margin: 0; padding: .8rem 0 .8rem 2.8rem; }
.form-builder-switch .form-check-input { float: none; margin-left: -2.8rem; }
.form-builder-field-list { display: grid; gap: .75rem; }
.form-builder-field-card { align-items: center; background: #fff; border: 1px solid var(--admin-line); border-radius: .65rem; display: flex; gap: .75rem; padding: .8rem; }
.form-builder-field-card:hover { border-color: #b7c7d8; box-shadow: 0 8px 20px rgba(31,43,58,.06); }
.form-builder-field-card .drag-handle { color: var(--admin-muted); cursor: grab; font-size: 1.25rem; }
.form-builder-width { max-width: 125px; }
.form-builder-actions { align-items: center; background: #fff; border: 1px solid var(--admin-line); border-radius: .75rem; display: flex; gap: .65rem; justify-content: flex-end; margin-top: 1.25rem; padding: .85rem 1rem; }
.form-builder-actions .btn { min-height: 40px; }
.form-builder-editor + .ck-editor .ck-editor__editable { min-height: 220px; }

@media (max-width: 991.98px) {
    .form-builder-stepper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .form-builder-step:nth-child(2)::after { display: none; }
}

@media (max-width: 575.98px) {
    .form-builder-stepper { grid-template-columns: 1fr; }
    .form-builder-step::after { display: none; }
    .form-builder-field-card { align-items: flex-start; flex-wrap: wrap; }
    .form-builder-actions { align-items: stretch; flex-direction: column; }
    .form-builder-actions .btn { width: 100%; }
}

.permission-table td:first-child span {
    color: var(--admin-muted);
    display: block;
    font-size: .8rem;
}

.permission-table .form-check {
    display: inline-flex;
    min-height: auto;
}

.module-toggle-list {
    display: grid;
    gap: 1rem;
    padding: 1.15rem;
}

.module-group {
    border: 1px solid var(--admin-line);
    border-radius: .5rem;
    overflow: hidden;
}

.module-group h3 {
    background: #f8fafc;
    border-bottom: 1px solid var(--admin-line);
    color: var(--admin-ink);
    font-size: .9rem;
    font-weight: 800;
    margin: 0;
    padding: .8rem 1rem;
}

.module-group-list {
    display: grid;
}

.module-toggle-row {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: 0;
    padding: .95rem 1rem;
}

.module-toggle-row + .module-toggle-row {
    border-top: 1px solid var(--admin-line);
}

.module-toggle-row strong,
.image-settings-table strong {
    display: block;
    font-weight: 800;
}

.module-toggle-row small,
.image-settings-table td:first-child span {
    color: var(--admin-muted);
    display: block;
    font-size: .8rem;
    margin-top: .15rem;
}

.module-child {
    padding-left: 2rem;
}

.module-toggle-row .form-check {
    margin: 0;
    min-height: auto;
}

.module-toggle-row .form-check-input {
    height: 1.35rem;
    width: 2.65rem;
}

.sticky-actions {
    background: var(--admin-panel);
    bottom: 0;
    margin: 0;
    padding: 1rem 1.15rem;
    position: sticky;
}

.size-input {
    max-width: 120px;
}

.settings-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
}

.settings-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.settings-card-wide {
    grid-row: span 2;
}

.settings-card-header {
    align-items: center;
    display: flex;
    gap: .85rem;
}

.settings-card-header .card-icon {
    flex: 0 0 auto;
    margin: 0;
}

.settings-card-header p,
.field-note {
    color: var(--admin-muted);
    margin: .15rem 0 0;
}

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

.colour-control {
    align-items: center;
    border: 1px solid var(--admin-line);
    border-radius: .5rem;
    display: grid;
    gap: .65rem;
    grid-template-columns: minmax(0, 1fr) 3rem auto;
    margin: 0;
    padding: .8rem;
}

.colour-control span {
    color: var(--admin-ink);
    font-size: .86rem;
    font-weight: 800;
}

.colour-control input[type="color"] {
    background: transparent;
    border: 0;
    height: 2.15rem;
    padding: 0;
    width: 2.65rem;
}

.colour-control code {
    background: #f2f5f8;
    border-radius: .35rem;
    color: var(--admin-muted);
    font-size: .78rem;
    padding: .35rem .45rem;
}

.logo-preview {
    align-items: center;
    background: #f8fafc;
    border: 1px dashed var(--admin-line);
    border-radius: .5rem;
    display: flex;
    justify-content: center;
    min-height: 140px;
    padding: 1rem;
}

.logo-preview img {
    max-height: 110px;
    max-width: 100%;
    object-fit: contain;
}

.logo-preview span {
    color: var(--admin-muted);
    font-weight: 700;
}

.rich-editor-label {
    color: var(--admin-muted);
    font-size: .85rem;
    font-weight: 800;
}

.rich-editor-toolbar {
    display: flex;
    gap: .35rem;
}

.rich-editor {
    border: 1px solid var(--admin-line);
    border-radius: .45rem;
    min-height: 160px;
    padding: .85rem;
}

.rich-editor-compact {
    min-height: 96px;
}

.rich-editor:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 .2rem var(--admin-primary-soft);
    outline: 0;
}

.console-settings-grid {
    align-items: start;
}

.settings-section-form {
    display: contents;
}

.refresh-status {
    background: #f8fafc;
    border: 1px solid var(--admin-line);
    border-radius: .5rem;
    padding: .9rem;
}

.refresh-status span {
    color: var(--admin-muted);
    display: block;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.refresh-status strong {
    display: block;
    margin-top: .25rem;
}

.background-upload-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.background-upload-grid h3 {
    font-size: .92rem;
    font-weight: 800;
    margin: 0 0 .65rem;
}

.background-preview {
    min-height: 180px;
}

.background-preview img {
    border-radius: .35rem;
    max-height: 150px;
    width: 100%;
}

.placeholder-panel {
    max-width: 680px;
}

.admin-footer {
    border-top: 1px solid var(--admin-line);
    color: var(--admin-muted);
    display: flex;
    gap: 1rem;
    font-size: .85rem;
    justify-content: space-between;
    padding: 1rem 1.5rem;
}

.admin-footer p {
    margin: 0;
}

.message {
    border-radius: .5rem;
    margin-bottom: 1rem;
    padding: .85rem 1rem;
}

.message.success {
    background: #eaf7f1;
    border: 1px solid #bfe9d6;
    color: #12684d;
}

.message.error {
    background: #fff1f1;
    border: 1px solid #f4c2c2;
    color: #9b1c1c;
}

.login-body {
    background: #eef3f6;
    min-height: 100vh;
}

.login-stage {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 100vh;
    padding: 1rem;
}

.login-card {
    max-width: 460px;
    padding: 2rem;
    width: 100%;
}

.login-brand {
    margin-bottom: 1.5rem;
}

.login-brand h1 {
    font-size: 1.45rem;
    font-weight: 800;
    margin: 0;
}

.login-brand p {
    color: var(--admin-muted);
    margin: .1rem 0 0;
}

.form-control {
    border-color: var(--admin-line);
    border-radius: .45rem;
}

.btn {
    border-radius: .45rem;
    font-weight: 700;
}

.btn-primary {
    --bs-btn-bg: var(--admin-button-primary, var(--admin-primary));
    --bs-btn-border-color: var(--admin-button-primary, var(--admin-primary));
    --bs-btn-hover-bg: var(--admin-primary-dark);
    --bs-btn-hover-border-color: var(--admin-primary-dark);
    --bs-btn-active-bg: var(--admin-primary-dark);
    --bs-btn-active-border-color: var(--admin-primary-dark);
}

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

.badge.text-bg-success {
    background: var(--admin-button-2) !important;
}

.badge.text-bg-light {
    color: var(--admin-ink) !important;
}

.lock-screen {
    align-items: center;
    background: rgba(15, 23, 42, .72);
    display: flex;
    inset: 0;
    justify-content: center;
    padding: 1rem;
    position: fixed;
    z-index: 3000;
}

.lock-screen[hidden] {
    display: none;
}

.lock-card {
    background: var(--admin-panel);
    border-radius: .5rem;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .2);
    max-width: 420px;
    padding: 1.5rem;
    text-align: center;
    width: 100%;
}

.lock-card h2 {
    font-size: 1.25rem;
    font-weight: 800;
    margin: .35rem 0;
}

.lock-card p,
.lock-message {
    color: var(--admin-muted);
}

.theme-library-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.theme-builder-page,.theme-editor-page{width:100%;max-width:none}
.theme-builder-page .table-responsive{background:var(--admin-panel);border:1px solid var(--admin-line);border-radius:.65rem;box-shadow:0 16px 40px rgba(31,43,58,.05)}
.theme-builder-page .table{margin-bottom:0}
.theme-editor-header{gap:1rem}
.theme-editor-utility-bar{align-items:center;background:#fff;border:1px solid var(--admin-line);border-radius:.65rem;display:flex;justify-content:space-between;margin-bottom:1rem;padding:.75rem 1rem}
.theme-editor-wrapper{background:var(--admin-panel);border:1px solid var(--admin-line);border-radius:.75rem;box-shadow:0 18px 50px rgba(31,43,58,.08);max-width:none;overflow:visible;width:100%}
.theme-editor-tabs{background:#f8fafc;border-bottom:1px solid var(--admin-line);border-radius:.75rem .75rem 0 0;padding:.75rem 1rem 0}
.theme-editor-tabs .nav-link{align-items:center;display:flex;font-weight:700;gap:.4rem;padding:.7rem 1rem}
.theme-editor-tab-content{max-width:none;padding:1rem;width:100%}
.theme-editor-tab-content .input.textarea textarea.form-control { height: 500px; }
.theme-editor-tab-content>.tab-pane{max-width:none;width:100%}
.theme-editor-pane-heading{align-items:center;display:flex;gap:1rem;justify-content:space-between;margin-bottom:.8rem}
.theme-editor-pane-heading strong,.theme-editor-pane-heading span{display:block}
.theme-editor-pane-heading strong{font-size:1rem}.theme-editor-pane-heading span{color:var(--admin-muted);font-size:.82rem;margin-top:.15rem}
.theme-code-editor{background:#101827;border-color:#27364d;color:#e7edf6;font-family:Consolas,Monaco,"Courier New",monospace;font-size:14px;line-height:1.5;max-width:none;resize:vertical;tab-size:4;width:100%!important}
.theme-code-editor:focus{background:#101827;color:#fff}
.theme-code-editor-html{min-height:650px}
.theme-code-editor-assets{min-height:500px}
.theme-editor-wrapper .CodeMirror{font-family:Consolas,Monaco,"Courier New",monospace;font-size:14px;height:auto!important;line-height:1.5;min-height:600px;width:100%!important}
.theme-editor-wrapper .CodeMirror-scroll{min-height:600px}
.theme-editor-wrapper .monaco-editor,.theme-editor-wrapper .monaco-editor .overflow-guard{min-height:600px;width:100%!important}
.theme-tag-library{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));min-height:500px}
.html-dynamic-editor{width:100%}
.html-dynamic-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px}
.html-dynamic-editor-grid>div{min-width:0;padding:1rem}
.html-dynamic-tag-panel{border-left:1px solid var(--admin-line);padding:1rem}
.html-dynamic-tag-panel .theme-tag-library{display:block;min-height:0}
.html-dynamic-tag-panel .theme-tag-group{margin-bottom:1rem}
.html-dynamic-tag-panel .theme-tag-group h2{font-size:.8rem;margin-bottom:.5rem;text-transform:uppercase}
.html-dynamic-editor .theme-code-editor-html{max-height:none}
.theme-tag-group{background:#f8fafc;border:1px solid var(--admin-line);border-radius:.6rem;padding:1rem}
.theme-tag-group h2{font-size:.9rem;font-weight:800;margin:0 0 .75rem}
.theme-tag-insert{font-family:Consolas,Monaco,monospace;font-size:.75rem}
.theme-editor-preview{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:500px;padding:3rem;text-align:center}
.theme-editor-preview>i{color:var(--admin-primary);font-size:3rem;margin-bottom:1rem}
.theme-editor-preview h2{font-size:1.35rem}.theme-editor-preview p{color:var(--admin-muted)}
.theme-editor-action-bar{align-items:center;background:#fff;border-radius:0 0 .75rem .75rem;border-top:1px solid var(--admin-line);bottom:0;display:flex;gap:1rem;justify-content:space-between;padding:.85rem 1rem;position:sticky;z-index:10}
.theme-editor-change-state{color:var(--admin-muted);font-size:.85rem;font-weight:700}.theme-editor-change-state.has-changes{color:#b45309}
.theme-editor-change-state.has-changes .bi{font-size:.5rem;vertical-align:middle}
.theme-editor-secondary-card{margin-top:1.25rem}
.theme-assets-page{max-width:none;width:100%}
.theme-assets-page-header{align-items:center;gap:1.25rem}
.theme-assets-page-header h1{margin-bottom:.25rem}
.theme-assets-theme-meta{align-items:center;display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.8rem}
.theme-assets-theme-meta code{background:#f1f5f9;border:1px solid var(--admin-line);border-radius:.35rem;color:#475569;padding:.2rem .45rem}
.theme-assets-panel{background:#fff;border:1px solid var(--admin-line);border-radius:.75rem;box-shadow:0 14px 36px rgba(22,38,50,.06);overflow:hidden}
.theme-assets-panel-header{align-items:center;border-bottom:1px solid var(--admin-line);display:flex;gap:1rem;justify-content:space-between;padding:1rem 1.15rem}
.theme-assets-panel-heading{align-items:center;display:flex;gap:.8rem;min-width:0}
.theme-assets-panel-heading h2{font-size:1.05rem;font-weight:800;margin:0}
.theme-assets-panel-heading p{color:var(--admin-muted);font-size:.82rem;margin:.18rem 0 0}
.theme-assets-panel-icon{align-items:center;background:var(--admin-primary-soft);border-radius:.55rem;color:var(--admin-primary-dark);display:flex;flex:0 0 auto;font-size:1.2rem;height:2.65rem;justify-content:center;width:2.65rem}
.theme-assets-upload-zone{background:#f8fafc;border-bottom:1px dashed #cbd5e1;padding:1rem 1.15rem}
.theme-assets-upload-zone form{background:#fff;border:1px dashed #b8c5d1;border-radius:.6rem;margin:0;padding:1rem}
.theme-assets-upload-zone .input{margin-bottom:0}
.theme-assets-table-wrap{width:100%}
.theme-assets-table{min-width:760px}
.theme-assets-table td,.theme-assets-table th{vertical-align:middle}
.theme-assets-table td:nth-child(1){width:110px}.theme-assets-table td:nth-child(4){width:100px}.theme-assets-table td:nth-child(5){width:210px}
.theme-assets-table td strong,.theme-assets-table td small{display:block}.theme-assets-table td small{color:var(--admin-muted);margin-top:.18rem}
.theme-asset-name-editor{margin-top:.25rem;max-width:260px}.theme-asset-name-editor summary{color:var(--admin-primary);cursor:pointer;font-size:.7rem;font-weight:700}.theme-asset-name-editor .input{margin:0}
.theme-asset-row-form{align-items:center;display:flex;gap:.15rem;margin:0}.theme-asset-row-form .input{margin:0}
.theme-asset-order{max-width:68px;text-align:center}.theme-asset-save-order{padding:.25rem .35rem}
.theme-asset-path{display:inline-block;max-width:390px;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}
.theme-asset-actions .btn{align-items:center;display:inline-flex;justify-content:center;min-width:34px}
.theme-assets-panel-footer{align-items:center;background:#f8fafc;border-top:1px solid var(--admin-line);color:var(--admin-muted);display:flex;font-size:.75rem;gap:1rem;justify-content:space-between;padding:.65rem 1.15rem}
.theme-assets-panel-footer code{color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.theme-assets-empty{align-items:center;color:var(--admin-muted);display:flex;flex-direction:column;gap:.45rem;justify-content:center;min-height:120px;padding:1.5rem;text-align:center}
.theme-assets-empty i{color:#94a3b8;font-size:1.7rem}.theme-assets-empty-grid{border:1px dashed #cbd5e1;border-radius:.6rem;grid-column:1/-1}
.theme-image-grid{display:grid;gap:1rem;grid-template-columns:repeat(4,minmax(0,1fr));padding:1.15rem}
.theme-image-card{background:#fff;border:1px solid var(--admin-line);border-radius:.65rem;box-shadow:0 6px 18px rgba(22,38,50,.05);min-width:0;overflow:hidden}
.theme-image-preview{align-items:center;background:linear-gradient(135deg,#eef2f6,#f8fafc);border-bottom:1px solid var(--admin-line);display:flex;height:180px;justify-content:center;overflow:hidden;padding:.5rem}
.theme-image-preview img{height:100%;object-fit:contain;transition:transform .2s ease;width:100%}.theme-image-preview:hover img{transform:scale(1.03)}
.theme-image-card-body{min-width:0;padding:.85rem}.theme-image-card-title{align-items:flex-start;display:flex;gap:.5rem;justify-content:space-between}
.theme-image-card-title strong,.theme-image-card-title small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.theme-image-card-title small{color:var(--admin-muted);font-size:.72rem;margin-top:.16rem}
.theme-image-details{align-items:center;color:var(--admin-muted);display:flex;font-size:.72rem;gap:.6rem;justify-content:space-between;margin:.65rem 0}
.theme-image-quick-actions{display:flex;flex-wrap:wrap;gap:.2rem}.theme-image-quick-actions .btn{align-items:center;display:inline-flex;gap:.25rem;justify-content:center}
.theme-image-details-editor{border-top:1px solid var(--admin-line);margin-top:.75rem;padding-top:.65rem}.theme-image-details-editor summary{color:var(--admin-primary);cursor:pointer;font-size:.76rem;font-weight:700}
.theme-image-details-editor .input{margin-bottom:.65rem}.min-w-0{min-width:0}
.theme-inline-tabs{background:#f8fafc;border-bottom:1px solid var(--admin-line);padding:.75rem 1rem 0}.theme-inline-tabs .nav-link{align-items:center;display:flex;gap:.35rem}
.theme-inline-tab-content{padding:1rem 1.15rem}.theme-inline-code-editor{background:#101827;border-color:#27364d;color:#e7edf6;font-family:Consolas,Monaco,"Courier New",monospace;font-size:14px;line-height:1.5;min-height:300px;resize:vertical;width:100%}
.theme-inline-code-editor:focus{background:#101827;color:#fff}.theme-inline-actions{border-top:1px solid var(--admin-line);display:flex;justify-content:flex-end;padding:.85rem 1.15rem}
.theme-version-code{max-height:28rem;overflow:auto;white-space:pre-wrap}
@media(max-width:1100px){.html-dynamic-editor-grid{grid-template-columns:1fr}.html-dynamic-tag-panel{border-left:0;border-top:1px solid var(--admin-line);display:none}.html-dynamic-editor.tags-open .html-dynamic-tag-panel{display:block}}
@media(max-width:900px){.theme-editor-utility-bar,.theme-editor-action-bar{align-items:stretch;flex-direction:column}.theme-editor-action-bar>div{justify-content:flex-end}.theme-editor-tabs{flex-wrap:nowrap;overflow-x:auto}.theme-editor-tabs .nav-link{white-space:nowrap}.theme-code-editor-html{min-height:520px}.theme-code-editor-assets{min-height:440px}}
@media(max-width:1199.98px){.theme-image-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767.98px){.theme-assets-page-header,.theme-assets-panel-header{align-items:stretch;flex-direction:column}.theme-assets-panel-header>.btn{align-self:flex-start}.theme-assets-panel-footer{align-items:flex-start;flex-direction:column;gap:.25rem}.theme-image-grid{grid-template-columns:1fr}.theme-image-preview{height:220px}.theme-inline-tabs{flex-wrap:nowrap;overflow-x:auto}.theme-inline-tabs .nav-link{white-space:nowrap}}
.visual-builder-shell{display:grid;gap:1.25rem;grid-template-columns:minmax(250px,320px) minmax(0,1fr)}
.visual-builder-palette{max-height:78vh;overflow:auto;position:sticky;top:1rem}
.visual-builder-source{display:grid;gap:.5rem}
.visual-builder-palette-item{align-items:center;background:#f8fafc;border:1px solid #dbe2ea;border-radius:7px;color:#17212b;cursor:grab;display:flex;gap:.5rem;padding:.5rem}
.visual-builder-palette-item:hover{border-color:var(--admin-primary);color:var(--admin-primary)}
.visual-builder-palette-main{align-items:center;display:flex;flex:1;gap:.5rem;min-width:0}
.visual-builder-palette-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.visual-builder-canvas{background:#f8fafc;border:2px dashed #cbd5e1;border-radius:8px;display:grid;gap:.75rem;min-height:28rem;padding:1rem}
.visual-builder-canvas.is-empty:after{align-self:center;color:#64748b;content:'Drag blocks here to build your page';justify-self:center}
.visual-builder-canvas-item,.visual-structure-preview article{align-items:center;background:#fff;border:1px solid #dbe2ea;border-radius:8px;display:flex;gap:.75rem;padding:.85rem}
.visual-builder-canvas-item .drag-handle{cursor:grab;font-size:1.25rem}.visual-builder-canvas-item div{display:grid;flex:1}.visual-builder-canvas-item small,.visual-structure-preview small{color:#64748b}
.visual-builder-item-actions{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:flex-end}
.vb-section-card{background:#fff;border:1px solid #dbe2ea;border-radius:8px;padding:.85rem}
.vb-section-header{align-items:center;display:flex;gap:.75rem}
.vb-drag-handle{cursor:grab;font-size:1.25rem;line-height:1}
.vb-section-copy{display:grid;flex:1}.vb-section-copy small{color:#64748b}
.vb-section-actions{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:flex-end}
.vb-settings-modal{border:0;border-radius:.65rem;box-shadow:0 22px 60px rgba(15,23,42,.25);max-width:760px;padding:0;width:calc(100% - 2rem)}
.vb-settings-modal::backdrop{background:rgba(15,23,42,.55)}
.vb-settings-header,.vb-settings-footer{align-items:center;display:flex;justify-content:space-between;padding:1rem 1.2rem}.vb-settings-header{border-bottom:1px solid #dbe2ea}.vb-settings-footer{border-top:1px solid #dbe2ea;justify-content:flex-end}.vb-settings-body{padding:1.2rem}
.vb-settings-body details{border:1px solid #dbe2ea;border-radius:.5rem;margin-bottom:.75rem;padding:.75rem}.vb-settings-body summary{cursor:pointer;font-weight:800}.vb-settings-grid{display:grid;gap:.85rem;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:1rem}.vb-settings-grid .form-label,.vb-settings-grid .form-check{margin:0}.vb-section-card{background-position:center;background-size:cover;position:relative;transition:background-color .15s ease,padding .15s ease,margin .15s ease}.vb-section-card.vb-preview-hidden{opacity:.45}.vb-section-card .vb-section-header{position:relative;z-index:1}
.vb-rows{display:grid;gap:.75rem;margin:1rem 0}.vb-row{background:#f1f5f9;border:1px solid #cbd5e1;border-radius:.5rem;padding:.65rem}.vb-row-toolbar{align-items:center;display:flex;gap:.5rem;margin-bottom:.65rem}.vb-row-toolbar strong{flex:1}.vb-row-handle,.vb-widget-handle{cursor:grab}.vb-columns{display:grid;gap:.65rem;grid-template-columns:repeat(12,minmax(0,1fr))}.vb-column{background:#fff;border:1px dashed #94a3b8;border-radius:.4rem;grid-column:span 12;min-height:110px;padding:.5rem}.vb-column.is-active{border-color:var(--admin-primary);box-shadow:0 0 0 2px var(--admin-primary-soft)}.vb-column[data-column-width="6"]{grid-column:span 6}.vb-column[data-column-width="4"]{grid-column:span 4}.vb-column[data-column-width="3"]{grid-column:span 3}.vb-column[data-column-width="2"]{grid-column:span 2}.vb-widget-list{display:grid;gap:.4rem;min-height:65px}.vb-widget-card{align-items:center;background:#eef2ff;border:1px solid #c7d2fe;border-radius:.35rem;display:flex;gap:.4rem;padding:.45rem}.vb-widget-card strong{flex:1;font-size:.85rem}
.visual-structure-preview{display:grid;gap:.8rem;max-width:900px}.visual-structure-preview article>span{align-items:center;background:#e7eef8;border-radius:50%;display:flex;font-weight:700;height:2rem;justify-content:center;width:2rem}.visual-structure-preview article div{display:grid}
@media(max-width:900px){.visual-builder-shell{grid-template-columns:1fr}.visual-builder-palette{max-height:none;position:static}.visual-builder-canvas-item,.vb-section-header{align-items:flex-start;flex-wrap:wrap}.visual-builder-item-actions,.vb-section-actions{width:100%}.vb-settings-grid{grid-template-columns:1fr}}

.theme-library-card {
    background: #fff;
    border: 1px solid #dbe2ea;
    border-radius: 8px;
    overflow: hidden;
}

.theme-preview {
    aspect-ratio: 16 / 9;
    background: #eef2f6;
    position: relative;
}

.theme-preview img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.theme-preview-placeholder {
    align-items: center;
    background: #eef2f6;
    color: #667481;
    display: flex;
    font-size: 3rem;
    height: 100%;
    justify-content: center;
    min-height: 180px;
}

.active-theme-badge {
    left: .75rem;
    position: absolute;
    top: .75rem;
}

.theme-card-body {
    padding: 1rem;
}

.theme-card-body h2 {
    font-size: 1.05rem;
    margin: 0 0 .2rem;
}

.theme-card-body p {
    color: #667481;
    margin: 1rem 0;
}

.theme-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.theme-meta div {
    min-width: 0;
}

.theme-meta dt,
.theme-details dt {
    color: #667481;
    font-size: .75rem;
    text-transform: uppercase;
}

.theme-meta dd,
.theme-details dd {
    margin: 0 0 .75rem;
}

.theme-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.form-control-group {
    border: 0;
    margin: 0 0 1rem;
    min-width: 0;
    padding: 0;
}

.form-control-group .form-label,.view_limit label  {
    float: none;
    font-size: .875rem;
    font-weight: 700;
    margin-bottom: .45rem;
    width: auto;
}
.view_limit .form-control { height: 40px; }
.required-asterisk {
    color: #c62828;
    margin-left: .2rem;
}

.input.required > label::after {
    color: #c62828;
    content: "*";
    margin-left: .2rem;
}
label.error {  color: #c62828;}
label.error::after {
    color: #c62828;
    content: "*";
    margin-left: .2rem;
    opacity: 0;
}

.form-radio-group,
.form-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.form-radio-option,
.form-checkbox-option {
    align-items: center;
    background: var(--admin-panel);
    border: 1px solid var(--admin-border);
    border-radius: .375rem;
    cursor: pointer;
    display: inline-flex;
    font-size: .9rem;
    font-weight: 600;
    gap: .45rem;
    min-height: 2.5rem;
    padding: .5rem .75rem;
}

.form-radio-option:has(input:checked),
.form-checkbox-option:has(input:checked) {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 1px var(--admin-primary);
}

.form-radio-option input,
.form-checkbox-option input {
    accent-color: var(--admin-primary);
    margin: 0;
}

.form-control-error:empty,
.form-control-error .error-message:empty {
    display: none;
}

.form-control-error,
.form-control-error .error-message {
    color: #c62828;
    font-size: .8rem;
    margin-top: .35rem;
}

.lock-message {
    font-size: .86rem;
    font-weight: 700;
    margin-top: .75rem;
    min-height: 1.25rem;
}

@media (max-width: 991.98px) {
    .admin-shell {
        display: block;
    }

    .admin-sidebar {
        flex-basis: auto;
    }

    .top-module-nav {
        margin-left: 0;
    }

    .header-actions {
        align-items: stretch;
        flex-direction: column;
        margin-top: .75rem;
    }

    .stat-grid,
    .dashboard-grid,
    .settings-grid,
    .background-upload-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .settings-card-wide {
        grid-row: auto;
    }
}

@media (max-width: 575.98px) {
    .admin-content {
        padding: 1rem;
    }

    .stat-grid,
    .dashboard-grid,
    .settings-grid,
    .colour-grid,
    .background-upload-grid {
        grid-template-columns: 1fr;
    }

    .colour-control {
        grid-template-columns: minmax(0, 1fr) 3rem;
    }

    .colour-control code {
        grid-column: 1 / -1;
    }

    .admin-footer {
        display: block;
    }
}

.hide{
    display: none;
}

.show{
    display: block;
}

.visible
{
    visibility: visible;
}
.hidden{
    visibility: hidden;
}
.boldLabelSEOForm
{
    color: orange;
    font-weight: bold;
}
.formSEOBG {
    background:rgba(34,64,146, 0.1);
    border-radius: 1px solid gray;
    padding: 20px;
    margin:20px -20px -20px -20px;
}


.orangeLabelSEOForm{
    color: orange; 
}
.form-control[type=file]:not(:disabled):not([readonly]) { height: auto; }

.jobs_nav { display: none; }
.form-shell .input { margin-bottom: 15px;  }
.form-shell label { font-weight: 600; margin-bottom: .35rem; color: #000;}

.btn-actions-right {
    display: flex;
    justify-content: end;
    gap: 10px;
}

.form-shell.currencies .input { margin-bottom: 0; }
.drag-handle i.bi.bi-list { font-size:30px; }
.dynamicfields label { display: none; }

.margintop { margin-top: 0; }
.form-shell .input.checkbox label,.form-shell .form-check label { margin-bottom: 0; }

.form-shell.addform .input { margin-bottom: 0; }
.form-shell.addform .input.select { flex-direction: column; display: flex; width: 100%; }

header.admin-header .form-select { height: auto; }


/* The container */
.radiobox1 {
  display: inline-block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size:14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.radiobox1 input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.radiobox1 .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border-radius: 50%;
  border: solid 1px #333;
}

/* On mouse-over, add a grey background color */
.radiobox1:hover input ~ .checkmark {
  background-color: #fff;
}

/* When the radio button is checked, add a blue background */
.radiobox1 input:checked ~ .checkmark {
  background-color: #2196F3;    border-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radiobox1 .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radiobox1 input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.radiobox1 .checkmark:after {
    top: 4.1px;
    left: 4.1px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: white;
}


/****** *****/

.checkbox1 {
    display: inline-flex;
    position: relative;
    padding-left: 0;
    margin-bottom: 0;
    cursor: pointer;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    gap: 5px;
}

/* Hide the browser's default checkbox */
.checkbox1 input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkbox1 .checkmark {
  position: relative;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border: solid 1px #333;
  display: inline-block;
}

/* On mouse-over, add a grey background color */
.checkbox1:hover input ~ .checkmark {
  background-color: #fff;
}

/* When the checkbox is checked, add a blue background */
.checkbox1 input:checked ~ .checkmark {
  background-color: #2196F3;
}
.checkbox1.disabled input:checked ~ .checkmark { background-color: #ccc; border-color: #ccc; }
.checkbox1.disabled .checkmark:after { opacity:0.5; }


.checkbox1 input:disabled ~ .checkmark {
  background-color: #2196F3;
}
.checkbox1.disabled input:disabled ~ .checkmark { background-color: #ccc; border-color: #ccc; }
.checkbox1.disabled .checkmark:after { opacity:0.5; }



/* Create the checkmark/indicator (hidden when not checked) */
.checkbox1 .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkbox1 input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox1 .checkmark:after {
    left: 7px;
    top: 1px;
    width: 6px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.formcheck {
    padding-top: 10px;
}

.bootbox button.bootbox-close-button.close {
    float: right;
    background: #dc3545;
    border: none;
    color: #fff;
    font-size: 20px;
    height: 27px;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    top: 13px;
    position: absolute;
    right: 15px;
    border-radius: .25rem;
}
h4.modal-title { font-size:14px; font-weight: bold; }
.bootbox .modal-content { overflow: hidden; }
.modal-footer { justify-content: center; }

.jobformbuilder .formcheck { padding-top: 0; padding-bottom: 15px; }
.jobformbuilder .formcheck em { display: inline-block; padding-left: 27px; }
.jobformbuilder .formcheck label { margin-bottom: 0; }

.dt-search,.dt-paging {
    margin-right: 15px;
}
.dt-layout-cell.dt-layout-start {
    margin-left: 15px;
}

textarea#summary {
    height: 150px;
}
textarea.form-control {
    height: 150px;
}

.form-control.textareabox { height: 150px; }
ul.nav.nav-pills.mb-3 {
    display: none;
}

.TableTitle { text-decoration: none; }
.TableTitle:hover { text-decoration: underline; }

.site_logo img { padding: 10px; }
nav.nav.nav-tabs.navGeneral { margin-bottom: -1px; }
.GeneralSettings { padding-bottom: 20px; }
a.Small-btn.width2 { width: auto;}
span.Small-btn.width2 { width: auto;}

.PageTable .table { margin-bottom: 0; }
.PageTable .form-actions { margin-top: 0; padding-bottom: 1.25rem;}


.form-actions {
    position: fixed;
    bottom: 0;
    background: #fff;
    width: 86%;
    left: 272px;
    padding: 10px 0;
}

.ActionsBtn .btn.btn-sm {padding: 0; width: 25px; height: 25px; }

.form-actions1 {
    text-align: center;
    padding-top: 20px;
}
.badge { font-size: 14px; }


.nav-tabs {
    list-style: none;
    padding: 0;
    display: flex;
}

.nav-tabs li {
    margin-right: 5px;
}

.nav-tabs a {
    padding: 10px 15px;
    text-decoration: none;
    border: 1px solid #ddd;
}

.nav-tabs a.active {
    background: #0d6efd;
    color: #fff;
}

.padding15 { padding:15px; }
.searchbasic_settings .row { margin-top: 0;  }
.searchbasic_settings .col-md-3 label { font-weight: bold; }
.searchbasic_settings .submit_action { margin-top: 15px; }



.TableShell {
    background: #fff;
    padding: 15px;
    border: 1px solid var(--admin-line);
    box-shadow: var(--admin-shadow);
}