/* =====================================================================
   AlgoraTech UI/UX Enhancements
   - Typography: Tajawal everywhere (icons preserved)
   - Soft, consistent border-radius across components
   Loaded LAST so it cleanly overrides theme + bootstrap styles.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800;900&display=swap');

:root {
    --ui-radius-xs: 6px;
    --ui-radius-sm: 8px;
    --ui-radius: 10px;
    --ui-radius-md: 12px;
    --ui-radius-lg: 16px;
    --ui-font: 'Tajawal', 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* ----------------------------- Typography ---------------------------- */
/* Apply Tajawal to text while preserving icon fonts (<i> + icon classes). */
body,
body :not(i):not(span[class*="fa-"]):not([class*="fa-"]):not([class*="fi-"]):not([class^="fi"]):not([class*="flaticon"]):not([class*="material-icons"]):not([class*="icon-set"]):not([class*="uil-"]):not([class*="uim-"]):not([class*="bi-"]):not([class*="las"]):not([class*="lab"]):not([class*="lar"]) {
    font-family: var(--ui-font) !important;
}

body {
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0;
}

h1, .h1, h2, .h2 { font-weight: 700 !important; }
h3, .h3, h4, .h4 { font-weight: 700 !important; }
h5, .h5, h6, .h6 { font-weight: 600 !important; }
.title, .page-title, .section-title, .card-title, .modal-title { font-weight: 700 !important; }
.fw-bold, b, strong { font-weight: 700 !important; }
.fw-semibold, .fw-medium { font-weight: 600 !important; }
p, .text-muted, small, .form-control, label, td, li { font-weight: 400; }

/* keep icon glyphs on their own fonts no matter what */
i, .fa, .fas, .far, .fab, .fal, [class^="fi-"], [class*=" fi-"],
.material-icons, .material-icons-outlined, [class*="flaticon"] {
    font-family: revert !important;
}

/* --------------------------- Border radius --------------------------- */
/* Buttons */
.btn, button.btn, .btn-group > .btn, [type="button"].btn,
input[type="submit"], input[type="button"], .btn-outline-primary,
.tagify, .swal2-styled {
    border-radius: var(--ui-radius-sm) !important;
}
.rounded-pill, .btn.rounded-circle { border-radius: 50rem !important; }

/* Inputs */
.form-control, .form-select, textarea, select.form-control,
input.form-control, .form-control-lg, .form-control-sm,
.input-group > .form-control, .select2-container .select2-selection,
.bootstrap-tagsinput, .dataTables_filter input, .nice-select {
    border-radius: var(--ui-radius-sm) !important;
}
.input-group .form-control:not(:last-child) { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.input-group .form-control:not(:first-child) { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
.input-group-text:first-child { border-top-left-radius: var(--ui-radius-sm) !important; border-bottom-left-radius: var(--ui-radius-sm) !important; }
.input-group-text:last-child { border-top-right-radius: var(--ui-radius-sm) !important; border-bottom-right-radius: var(--ui-radius-sm) !important; }

/* Cards & panels */
.card, .card.shadow, .box, .panel, .widget, .product-single-thumbnail,
.dashboard-card, .info-card, .stats-card {
    border-radius: var(--ui-radius-md) !important;
}
.card-img-top, .card-img { border-top-left-radius: var(--ui-radius-md) !important; border-top-right-radius: var(--ui-radius-md) !important; }
.card-header { border-top-left-radius: var(--ui-radius-md) !important; border-top-right-radius: var(--ui-radius-md) !important; }
.card-footer { border-bottom-left-radius: var(--ui-radius-md) !important; border-bottom-right-radius: var(--ui-radius-md) !important; }

/* Modals (no overflow:hidden so long content can still scroll) */
.modal-content { border-radius: var(--ui-radius-lg) !important; }
.swal2-popup, .toast, .modal-dialog .modal-content { border-radius: var(--ui-radius-lg) !important; }

/* Dropdowns (keep native scrolling) */
.dropdown-menu, .select2-dropdown, .nice-select .list, .tt-menu {
    border-radius: var(--ui-radius-md) !important;
}
.dropdown-item:first-child { border-top-left-radius: var(--ui-radius-md); border-top-right-radius: var(--ui-radius-md); }
.dropdown-item:last-child { border-bottom-left-radius: var(--ui-radius-md); border-bottom-right-radius: var(--ui-radius-md); }

/* Misc components */
.badge { border-radius: var(--ui-radius-xs) !important; }
.alert, .toast, .toast-message, #toast-container > div { border-radius: var(--ui-radius) !important; }
.nav-pills .nav-link, .nav-tabs .nav-link { border-radius: var(--ui-radius-sm) !important; }
.pagination .page-link { border-radius: var(--ui-radius-xs) !important; margin: 0 2px; }
.progress { border-radius: 50rem !important; }
.img-thumbnail, .avatar, .rounded { border-radius: var(--ui-radius-sm) !important; }
.list-group, .list-group-item:first-child { border-top-left-radius: var(--ui-radius); border-top-right-radius: var(--ui-radius); }
.list-group-item:last-child { border-bottom-left-radius: var(--ui-radius); border-bottom-right-radius: var(--ui-radius); }

/* Subtle, modern shadow consistency for cards */
.card { border: 0; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); }

/* Smooth interactions */
.btn, .card, .form-control, .dropdown-menu, .nav-link { transition: all .2s ease-in-out; }
