@charset "UTF-8";

/* =================================================
   Maken Color System
   ================================================= */

:root {
    /* الخلفيات */
    --app-bg: #f9f9f9;
    --surface: #ffffff;

    /* النصوص */
    --text-main: #333333;
    --text-muted: #6b7280;

    /* اللون الأساسي للنظام */
    --primary: #cc4a4f;
    --primary-hover: #b53f44;
    --primary-rgb: 204, 74, 79;

    /* الحدود */
    --border: rgba(0, 0, 0, 0.08);
    --border-strong: rgba(0, 0, 0, 0.12);

    /* Bootstrap Override */
    --bs-primary: #cc4a4f;
    --bs-primary-rgb: 204, 74, 79;

    --bs-body-bg: #f9f9f9;
    --bs-body-bg-rgb: 249, 249, 249;

    --bs-link-color: #cc4a4f;
    --bs-link-hover-color: #b53f44;

    --bs-border-color: rgba(0, 0, 0, 0.08);
}

/* =================================================
   Base
   ================================================= */

html,
body {
    background: var(--app-bg);
    color: var(--text-main);
}

/* =================================================
   Links
   ================================================= */

.link-primary-custom {
    color: #cc4a4f !important;
}

.link-primary-custom:hover,
.link-primary-custom:focus {
    color: #b53f44 !important;
}

.text-muted {
    color: var(--text-muted) !important;
}

p,
li,
span,
.small-text,
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6,
.big-title {
    color: var(--text-main);
}

a:not(.link-purple):not(.link-pink):not(.link-teal):not([class*="badge-ink"]) {
    color: #cc4a4f ;
}

a:not(.link-purple):not(.link-pink):not(.link-teal):not(
        [class*="badge-ink"]
    ):hover {
    color: #b53f44 ;
}

.fill-primary {
    fill: #cc4a4f !important;
}

.text-muted {
    color: var(--text-muted) !important;
}

a.text-muted:hover,
a.text-muted:focus {
    color: var(--text-main) !important;
}

.footer.bg-light {
    background-color: #e0e2e6 !important;
    color: #a1acb8 !important;
}

.btn {
    font-weight: 500;
}

/* =================================================
   btn-primary
   ================================================= */

.btn-primary {
    background-color: #cc4a4f !important;
    border-color: #cc4a4f !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #b53f44 !important;
    border-color: #b53f44 !important;
    color: #ffffff !important;
}

.btn-outline-primary {
    color: #cc4a4f !important;
    border-color: #cc4a4f !important;
    background-color: transparent !important;
}

/* عند مرور المؤشر فقط — بدون تعبئة */
.btn-outline-primary:hover {
    color: #cc4a4f !important;
    border-color: #cc4a4f !important;
    background-color: transparent !important;
}

/* عند الضغط الحقيقي */
.btn-check:checked + .btn-outline-primary,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-outline-primary:focus {
    background-color: #cc4a4f !important;
    border-color: #cc4a4f !important;
    color: #ffffff !important;
}
/* =================================================
   btn-secondary
   ================================================= */
.btn-outline-secondary {
    color: #a7a5a5 !important;
    border-color: #d1d5db !important;
    background-color: #ffffff !important;
}

.btn-outline-secondary:hover {
    color: #333333 !important;
    border-color: #333333 !important;
    background-color: #ececec !important;
}

/* =================================================
   btn-secondary
   ================================================= */
.btn-dark {
    color: #c2c1c1 !important;
}

.btn-dark:hover,
.btn-dark:focus {
    color: #ffffff !important;
    border-color: #000000 !important;
}
a.btn-outline-dark,
.btn-outline-dark {
    color: #212529 !important;
    border-color: #212529 !important;
    background-color: transparent !important;
}

a.btn-outline-dark:hover,
a.btn-outline-dark:focus,
.btn-outline-dark:hover,
.btn-outline-dark:focus {
    color: #ffffff !important;
    background-color: #212529 !important;
    border-color: #212529 !important;
}
/* =================================================
   text
   ================================================= */

.text-primary {
    color: #cc4a4f !important;
}
/* =================================================
   Forms
   ================================================= */

.form-control:focus,
.form-select:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 0.15rem rgba(var(--primary-rgb), 0.2) !important;
}

/* =================================================
   Menu Active
   ================================================= */

.layout-menu .menu-item.active > .menu-link {
    color: var(--primary) !important;
    background: rgba(var(--primary-rgb), 0.08) !important;
}

/* =================================================
   Tables
   ================================================= */

.table {
    color: var(--text-main);
    border-color: var(--border);
}
.table {
    --bs-table-striped-color: var(--text-main);
    --bs-table-striped-bg: #f9fafb;
    --bs-table-active-color: var(--text-main);
    --bs-table-active-bg: rgba(67, 89, 113, 0.1);
    --bs-table-hover-color: var(--text-main);
    --bs-table-hover-bg: rgba(67, 89, 113, 0.06);
    color: var(--text-main);
    border-color: var(--border);
}
/* =================================================
   Alerts
   ================================================= */

.alert-primary {
    background: rgba(var(--primary-rgb), 0.08);
    border-color: rgba(var(--primary-rgb), 0.2);
    color: #1f3f8a;
}

/* =================================================
   Badges
   ================================================= */

.badge.bg-primary {
    background-color: #cc4a4f !important;
}

/* الفوكس */
.form-control:focus,
.form-select:focus {
    border-color: #cc4a4f !important;
    box-shadow: 0 0 0 0.15rem rgba(204, 74, 79, 0.2) !important;
}

/* =================================================
   Link Variants: Neutral gray → Color on hover/focus
   الكل رمادي بالحالة الطبيعية، اللون يظهر عند التأشير فقط
   ================================================= */

:root {
    --link-neutral-color: #3b3b34;
    --link-purple: #7c3aed;
    --link-pink: #cc4a4f;
    --link-teal: #0d9488;
}

/* --- Base مشترك --- */
a.link-purple,
a.link-pink,
a.link-teal {
    color: var(--link-neutral-color) !important;
    text-decoration: none !important;
    transition: color 0.18s ease;
}

/* ─── Purple ─── */
a.link-purple:hover,
a.link-purple:focus {
    color: var(--link-purple) !important;
    text-decoration: underline !important;
    text-decoration-color: var(--link-purple) !important;
    text-underline-offset: 3px;
}

/* ─── Pink (= brand primary + underline) ─── */
a.link-pink:hover,
a.link-pink:focus {
    color: var(--link-pink) !important;
    text-decoration: underline !important;
    text-decoration-color: var(--link-pink) !important;
    text-underline-offset: 3px;
}

/* ─── Teal ─── */
a.link-teal:hover,
a.link-teal:focus {
    color: var(--link-teal) !important;
    text-decoration: underline !important;
    text-decoration-color: var(--link-teal) !important;
    text-underline-offset: 3px;
}

/* --- disabled مشترك --- */
a.link-purple.disabled,
a.link-pink.disabled,
a.link-teal.disabled {
    color: #d1d5db !important;
    pointer-events: none;
    text-decoration: none !important;
}

/* =================================================
   Link Variants - Solid (Active by default)
   اللون ظاهر دائمًا بدون رمادي
   ================================================= */

a.link-purple-solid,
a.link-pink-solid,
a.link-teal-solid {
    text-decoration: none !important;
    transition:
        color 0.18s ease,
        text-decoration-color 0.18s ease;
}

/* ─── Purple Solid ─── */
a.link-purple-solid {
    color: var(--link-purple) !important;
}
a.link-purple-solid:hover,
a.link-purple-solid:focus {
    color: #6d28d9 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

/* ─── Pink Solid ─── */
a.link-pink-solid {
    color: var(--link-pink) !important;
}
a.link-pink-solid:hover,
a.link-pink-solid:focus {
    color: #b53f44 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

/* ─── Teal Solid ─── */
a.link-teal-solid {
    color: var(--link-teal) !important;
}
a.link-teal-solid:hover,
a.link-teal-solid:focus {
    color: #0f766e !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

/* Disabled (مشترك) */
a.link-purple-solid.disabled,
a.link-pink-solid.disabled,
a.link-teal-solid.disabled {
    color: #d1d5db !important;
    pointer-events: none;
    text-decoration: none !important;
}