/* App-wide tweaks. Colours come from Bootstrap CSS variables so every theme mode follows automatically. */
.sidebar-brand .brand-image { max-height: 34px; width: auto; margin-right: .5rem; }
.login-box { width: 380px; max-width: 92vw; margin: 8vh auto 0; }
.table > :not(caption) > * > * { vertical-align: middle; }
/* Validation summary is rendered even when valid; hide it until there are errors. */
.validation-summary-valid { display: none !important; }
.alert.validation-summary-errors ul { margin-bottom: 0; padding-left: 1.2rem; }
.text-end-num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---- Select2 (bootstrap-5 theme) in dark mode ---- */
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection { background-color: var(--bs-body-bg); border-color: var(--bs-border-color); color: var(--bs-body-color); }
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered { color: var(--bs-body-color); }
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-dropdown { background-color: var(--bs-body-bg); border-color: var(--bs-border-color); color: var(--bs-body-color); }
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-search__field { background-color: var(--bs-body-bg); color: var(--bs-body-color); border-color: var(--bs-border-color); }
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-results__option--highlighted { background-color: var(--bs-primary); color: #fff; }
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) { background-color: var(--bs-tertiary-bg); }
.select2-container { z-index: 1056; }
.select2-container--bootstrap-5 .select2-dropdown { z-index: 2000; }

/* ---- Flatpickr in dark mode ---- */
[data-bs-theme="dark"] .flatpickr-calendar { background: var(--bs-body-bg); color: var(--bs-body-color); box-shadow: 0 0 0 1px var(--bs-border-color), 0 .5rem 1rem rgba(0,0,0,.5); }
[data-bs-theme="dark"] .flatpickr-calendar.arrowTop:before, [data-bs-theme="dark"] .flatpickr-calendar.arrowTop:after { border-bottom-color: var(--bs-body-bg); }
[data-bs-theme="dark"] .flatpickr-months .flatpickr-month,
[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months,
[data-bs-theme="dark"] .flatpickr-current-month input.cur-year,
[data-bs-theme="dark"] span.flatpickr-weekday { background: transparent; color: var(--bs-body-color); fill: var(--bs-body-color); }
[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months option { background: var(--bs-body-bg); }
[data-bs-theme="dark"] .flatpickr-months .flatpickr-prev-month, [data-bs-theme="dark"] .flatpickr-months .flatpickr-next-month { fill: var(--bs-body-color); color: var(--bs-body-color); }
[data-bs-theme="dark"] .flatpickr-day { color: var(--bs-body-color); }
[data-bs-theme="dark"] .flatpickr-day.prevMonthDay, [data-bs-theme="dark"] .flatpickr-day.nextMonthDay, [data-bs-theme="dark"] .flatpickr-day.flatpickr-disabled { color: var(--bs-secondary-color); }
[data-bs-theme="dark"] .flatpickr-day:hover { background: var(--bs-tertiary-bg); border-color: var(--bs-tertiary-bg); }
[data-bs-theme="dark"] .flatpickr-day.today { border-color: var(--bs-primary); }
[data-bs-theme="dark"] .flatpickr-day.selected, [data-bs-theme="dark"] .flatpickr-day.startRange, [data-bs-theme="dark"] .flatpickr-day.endRange { background: var(--bs-primary); border-color: var(--bs-primary); color: #fff; }
[data-bs-theme="dark"] .flatpickr-day.inRange { background: var(--bs-tertiary-bg); border-color: var(--bs-tertiary-bg); box-shadow: -5px 0 0 var(--bs-tertiary-bg), 5px 0 0 var(--bs-tertiary-bg); }
[data-bs-theme="dark"] .flatpickr-time input, [data-bs-theme="dark"] .flatpickr-time .flatpickr-am-pm { color: var(--bs-body-color); background: transparent; }
[data-bs-theme="dark"] .flatpickr-time { border-top-color: var(--bs-border-color); }

/* ---- DataTables in dark mode ---- */
[data-bs-theme="dark"] table.dataTable > tbody > tr { --bs-table-bg: transparent; }
[data-bs-theme="dark"] .dt-container .form-select, [data-bs-theme="dark"] .dt-container .form-control { background-color: var(--bs-body-bg); color: var(--bs-body-color); }

/* ---- Quieter, smaller type (everything scales from the root size) ---- */
html { font-size: 13.5px; }
body { font-weight: 400; letter-spacing: 0; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 600; }
.app-content-header h3 { font-size: 1.25rem; }
.card-title { font-size: 1rem; font-weight: 600; }
.card-header, .card-footer { padding: .6rem 1rem; }
.card-body { padding: 1rem; }
.form-label { font-size: .85rem; font-weight: 500; margin-bottom: .25rem; color: var(--bs-secondary-color); }
.form-text, .small, small { font-size: .78rem; }
.form-control, .form-select, .btn { font-size: .9rem; }
.btn-sm { font-size: .8rem; }
.table { font-size: .87rem; }
.table > thead > tr > th { font-size: .78rem; font-weight: 600; text-transform: none; color: var(--bs-secondary-color); white-space: nowrap; }
.table > :not(caption) > * > * { padding: .4rem .6rem; }
.table-sm > :not(caption) > * > * { padding: .25rem .5rem; }
.badge { font-weight: 500; font-size: .72rem; }
.app-sidebar .nav-link p, .app-sidebar .sidebar-brand .brand-text { font-size: .9rem; }
.app-sidebar .nav-treeview .nav-link p { font-size: .86rem; }
.select2-container--bootstrap-5 .select2-selection { font-size: .9rem; }
.select2-container--bootstrap-5 .select2-dropdown { font-size: .9rem; }
.dt-container, div.dt-container .dt-search input, div.dt-container .dt-length select { font-size: .85rem; }
.app-footer { font-size: .8rem; }
strong, b { font-weight: 600; }

/* Saudi Riyal sign (U+20C1) as a vector mask, so it takes the text colour in every theme and needs no font support */
.cur-sym { display:inline-block; width:.62em; height:.95em; vertical-align:-.12em; background-color:currentColor; -webkit-mask:url(/img/saudi-riyal.svg) no-repeat center / contain; mask:url(/img/saudi-riyal.svg) no-repeat center / contain; }
