/* Admin presentation only. Keep vendor layout dimensions and interaction hooks intact. */
:root, [data-bs-theme="light"] {
  --bs-primary: #2563eb;
  --bs-primary-rgb: 37, 99, 235;
  --bs-primary-text-emphasis: #1e40af;
  --bs-primary-bg-subtle: #eff6ff;
  --bs-primary-border-subtle: #bfdbfe;
  --bs-link-color: #2563eb;
  --bs-link-color-rgb: 37, 99, 235;
  --bs-link-hover-color: #1d4ed8;
  --bs-link-hover-color-rgb: 29, 78, 216;
  --bs-body-bg: #f8fafc;
  --bs-body-bg-rgb: 248, 250, 252;
  --bs-body-color: #475569;
  --bs-heading-color: #0f172a;
  --bs-border-color: #e2e8f0;
  --bs-body-font-size: .875rem;
  --bs-border-radius: .5rem;
  --sc-primary: #2563eb;
  --sc-primary-hover: #1d4ed8;
  --sc-primary-light: #eff6ff;
  --sc-border: #e2e8f0;
  --sc-text-dark: #0f172a;
  --sc-text-muted: #64748b;
}

/* Navigation: preserve the vendor's collapse and mobile positioning. */
#layout-menu { background: #fff; border-inline-end: 1px solid #e2e8f0; box-shadow: none; }
#layout-menu .app-brand { border-bottom: 1px solid #f1f5f9; }
#layout-menu .menu-inner { padding-block: .75rem 1.5rem !important; margin-bottom: 0 !important; }
#layout-menu .menu-header { margin-block: 1rem .35rem; padding-block: 0; color: #64748b; font-size: .625rem; letter-spacing: .09em; }
#layout-menu .menu-link { padding-block: .55rem; border-radius: 6px; font-size: .8125rem; color: #475569; }
#layout-menu .menu-icon { font-size: 1rem; }
#layout-menu .menu-item:not(.active) > .menu-link:hover { background: #f1f5f9; color: #0f172a; }
#layout-menu .menu-item.active > .menu-link { background: #eff6ff !important; color: #1d4ed8 !important; box-shadow: none !important; font-weight: 600; }
#layout-navbar { border: 1px solid #e2e8f0; border-radius: 8px; box-shadow: 0 2px 8px rgba(15,23,42,.03); }
#layout-navbar .text-muted { font-size: .8125rem; }
.container-p-y { padding-block: 1.25rem !important; }
.card { border: 1px solid #e2e8f0; border-radius: 8px; box-shadow: 0 2px 6px rgba(15,23,42,.025); }
.card-header, .card-body, .card-footer { padding: 1rem 1.25rem; }
.card-header h5, .card-header .h5 { font-size: 1rem; font-weight: 600; }
.card-header p { font-size: .8125rem; }

/* Consistent controls, including server-rendered and dynamically inserted forms. */
.btn { --bs-btn-font-size: .8125rem; --bs-btn-border-radius: .375rem; --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .875rem; box-shadow: none !important; }
.btn-primary {
  --bs-btn-bg: #2563eb; --bs-btn-border-color: #2563eb;
  --bs-btn-hover-bg: #1d4ed8; --bs-btn-hover-border-color: #1d4ed8;
  --bs-btn-active-bg: #1e40af; --bs-btn-active-border-color: #1e40af;
  --bs-btn-disabled-bg: #2563eb; --bs-btn-disabled-border-color: #2563eb;
  --bs-btn-focus-shadow-rgb: 37,99,235;
}
.btn-outline-primary { --bs-btn-color: #2563eb; --bs-btn-border-color: #2563eb; --bs-btn-hover-bg: #2563eb; --bs-btn-hover-border-color: #2563eb; --bs-btn-active-bg: #1d4ed8; --bs-btn-active-border-color: #1d4ed8; --bs-btn-disabled-color: #2563eb; --bs-btn-disabled-border-color: #2563eb; }
.btn-label-primary:hover, .btn-label-primary:focus-visible { background: #dbeafe !important; }
.bg-label-primary, .btn-label-primary { background: #eff6ff !important; color: #1d4ed8 !important; }
.form-label { margin-bottom: .35rem; color: #334155; font-size: .8125rem; font-weight: 500; }
.form-control, .form-select { padding-block: .5rem; font-size: .8125rem; border-radius: 6px; }
.form-control::placeholder { color: #64748b; opacity: 1; }
.form-control:focus, .form-select:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--bs-danger); }
.form-control.is-valid, .form-select.is-valid { border-color: var(--bs-success); }
.form-text { font-size: .75rem; }
.select2-container--default .select2-selection { border-radius: 6px; font-size: .8125rem; }
.select2-container--default.select2-container--focus .select2-selection { border-color: #2563eb; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: #eff6ff; color: #1d4ed8; }
.nav-pills .nav-link.active { box-shadow: none; }
.badge { font-weight: 600; }
.modal-content { border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 16px 48px rgba(15,23,42,.16); }
.modal-header, .modal-body, .modal-footer { padding: 1rem 1.25rem; }
.modal-title { font-size: 1rem; }
:is(a, button, input, select, textarea):focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }

/* Compact tables retain responsive disclosure controls, pagination and actions. */
.table { font-size: .8125rem; --bs-table-hover-bg: #f8fafc; }
.table > thead > tr > th { padding: .7rem 1rem; background: #f8fafc; color: #475569; font-size: .6875rem; font-weight: 600; letter-spacing: .035em; }
.table > tbody > tr > td { padding: .65rem 1rem; vertical-align: middle; }
.table tbody td > img { max-width: 44px; max-height: 44px; object-fit: cover; }
.table .btn-sm { padding: .3rem .5rem; }
.dt-container .dt-layout-row { margin-block: .75rem; }
.dt-container .dt-search input { font-size: .8125rem; }
.dt-container .dt-info, .dt-container .dt-length { font-size: .75rem; }
.pagination { --bs-pagination-font-size: .8125rem; }

/* Site Content: distinguish page navigation from section navigation. */
.page-tabs { padding: 4px; gap: 3px; margin-bottom: 1rem !important; border-radius: 8px; background: #f1f5f9; }
.page-tabs .nav-link { padding: .5rem .75rem; font-size: .8125rem; border-radius: 5px; }
.page-tabs .nav-link.active { background: #2563eb; box-shadow: none; }
.section-tabs-wrapper { padding: 3px; margin-bottom: 1rem; border-radius: 6px; }
.section-tabs .nav-link { padding: .4rem .65rem; font-size: .75rem; }
.section-tabs .nav-link.active { color: #1d4ed8; box-shadow: 0 1px 3px rgba(15,23,42,.06); }
.card-content-custom { border-radius: 8px; box-shadow: none; }
.field-group { padding: .875rem; margin-bottom: .75rem; border-radius: 6px; }
.field-group:last-child { margin-bottom: 1rem; }
.field-group:hover { box-shadow: none; }
.field-label { font-size: .8125rem; font-weight: 600; }
.image-upload-box { border-radius: 6px; }
.image-upload-box:hover { background: #eff6ff; }
.image-upload-box .upload-area { padding: .75rem .875rem; }
.upload-icon-circle { width: 36px; height: 36px; border-radius: 6px; background: #eff6ff; }
.section-save-bar { padding: .75rem 1rem; gap: .75rem; border-top: 1px solid #bfdbfe; border-radius: 6px; box-shadow: 0 -2px 8px rgba(15,23,42,.04); }
.section-save-bar .btn-section-save { padding: .5rem 1rem; font-size: .8125rem; border-radius: 6px; box-shadow: none; }
.section-save-bar .btn-section-save:hover { transform: none; box-shadow: none; }

/* Dashboard and media use the same restrained visual language. */
.dash-welcome-card { background: #eff6ff; border-color: #dbeafe; border-radius: 8px; }
.dash-stat-card, .dash-section-card, .mini-stat-card { border-radius: 8px; box-shadow: none; }
.dash-stat-card:hover, .mini-stat-card:hover, .media-card:hover { transform: none; border-color: #93c5fd; box-shadow: 0 2px 8px rgba(15,23,42,.04); }
.mini-stat-card { padding: .875rem 1rem; }
.stat-icon-box { width: 40px; height: 40px; border-radius: 7px; }
.msg-unread { background: #eff6ff !important; border-left-color: #2563eb !important; }
.media-card { border-radius: 7px; }
.media-meta { color: #64748b; }
.gallery-picker-item:hover, .gallery-picker-item.selected { border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37,99,235,.15); }

@media (max-width: 767.98px) {
  .card-header, .card-body, .card-footer, .modal-header, .modal-body, .modal-footer { padding: 1rem; }
  .section-save-bar { flex-wrap: wrap; }
  .page-tabs .nav-link { min-height: 40px; }
  .media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Shared list headers across the CRUD modules, including modal-based master data. */
.content-wrapper .container-p-y > .card > .d-flex.justify-content-between:first-child {
  padding: 1rem 1.25rem !important;
  gap: .75rem;
  flex-wrap: wrap;
  border-bottom: 1px solid #e2e8f0;
}
.content-wrapper .container-p-y > .card > .d-flex.justify-content-between:first-child h5 {
  font-size: 1rem;
  font-weight: 600;
}
.content-wrapper .container-p-y > .card > .d-flex.justify-content-between:first-child p {
  font-size: .8125rem;
  line-height: 1.5;
}
.card-datatable .dt-layout-row:not(.dt-layout-table) { padding-inline: 1rem; gap: .75rem; }
.card-datatable .dt-search label, .card-datatable .dt-length label { font-size: .75rem; }
.card-datatable .dt-paging .pagination { flex-wrap: wrap; gap: .2rem; }
.card-datatable .table .badge { line-height: 1.35; }
.modal-body .form-label { line-height: 1.4; }

/* Editorial forms: only visual classes; field names and submit hooks are preserved. */
.admin-editor > .d-flex.justify-content-between,
.admin-editor .card-header.d-flex { flex-wrap: wrap; gap: .75rem; }
.admin-editor > .d-flex h4 { font-size: 1.125rem; }
.admin-editor .card-header { border-bottom: 1px solid #e2e8f0; }
.admin-editor .card-header + .card-body { padding-top: 1rem; }
.admin-editor form > h6,
.admin-editor form > .row > .col-12 > h6 {
  color: #334155 !important;
  font-size: .8125rem;
  font-weight: 600;
}
.admin-editor form > hr { margin-block: 1.25rem !important; border-color: #e2e8f0; opacity: 1; }
.admin-editor .row { --bs-gutter-x: 1rem; }
.admin-editor .row > [class*="col-"] { min-width: 0; }
.admin-editor .tox-tinymce { border: 1px solid #e2e8f0; border-radius: 6px; }
.admin-editor .admin-form-actions {
  flex-wrap: wrap;
  padding: 1rem;
  margin-top: 1.25rem !important;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}
.admin-editor .detail-card { border-color: #e2e8f0; margin-bottom: .75rem; }
.admin-editor .detail-header { padding: .75rem 1rem; gap: .75rem; }
.admin-editor .detail-header .title-text { font-size: .8125rem; overflow-wrap: anywhere; }
.admin-editor .detail-body { padding: 0 1rem 1rem; }
.admin-editor .checkbox-group { background: #f8fafc; border-color: #e2e8f0; }
.admin-editor .dropzone { padding: 1.25rem; border-width: 1px; background: #f8fafc; }
.admin-editor .dropzone:hover, .admin-editor .dropzone.dragover { border-color: #2563eb; background: #eff6ff; transform: none; }
.admin-editor .empty-state { padding: 1.75rem 1rem; color: #64748b; }
.admin-editor .repeater-row { margin-inline: 0; padding: .625rem .125rem; border: 1px solid #e2e8f0; border-radius: 6px; background: #f8fafc; }
.admin-editor .repeater-row .form-label { font-size: .75rem; }
.admin-media .filter-bar { padding-block: .875rem; gap: .625rem; }
.admin-media .filter-bar .form-control,
.admin-media .filter-bar .form-select { min-width: 0; }
.admin-media > .card > .d-flex > .d-flex { flex-wrap: wrap; gap: .5rem !important; }
.admin-media .media-name { font-size: .75rem; color: #334155; }
.admin-media .media-info { padding: .625rem; }
@media (min-width: 768px) and (max-width: 1199.98px) {
  .admin-media .media-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .admin-editor .repeater-row > [class*="col-"] + [class*="col-"] { margin-top: .5rem; }
  .admin-editor .repeater-row .js-remove-repeater { width: auto !important; min-width: 40px; min-height: 40px; }
  .admin-media .filter-bar { flex-wrap: wrap; }
  .admin-media .filter-bar .form-control { flex: 1 1 100%; }
  .admin-media .filter-bar .form-select { flex: 1 1 120px; }
  .card-datatable .dt-layout-row:not(.dt-layout-table) { padding-inline: .75rem; }
}

/* Site Content workspace. Hooks and dynamically generated field markup stay intact. */
.site-content-page .sc-page-heading { margin-bottom: 1rem !important; }
.site-content-page .sc-page-heading h4 { font-size: 1.125rem; line-height: 1.4; }
.site-content-page .sc-page-heading p { max-width: 680px; line-height: 1.5; }
.site-content-page .sc-navigation-label {
  margin-bottom: .5rem;
  color: #64748b;
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.site-content-page .card-content-custom > .card-body { padding: 1rem !important; }
.site-content-page .page-tabs { flex-wrap: wrap; overflow: visible; gap: .25rem; }
.site-content-page .page-tabs .nav-link { min-height: 36px; gap: .375rem; font-weight: 500; }
.site-content-page .page-tabs .nav-link.active { font-weight: 600; }
.site-content-page .page-tabs .nav-link i { font-size: 1rem !important; }
.site-content-page .section-tabs-wrapper {
  display: flex;
  margin-bottom: 1rem !important;
  padding: 0 0 .625rem;
  border: 0;
  border-bottom: 1px solid #e2e8f0;
  border-radius: 0;
  background: transparent;
}
.site-content-page .section-tabs { gap: .25rem; }
.site-content-page .section-tabs .nav-link { min-height: 34px; padding: .375rem .625rem; }
.site-content-page .section-tabs .nav-link.active { background: #eff6ff; box-shadow: none; }
.site-content-page .section-tabs .nav-link.dirty::after { box-shadow: none; }
.site-content-page .field-group { padding: .875rem 1rem; background: #fff; }
.site-content-page .field-group > .d-flex:first-child { margin-bottom: .375rem !important; }
.site-content-page .field-size { padding: .125rem .375rem; border: 0; font-size: .6875rem; font-weight: 500; }
.site-content-page .bilingual-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .875rem; }
.site-content-page .bilingual-grid > div { min-width: 0; }
.site-content-page .bilingual-grid .form-label { color: #64748b; font-size: .75rem; }
.site-content-page .bilingual-grid .bg-label-danger { color: #475569 !important; background: #f1f5f9 !important; }
.site-content-page textarea.form-control { line-height: 1.55; resize: vertical; }
.site-content-page .tox-tinymce { border-color: #e2e8f0; border-radius: 6px; }
.site-content-page .image-upload-box { margin-top: .5rem; }
.site-content-page .upload-area { gap: .75rem; }
.site-content-page .upload-area > .d-flex { min-width: 0; gap: .625rem !important; }
.site-content-page .upload-label { font-size: .8125rem; }
.site-content-page .upload-status { font-size: .75rem; }
.site-content-page .btn-gallery-pick, .site-content-page .btn-upload { padding: .4rem .625rem; border-radius: 5px; font-size: .75rem; }
.site-content-page .btn-gallery-pick:hover { box-shadow: none; }
.site-content-page .image-preview-wrapper { padding: .75rem .875rem; gap: .875rem; background: #f8fafc; }
.site-content-page .preview-card { flex-shrink: 0; max-width: 45%; border-radius: 5px; box-shadow: none; background: #fff; }
.site-content-page .image-preview { max-width: 100%; width: auto; max-height: 96px; object-fit: contain; }
.site-content-page .section-save-bar { gap: .625rem; background: #fff; }
.site-content-page .save-indicator { font-size: .75rem; box-shadow: none; }
.site-content-page .section-order-list { max-width: none; }
.site-content-page .section-order-item { padding: .625rem .75rem !important; gap: .625rem !important; border-radius: 6px !important; box-shadow: none !important; }
.site-content-page .section-order-item.drag-over { border-color: #2563eb !important; background: #eff6ff; }
.site-content-page .section-order-item .section-order-number { min-width: 24px; height: 24px; font-size: .75rem; border-radius: 5px; }
.site-content-page .section-order-item > .flex-grow-1 { font-size: .8125rem !important; }
.site-content-page .visibility-toggles .alert, .site-content-page .highlight-manager .alert { padding: .75rem; margin-bottom: 1rem !important; box-shadow: none !important; }
.site-content-page .heading-row .form-control { min-width: 0; }
@media (max-width: 767.98px) {
  .site-content-page .page-tabs .nav-link { min-height: 40px; }
  .site-content-page .bilingual-grid { grid-template-columns: minmax(0, 1fr); }
  .site-content-page .field-group { padding: .75rem; }
  .site-content-page .upload-area { flex-wrap: wrap; }
  .site-content-page .upload-actions { margin-left: auto; }
  .site-content-page .image-preview-wrapper { flex-wrap: wrap; }
  .site-content-page .preview-card { max-width: 100%; }
  .site-content-page .heading-row { flex-wrap: wrap; }
  .site-content-page .heading-row .heading-text-en,
  .site-content-page .heading-row .heading-text-id { flex: 1 1 100% !important; }
  .site-content-page .section-order-item { flex-wrap: wrap; }
  .site-content-page .section-order-item > .flex-grow-1 { flex-basis: calc(100% - 80px); }
  .site-content-page .section-order-item .btn-group { margin-left: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .dash-stat-card, .mini-stat-card, .media-card, .field-group { transition: none; }
}
