/* Done web theme — loaded after Bootstrap; typeface + Bootstrap palette + Done shapes */
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 300; font-display: swap; src: url('/fonts/Almarai-Light.ttf') format('truetype'); }
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/Almarai-Regular.ttf') format('truetype'); }
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/Almarai-Bold.ttf') format('truetype'); }
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 800; font-display: swap; src: url('/fonts/Almarai-ExtraBold.ttf') format('truetype'); }
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 900; font-display: swap; src: url('/fonts/Almarai-ExtraBold.ttf') format('truetype'); }
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/Almarai-Bold.ttf') format('truetype'); }
@font-face { font-family: 'Almarai'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/Almarai-Regular.ttf') format('truetype'); }

:root {
  --bs-font-sans-serif: 'Almarai', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-body-font-family: 'Almarai', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-body-color: #1F2430;
  --bs-primary: #FED12A; --bs-primary-rgb: 254, 209, 42;
  --bs-link-color: #1F2430; --bs-link-hover-color: #B98900;
  --bs-link-color-rgb: 31, 36, 48; --bs-link-hover-color-rgb: 185, 137, 0;
  --bs-border-radius: .75rem; --bs-border-radius-lg: .9rem; --bs-border-radius-xl: 1rem;
  --dn-yellow: #FED12A; --dn-yellow-deep: #F2B705; --dn-yellow-soft: #FFF6D9; --dn-ink: #1F2430; --dn-ink-2: #2A3040;
  --dn-muted: #6B7280; --dn-line: #E9EAEE; --dn-bg: #F6F6F1;
}
html, body, .swal2-container, .swal2-popup, .tooltip, .popover, .dropdown-menu, .modal, .offcanvas, button, input, select, textarea {
  font-family: 'Almarai', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}
::selection { background: #FED12A; color: #1F2430; }

/* Bootstrap primary = Done yellow with ink text (Hala Go left Bootstrap's blue in a few spots) */
.btn-primary { --bs-btn-bg: #FED12A; --bs-btn-border-color: #F2B705; --bs-btn-color: #1F2430; --bs-btn-hover-bg: #F2B705; --bs-btn-hover-border-color: #E0A800; --bs-btn-hover-color: #1F2430; --bs-btn-active-bg: #E0A800; --bs-btn-active-border-color: #CC9900; --bs-btn-active-color: #1F2430; --bs-btn-disabled-bg: #FED12A; --bs-btn-disabled-border-color: #F2B705; --bs-btn-disabled-color: #1F2430; --bs-btn-focus-shadow-rgb: 242, 183, 5; }
.btn-outline-primary { --bs-btn-color: #1F2430; --bs-btn-border-color: #F2B705; --bs-btn-hover-bg: #FED12A; --bs-btn-hover-border-color: #F2B705; --bs-btn-hover-color: #1F2430; --bs-btn-active-bg: #F2B705; --bs-btn-active-border-color: #E0A800; --bs-btn-active-color: #1F2430; --bs-btn-focus-shadow-rgb: 242, 183, 5; }
.btn-dark { --bs-btn-bg: #1F2430; --bs-btn-border-color: #1F2430; --bs-btn-color: #FED12A; --bs-btn-hover-bg: #2A3040; --bs-btn-hover-border-color: #2A3040; --bs-btn-hover-color: #FFE066; --bs-btn-active-bg: #141821; --bs-btn-active-border-color: #141821; --bs-btn-active-color: #FFE066; --bs-btn-disabled-bg: #1F2430; --bs-btn-disabled-border-color: #1F2430; --bs-btn-disabled-color: #FED12A; }
.btn-outline-dark { --bs-btn-color: #1F2430; --bs-btn-border-color: #1F2430; --bs-btn-hover-bg: #1F2430; --bs-btn-hover-color: #FED12A; --bs-btn-active-bg: #1F2430; --bs-btn-active-color: #FED12A; }
.text-primary { color: #B98900 !important; }
.bg-primary { background-color: #FED12A !important; color: #1F2430 !important; }
.border-primary { border-color: #F2B705 !important; }
.spinner-border.text-primary, .spinner-grow.text-primary { color: #F2B705 !important; }
.progress-bar { background-color: #FED12A; color: #1F2430; }
.form-control:focus, .form-select:focus { border-color: #F2B705; box-shadow: 0 0 0 .25rem rgba(254, 209, 42, .32); }
.form-check-input:checked { background-color: #1F2430; border-color: #1F2430; }
.form-check-input:focus { border-color: #F2B705; box-shadow: 0 0 0 .25rem rgba(254, 209, 42, .32); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: #FED12A; color: #1F2430; }
.page-link { color: #1F2430; } .page-item.active .page-link { background-color: #1F2430; border-color: #1F2430; color: #FED12A; }
.dropdown-item.active, .dropdown-item:active { background-color: #FED12A; color: #1F2430; }
.list-group-item.active { background-color: #FED12A; border-color: #F2B705; color: #1F2430; }

/* Done shapes: soft rectangles instead of pills, hairline cards instead of floating shadows */
.btn.rounded-pill { border-radius: 12px !important; }
.badge.rounded-pill { border-radius: 8px !important; }
.rounded-4 { border-radius: 14px !important; }
.rounded-5 { border-radius: 20px !important; }
.shadow-sm { box-shadow: 0 1px 2px rgba(31, 36, 48, .05) !important; }
.shadow { box-shadow: 0 8px 24px rgba(31, 36, 48, .08) !important; }
.shadow-lg { box-shadow: 0 16px 40px rgba(31, 36, 48, .12) !important; }
.bg-white.rounded-4, .card { border: 1px solid #ECECE6; }
.card { border-radius: 14px; }
.modal-content { border-radius: 18px; border: 0; }
.table > thead > tr > th { background: #F6F6F1; color: #1F2430; font-weight: 800; font-size: .84rem; border-bottom: 2px solid #FED12A; }
.table > :not(caption) > * > * { border-bottom-color: #EEEEE8; }
.swal2-popup { border-radius: 20px !important; }
.swal2-confirm { background: #1F2430 !important; color: #FED12A !important; border-radius: 12px !important; box-shadow: none !important; }
.swal2-cancel { border-radius: 12px !important; }
.swal2-styled.swal2-confirm:focus { box-shadow: 0 0 0 3px rgba(254, 209, 42, .5) !important; }

/* Done icons: Bootstrap Icons on one warm tint with ink glyphs (Hala Go used emoji in rainbow pastel boxes) */
.bi { line-height: 1; }
.kpi-icon, .ac-icon, .stat-icon, .qa-icon, .action-icon, .feature-icon, .menu-icon, .card-icon, .tile-icon, .info-icon, .svc-icon {
  background: #FFF6D9 !important; color: #1F2430 !important; border-radius: 14px !important; box-shadow: none !important;
}
.kpi-icon { font-size: 1.35rem !important; }
.ac-icon { font-size: 1.55rem !important; border-radius: 16px !important; }
.action-card:hover .ac-icon, .quick-card:hover .qa-icon { transform: none !important; background: #FED12A !important; }
.action-card:hover .ac-title { color: #1F2430 !important; }
.action-card::before { background: #FED12A !important; }