/* Shared presentation layer for both admin themes. No component behavior lives here. */
:root {
  --school-radius-sm: .625rem;
  --school-radius: .875rem;
  --school-radius-lg: 1.125rem;
  --school-shadow-sm: 0 .125rem .5rem rgba(30, 41, 59, .055);
  --school-shadow: 0 .5rem 1.5rem rgba(30, 41, 59, .075);
  --school-border: rgba(99, 115, 129, .16);
  --school-surface: var(--bs-body-bg, #fff);
  --school-muted-surface: rgba(99, 115, 129, .045);
  --school-focus: rgba(var(--bs-primary-rgb, 105, 108, 255), .18);
}

html { scroll-behavior: smooth; }

body {
  background-color: var(--bs-body-bg, #f7f7f9);
  font-family: IRANSans, system-ui, -apple-system, "Segoe UI", sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img, svg, video, canvas { max-width: 100%; }

.content-wrapper,
.main-content,
.app-content { min-width: 0; }

.container-p-y { padding-block: clamp(1rem, 2.5vw, 1.75rem) !important; }

.card {
  border-color: var(--school-border);
  border-radius: var(--school-radius-lg);
  box-shadow: var(--school-shadow-sm);
}

.card-header {
  border-bottom-color: var(--school-border);
  padding: clamp(.9rem, 2vw, 1.25rem);
}

.card-body { padding: clamp(1rem, 2.4vw, 1.5rem); }

.card-title, h1, h2, h3, h4, h5, h6 {
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.btn {
  min-height: 2.45rem;
  border-radius: var(--school-radius-sm);
  font-weight: 600;
  white-space: normal;
}

.btn-sm { min-height: 2rem; }
.btn-icon { display: inline-flex; align-items: center; justify-content: center; }

.form-control,
.form-select,
.select2-container .select2-selection,
.tagify {
  min-height: 2.75rem;
  border-color: var(--school-border);
  border-radius: var(--school-radius-sm);
}

.form-control:focus,
.form-select:focus,
.select2-container--focus .select2-selection,
.tagify--focus {
  border-color: var(--bs-primary, #696cff);
  box-shadow: 0 0 0 .2rem var(--school-focus);
}

.form-label { margin-bottom: .45rem; font-weight: 600; }
.form-text, small, .text-muted { line-height: 1.65; }

.alert {
  border: 0;
  border-radius: var(--school-radius);
}

.modal-content {
  border: 0;
  border-radius: var(--school-radius-lg);
  box-shadow: 0 1.25rem 3rem rgba(30, 41, 59, .18);
}

.modal-header, .modal-footer { padding: 1rem 1.25rem; }
.modal-body { padding: 1.25rem; }
.modal-footer { gap: .5rem; }

.table-responsive,
.dataTables_wrapper {
  width: 100%;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}

.dataTables_wrapper { overflow-x: auto; padding-bottom: .25rem; }
.dataTables_wrapper > .row { min-width: 0; margin-inline: 0; }

.table {
  margin-bottom: 0;
  vertical-align: middle;
}

.table > :not(caption) > * > * {
  padding: .75rem;
  border-bottom-color: var(--school-border);
}

.table thead th {
  background: var(--school-muted-surface);
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
}

.table tbody tr { transition: background-color .15s ease; }
.table tbody tr:hover { background-color: var(--school-muted-surface); }

.dataTables_filter input,
.dataTables_length select { margin-block: .25rem; }

.pagination { flex-wrap: wrap; gap: .25rem; }
.page-link { border-radius: .5rem !important; }

.dropdown-menu {
  max-width: min(22rem, calc(100vw - 1.5rem));
  border-color: var(--school-border);
  border-radius: var(--school-radius);
  box-shadow: var(--school-shadow);
}

.list-group-item { border-color: var(--school-border); }
.badge { line-height: 1.35; }

/* Keep rich editors and formula fields inside their viewport. */
.ql-toolbar, .ql-container, math-field { max-width: 100%; }
.ql-toolbar { overflow-x: auto; }
math-field { min-width: 0 !important; }

/* RTL-friendly action groups should wrap instead of widening the page. */
.d-flex { min-width: 0; }
.card-header.d-flex,
.modal-footer,
.d-flex.gap-1,
.d-flex.gap-2,
.d-flex.gap-3 { flex-wrap: wrap; }

@media (max-width: 991.98px) {
  .container,
  .container-fluid,
  .container-xxl { max-width: 100%; padding-inline: 1rem; }

  .layout-navbar { margin-inline: 1rem !important; }
  .modal-dialog { max-width: calc(100% - 1.5rem); margin-inline: auto; }

  .dataTables_wrapper .row > [class*="col-"] {
    width: 100%;
    margin-bottom: .5rem;
    text-align: initial !important;
  }
}

@media (max-width: 767.98px) {
  :root { --school-radius-lg: .9rem; }

  body { font-size: .875rem; }
  .container-p-y { padding-top: .9rem !important; padding-bottom: 1.25rem !important; }
  .container, .container-fluid, .container-xxl { padding-inline: .75rem; }
  .layout-navbar { margin-inline: .75rem !important; }

  .card-header, .card-body { padding: .9rem; }
  .card-header.d-flex { align-items: stretch !important; }
  .card-header.d-flex > :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) { max-width: 100%; }

  h1, .h1 { font-size: 1.55rem; }
  h2, .h2 { font-size: 1.35rem; }
  h3, .h3 { font-size: 1.2rem; }
  h4, .h4, h5, .h5 { font-size: 1rem; }

  .row { --bs-gutter-x: 1rem; }
  .modal-dialog { width: auto; max-width: calc(100% - 1rem); margin: .5rem; }
  .modal-body { padding: 1rem; }
  .modal-footer { padding: .85rem 1rem; }

  .modal-footer .btn { flex: 1 1 8rem; }
  .table > :not(caption) > * > * { padding: .65rem .6rem; }

  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_length { width: 100%; }

  .dataTables_wrapper .dataTables_filter input,
  .dataTables_wrapper .dataTables_length select { max-width: 100%; }

  .dataTables_wrapper .dataTables_filter input {
    width: 100% !important;
    margin-inline: 0 !important;
  }

  .navbar-search-suggestion { width: 100vw !important; max-width: 100vw; }
  .dropdown-menu { max-width: calc(100vw - 1rem); }
}

@media (max-width: 575.98px) {
  .btn:not(.btn-icon):not(.dropdown-toggle) { max-width: 100%; }
  .modal-footer { flex-direction: column-reverse; }
  .modal-footer .btn { width: 100%; flex-basis: auto; }

  .card-header .d-flex,
  .card-body > .d-flex:first-child { align-items: stretch !important; }

  .card-header .d-flex > .btn,
  .card-header > .btn,
  .card-body > .d-flex:first-child > .btn { width: 100%; }

  .form-check-inline { margin-bottom: .5rem; }
  .swal2-popup { width: calc(100% - 1rem) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
