/* ── PM Poshan Theme — matches mdm_app orange/white palette ─────────── */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300;400;600;700&display=swap');

:root {
  --primary:         #ED7F1B;
  --primary-dark:    #D4700F;
  --primary-light:   #FFF3E8;
  --primary-border:  rgba(237,127,27,.35);

  --sidebar-bg:      #1A2332;
  --sidebar-hover:   #243044;
  --sidebar-active:  #ED7F1B;
  --sidebar-active-text: #FFFFFF;
  --sidebar-text:    #9EAEC0;
  --sidebar-heading: rgba(158,174,192,.55);

  --topbar-bg:       #FFFFFF;
  --topbar-border:   #F0E6D7;
  --body-bg:         #FDF6EC;

  --text-dark:       #1A2332;
  --text-mid:        #6B7A8D;
  --text-muted:      #94A3B8;

  --border:          #F0E6D7;
  --card-bg:         #FFFFFF;
  --card-shadow:     0 1px 3px rgba(180,120,40,.06), 0 4px 14px rgba(180,120,40,.05);

  --success:         #27AE60;
  --danger:          #E74C3C;
  --warning:         #F59E0B;
  --info:            #3B82F6;
}

body, p, span, div, input, select, textarea, button, label, td, th, a, h1, h2, h3, h4, h5, h6, li {
  font-family: 'Source Sans 3', 'Source Sans Pro', sans-serif !important;
}

body { background: var(--body-bg) !important; color: var(--text-dark); }

/* ── Sidebar ───────────────────────────────────────────────────────────── */
.sidebar,
.sidebar.bg-gradient-primary,
ul.navbar-nav.sidebar {
  background: var(--sidebar-bg) !important;
  background-image: none !important;
  box-shadow: 2px 0 12px rgba(180,120,40,.18);
}

.sidebar-brand {
  background: #111820 !important;
  padding: 1.15rem 1rem !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.sidebar-brand-text {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: .95rem !important;
  letter-spacing: .03em;
}

.sidebar-divider {
  border-top: 1px solid rgba(255,255,255,.08) !important;
  margin: .4rem 1rem !important;
}

.sidebar-heading {
  color: var(--sidebar-heading) !important;
  font-size: .63rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  padding: .85rem 1rem .25rem !important;
}

.sidebar .nav-item {
  padding: 0 .55rem;
}

.sidebar .nav-item .nav-link {
  color: var(--sidebar-text) !important;
  font-size: .85rem !important;
  font-weight: 500;
  padding: .55rem .75rem !important;
  border-radius: 0 !important;
  transition: background .15s, color .15s;
  display: flex;
  align-items: center;
  gap: .6rem;
}

.sidebar .nav-item .nav-link:hover {
  background: var(--sidebar-hover) !important;
  color: #FFFFFF !important;
}

.sidebar .nav-item.active .nav-link,
.sidebar .nav-item .nav-link.active {
  background: var(--sidebar-active) !important;
  color: var(--sidebar-active-text) !important;
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(237,127,27,.35);
}

.sidebar .nav-item .nav-link i {
  font-size: .9rem;
  width: 1.1rem;
  text-align: center;
  opacity: .85;
}
.sidebar .nav-item.active .nav-link i,
.sidebar .nav-item .nav-link.active i {
  color: #fff;
  opacity: 1;
}

#sidebarToggle {
  background: rgba(255,255,255,.18);
  border: none !important;
  color: #fff;
  width: 2rem;
  height: 2rem;
}
#sidebarToggle:hover { background: #fff; color: var(--primary); }

/* ── Topbar ────────────────────────────────────────────────────────────── */
.topbar {
  background: var(--topbar-bg) !important;
  border-bottom: 1px solid var(--topbar-border) !important;
  box-shadow: 0 1px 3px rgba(180,120,40,.05) !important;
  height: 64px !important;
  padding: 0 1.75rem !important;
}

.topbar .navbar-nav .nav-link { color: var(--text-mid) !important; }
.topbar .navbar-nav .nav-link:hover { color: var(--primary) !important; }

.topbar-divider {
  border-right: 1px solid var(--border) !important;
  height: 2rem;
  margin: auto .9rem;
}

.topbar .dropdown-toggle::after { display: none; }

.topbar .dropdown-menu {
  border: 1px solid var(--border) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.14) !important;
  border-radius: 10px !important;
  padding: .4rem !important;
  min-width: 190px;
  background: #fff !important;
}

.topbar .dropdown-header {
  padding: .5rem .75rem .35rem !important;
  border-bottom: 1px solid var(--border) !important;
  margin-bottom: .3rem !important;
}

.topbar .dropdown-item {
  border-radius: 6px !important;
  padding: .5rem .75rem !important;
  font-size: .83rem !important;
  font-weight: 500;
  color: var(--text-dark) !important;
  display: flex;
  align-items: center;
  gap: .5rem;
}

.topbar .dropdown-item:hover {
  background: var(--primary-light) !important;
  color: var(--primary) !important;
}

.topbar .dropdown-item i { color: var(--text-mid); font-size: .8rem; }
.topbar .dropdown-item.text-danger i { color: #EF4444 !important; }

/* ── Content area ──────────────────────────────────────────────────────── */
#content-wrapper { background: var(--body-bg) !important; }

/* ── Cards ──────────────────────────────────────────────────────────────── */
.card {
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  box-shadow: var(--card-shadow) !important;
  background: var(--card-bg) !important;
}

.card-header {
  background: #FFFFFF !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 1rem 1.25rem !important;
  font-weight: 600 !important;
  font-size: .88rem !important;
  color: var(--text-dark) !important;
  border-radius: 12px 12px 0 0 !important;
}

/* stat / summary cards */
.border-left-primary { border-left: 4px solid var(--primary)  !important; }
.border-left-success { border-left: 4px solid var(--success)  !important; }
.border-left-info    { border-left: 4px solid var(--info)     !important; }
.border-left-warning { border-left: 4px solid var(--warning)  !important; }
.border-left-danger  { border-left: 4px solid var(--danger)   !important; }

.card .text-xs { font-size: .7rem !important; letter-spacing: .06em; }

/* ── Tables ──────────────────────────────────────────────────────────────── */
.table thead th,
.table thead.thead-dark th {
  background: #FAF3E8 !important;
  color: var(--text-mid) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid var(--border) !important;
  border-top: 1px solid var(--border) !important;
  border-color: var(--border) !important;
  padding: .9rem 1rem !important;
}

.table td {
  font-size: .84rem !important;
  padding: .75rem 1rem !important;
  color: var(--text-dark);
  vertical-align: middle !important;
  border-top: 1px solid var(--border) !important;
}

.table-bordered { border: 1px solid var(--border) !important; }
.table-hover tbody tr:hover { background: var(--primary-light) !important; }

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.btn-primary {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: .84rem !important;
  border-radius: 8px !important;
  letter-spacing: .02em;
  box-shadow: 0 4px 10px var(--primary-border);
  transition: background .15s, transform .1s;
}
.btn-primary:hover {
  background: var(--primary-dark) !important;
  border-color: var(--primary-dark) !important;
  transform: translateY(-1px);
}

.btn-secondary {
  background: var(--body-bg) !important;
  border-color: var(--border) !important;
  color: var(--text-dark) !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
}

.btn-success  { background: var(--success) !important; border-color: var(--success) !important; border-radius: 8px !important; }
.btn-danger   { background: var(--danger)  !important; border-color: var(--danger)  !important; border-radius: 8px !important; }
.btn-warning  { background: var(--warning) !important; border-color: var(--warning) !important; border-radius: 8px !important; color: #fff !important; }
.btn-info     { background: var(--info)    !important; border-color: var(--info)    !important; border-radius: 8px !important; color: #fff !important; }

/* ── Forms ───────────────────────────────────────────────────────────────── */
.form-control {
  border: 1.5px solid var(--border) !important;
  border-radius: 8px !important;
  font-size: .85rem !important;
  color: var(--text-dark) !important;
  padding: .5rem .85rem !important;
  background: #FFFFFF !important;
  transition: border-color .15s, box-shadow .15s;
}
.form-control:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(237,127,27,.15) !important;
}

select.form-control, .select2-container--default .select2-selection--single {
  border: 1.5px solid var(--border) !important;
  border-radius: 8px !important;
}

.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(237,127,27,.15) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--primary) !important;
}

label, .form-label, .col-form-label {
  font-size: .78rem !important;
  font-weight: 600 !important;
  color: var(--text-mid) !important;
  letter-spacing: .03em;
  text-transform: uppercase;
  margin-bottom: .3rem !important;
}

/* ── Badges / pills ──────────────────────────────────────────────────────── */
.badge-primary { background: var(--primary-light) !important; color: var(--primary)   !important; font-weight: 600; border-radius: 20px; }
.badge-success { background: #E8F8F0 !important;              color: var(--success)   !important; font-weight: 600; border-radius: 20px; }
.badge-danger  { background: #FDECEC !important;              color: var(--danger)    !important; font-weight: 600; border-radius: 20px; }
.badge-warning { background: #FEF9E7 !important;              color: var(--warning)   !important; font-weight: 600; border-radius: 20px; }
.badge-info    { background: #EFF6FF !important;              color: var(--info)      !important; font-weight: 600; border-radius: 20px; }

/* ── Page heading strip ──────────────────────────────────────────────────── */
.page-heading {
  background: #FFFFFF;
  border-radius: 12px;
  padding: 1.1rem 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid var(--border);
  box-shadow: var(--card-shadow);
  display: flex;
  align-items: center;
  gap: 1rem;
}
.page-heading .page-heading-icon {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: var(--primary-light);
  display: flex; align-items: center; justify-content: center;
}
.page-heading .page-heading-icon i { color: var(--primary); font-size: 1.1rem; }
.page-heading h1 {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--text-dark) !important;
  margin: 0 !important;
  line-height: 1.2;
}
.page-heading p {
  font-size: .78rem;
  color: var(--text-muted);
  margin: .15rem 0 0;
}

/* ── Alerts ──────────────────────────────────────────────────────────────── */
.alert {
  border: none !important;
  border-radius: 10px !important;
  font-size: .85rem !important;
}
.alert-success { background: #E8F8F0 !important; color: #1A6840 !important; }
.alert-danger  { background: #FDECEC !important; color: #9B1C1C !important; }
.alert-warning { background: #FEF9E7 !important; color: #92400E !important; }
.alert-info    { background: #EFF6FF !important; color: #1E40AF !important; }

/* ── DataTables overrides ────────────────────────────────────────────────── */

/* DataTables sets border-collapse:separate which breaks table-bordered.     */
table.dataTable.table-bordered {
  border-collapse: collapse !important;
}
table.dataTable.table-bordered thead th {
  border: 1px solid var(--border) !important;
  border-bottom: 2px solid var(--border) !important;
}
table.dataTable.table-bordered tbody tr td {
  border-top:    1px solid var(--border) !important;
  border-right:  1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
  border-left:   1px solid var(--border) !important;
}

.dataTables_wrapper .dataTables_filter input {
  border: 1.5px solid var(--border) !important;
  border-radius: 8px !important;
  padding: .3rem .75rem !important;
  font-size: .83rem !important;
  margin-left: .5rem;
}
.dataTables_wrapper .dataTables_filter input:focus {
  border-color: var(--primary) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(237,127,27,.15);
}
.dataTables_wrapper .dataTables_length select {
  border: 1.5px solid var(--border) !important;
  border-radius: 6px !important;
  padding: .25rem .5rem !important;
  font-size: .83rem !important;
}
.paginate_button.current, .paginate_button.current:hover {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
  border-radius: 6px !important;
}
.paginate_button:hover {
  background: var(--primary-light) !important;
  border-color: var(--border) !important;
  color: var(--primary) !important;
  border-radius: 6px !important;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.sticky-footer {
  background: #FFFFFF !important;
  border-top: 1px solid var(--border) !important;
  font-size: .78rem !important;
  color: var(--text-muted) !important;
  padding: .85rem 0 !important;
}

/* ── Scroll-to-top ───────────────────────────────────────────────────────── */
.scroll-to-top {
  background: var(--primary) !important;
  border-radius: 8px !important;
  width: 2.2rem; height: 2.2rem;
  display: flex; align-items: center; justify-content: center;
}

/* ── Modal ───────────────────────────────────────────────────────────────── */
.modal-content {
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.14) !important;
}
.modal-header {
  border-bottom: 1px solid var(--border) !important;
  padding: 1.1rem 1.5rem !important;
}
.modal-title { font-weight: 700 !important; font-size: .95rem !important; color: var(--text-dark) !important; }
.modal-footer { border-top: 1px solid var(--border) !important; }

/* ── Misc utilities ──────────────────────────────────────────────────────── */
.text-primary { color: var(--primary) !important; }
.bg-primary   { background: var(--primary) !important; }
.border-primary { border-color: var(--primary) !important; }
a { color: var(--primary); }
a:hover { color: var(--primary-dark); }

/* Table cells — normalize font across all columns (kills legacy <font size=1>) */
.table tbody td,
.table tbody td *:not(i):not(.fa):not([class*="fa-"]):not([class^="fas"]):not([class^="far"]):not([class^="fab"]),
table.dataTable tbody td,
table.dataTable tbody td *:not(i):not(.fa):not([class*="fa-"]):not([class^="fas"]):not([class^="far"]):not([class^="fab"]) {
  font-size: .84rem !important;
  font-family: 'Source Sans 3','Source Sans Pro',sans-serif !important;
}

/* Restore Font Awesome icons inside table cells */
.table tbody td i.fa,
.table tbody td i.fas,
.table tbody td i.far,
.table tbody td i.fab,
.table tbody td i[class*="fa-"],
table.dataTable tbody td i.fa,
table.dataTable tbody td i.fas,
table.dataTable tbody td i.far,
table.dataTable tbody td i.fab,
table.dataTable tbody td i[class*="fa-"] {
  font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands", "FontAwesome" !important;
  font-size: 1rem !important;
  font-weight: 900;
  line-height: 1;
}

/* Table cell links — orange, bold, no underline (matches reference) */
.table tbody td a,
.table tbody td a:link,
.table tbody td a:visited,
.table tbody td a font,
table.dataTable tbody td a,
table.dataTable tbody td a font {
  color: var(--primary) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.table tbody td a:hover,
.table tbody td a:hover font,
table.dataTable tbody td a:hover,
table.dataTable tbody td a:hover font {
  color: var(--primary-dark) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--primary-dark) !important;
  text-underline-offset: 2px;
}

/* DataTables "Processing…" indicator — the default bootstrap-4 theme renders
   white text on a translucent white box, which is invisible on our cream
   body background. Force a readable card-style overlay. */
.dataTables_processing,
div.dataTables_processing {
  background: #fff !important;
  color: var(--text-strong, #1A2332) !important;
  font-weight: 700;
  border: 1px solid var(--primary-border) !important;
  border-radius: 6px;
  padding: 12px 28px !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
  opacity: 1 !important;
}
