:root {
    --primary-50:  #eef3f6;
    --primary-100: #d5e1e8;
    --primary-200: #aec5d1;
    --primary-300: #7fa3b6;
    --primary-400: #4f7d97;
    --primary-500: #2a5a73;
    --primary:     #1e475d;
    --primary-600: #1e475d;
    --primary-700: #183a4c;
    --primary-800: #132e3c;
    --primary-900: #0e222d;
    --primary-rgb: 30, 71, 93;
    --primary-on:   #ffffff;
    --primary-text: #1e475d;

    --background: #ffffff;
    --foreground: #0f172a;
    --canvas:     #f4f6f8;

    --card: #ffffff;
    --card-foreground: #0f172a;

    --popover: #ffffff;
    --popover-foreground: #0f172a;

    --primary-foreground: var(--primary-on);
    --primary-fg: var(--primary-on);
    --primary-hover: var(--primary-700);

    --sh-secondary: #f1f5f7;
    --sh-secondary-foreground: #17222c;

    --muted: #f4f6f8;
    --muted-foreground: #6b7785;
    --muted-fg: #6b7785;

    --accent: #eef3f6;
    --accent-foreground: #17222c;

    --destructive: #dc2626;
    --destructive-foreground: #ffffff;
    --destructive-muted: #fef2f2;
    --destructive-border: #fecaca;

    --success: #15803d;
    --success-foreground: #ffffff;
    --success-muted: #f0fdf4;
    --success-border: #bbf7d0;

    --warning: #b45309;
    --warning-foreground: #ffffff;
    --warning-muted: #fffbeb;
    --warning-border: #fde68a;

    --info: #0369a1;
    --info-foreground: #ffffff;
    --info-muted: #f0f9ff;
    --info-border: #bae6fd;

    --border: #e3e8ec;
    --border-strong: #cbd4db;
    --input: #e3e8ec;
    --ring: rgba(var(--primary-rgb), .30);

    --field-bg: var(--card);
    --field-bg-disabled: var(--muted);
    --field-color: var(--foreground);
    --field-placeholder: var(--muted-foreground);
    --field-border-color: var(--border);
    --field-border-color-hover: var(--border-strong);
    --field-border-color-focus: var(--primary);
    --field-ring-focus: 0 0 0 3px var(--ring);
    --field-radius: .5rem;

    --radius: 0.75rem;
    --sh-radius-xs: calc(var(--radius) - 6px);
    --sh-radius-sm: calc(var(--radius) - 4px);
    --sh-radius-md: calc(var(--radius) - 2px);
    --sh-radius-lg: var(--radius);
    --sh-radius-xl: calc(var(--radius) + 4px);

    --sh-shadow-xs: 0 1px 2px 0 rgb(15 23 42 / .05);
    --sh-shadow-sm: 0 1px 3px 0 rgb(15 23 42 / .07), 0 1px 2px -1px rgb(15 23 42 / .07);
    --sh-shadow-md: 0 4px 6px -1px rgb(15 23 42 / .08), 0 2px 4px -2px rgb(15 23 42 / .06);
    --sh-shadow-lg: 0 10px 15px -3px rgb(15 23 42 / .08), 0 4px 6px -4px rgb(15 23 42 / .06);
    --sh-shadow-xl: 0 20px 25px -5px rgb(15 23 42 / .10), 0 8px 10px -6px rgb(15 23 42 / .07);

    --accent-purple: #6d28d9;
    --accent-purple-muted: #f5f3ff;
    --accent-purple-border: #ddd6fe;
    --accent-indigo: #4338ca;
    --accent-indigo-muted: #eef2ff;
    --accent-indigo-border: #c7d2fe;
    --accent-blue: #1d4ed8;
    --accent-blue-muted: #eff6ff;
    --accent-blue-border: #bfdbfe;
    --accent-orange: #c2410c;
    --accent-orange-muted: #fff7ed;
    --accent-orange-border: #fed7aa;
    --accent-pink: #be185d;
    --accent-pink-muted: #fdf2f8;
    --accent-pink-border: #fbcfe8;
    --accent-teal: #0f766e;
    --accent-teal-muted: #f0fdfa;
    --accent-teal-border: #99f6e4;

    --primary-deep-800: var(--primary-800);
    --primary-deep-700: var(--primary-700);
    --primary-deep-600: var(--primary-600);

    --ui-wash-hover:  rgba(15, 23, 42, .04);
    --ui-wash-active: rgba(15, 23, 42, .07);
    --ui-scrim-rgb: 255, 255, 255;

    --ui-btn-h: 2.25rem;
    --ui-btn-ease: cubic-bezier(.4, 0, .2, 1);
    --ui-btn-shadow: var(--sh-shadow-xs);

    --sh-ease: cubic-bezier(.4, 0, .2, 1);
    --sh-duration: 160ms;

    --font-text: 'Cairo', 'Tajawal', sans-serif;
    --font-heading: 'Cairo', sans-serif;
    --font-num: 'Cairo', 'Tajawal', sans-serif;
    --fw-text-soft: 500;
    --fw-text-strong: 700;
}

:where(select, textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"])) {
    background-color: var(--field-bg);
    color: var(--field-color);
}

.awqaf-scope [style*="linear-gradient"],
.awqaf-scope [style*="radial-gradient"] {
    background-image: none !important;
}

.tone {
    --tone-fg: var(--muted-foreground);
    --tone-bg: var(--muted);
    --tone-bd: var(--border);
    color: var(--tone-fg);
    background-color: var(--tone-bg);
    border: 1px solid var(--tone-bd);
}
.tone-primary { --tone-fg: var(--primary-text);    --tone-bg: var(--primary-50);           --tone-bd: var(--primary-100); }
.tone-blue    { --tone-fg: var(--accent-blue);     --tone-bg: var(--accent-blue-muted);    --tone-bd: var(--accent-blue-border); }
.tone-purple  { --tone-fg: var(--accent-purple);   --tone-bg: var(--accent-purple-muted);  --tone-bd: var(--accent-purple-border); }
.tone-orange  { --tone-fg: var(--accent-orange);   --tone-bg: var(--accent-orange-muted);  --tone-bd: var(--accent-orange-border); }
.tone-teal    { --tone-fg: var(--accent-teal);     --tone-bg: var(--accent-teal-muted);    --tone-bd: var(--accent-teal-border); }
.tone-indigo  { --tone-fg: var(--accent-indigo);   --tone-bg: var(--accent-indigo-muted);  --tone-bd: var(--accent-indigo-border); }
.tone-green   { --tone-fg: var(--success);         --tone-bg: var(--success-muted);        --tone-bd: var(--success-border); }
.tone-amber   { --tone-fg: var(--warning);         --tone-bg: var(--warning-muted);        --tone-bd: var(--warning-border); }
.tone-red     { --tone-fg: var(--destructive);     --tone-bg: var(--destructive-muted);    --tone-bd: var(--destructive-border); }
.tone-zinc    { --tone-fg: var(--muted-foreground);--tone-bg: var(--muted);                --tone-bd: var(--border); }

.awqaf-scope .std-badge-green {
    background: var(--success-muted);
    color: var(--success);
    border-color: var(--success-border);
}

.awqaf-scope .form-group { display: flex; flex-direction: column; gap: .35rem; }

.awqaf-scope .form-label {
    display: block;
    font-size: .78rem;
    font-weight: 700;
    color: var(--foreground);
    margin-bottom: .25rem;
}

.awqaf-scope .form-input {
    width: 100%;
    height: var(--ui-btn-h);
    padding: 0 .75rem;
    font-family: var(--font-text);
    font-size: .82rem;
    color: var(--field-color);
    background: var(--field-bg);
    border: 1px solid var(--field-border-color);
    border-radius: var(--field-radius);
    outline: none;
    transition: border-color var(--sh-duration) var(--sh-ease), box-shadow var(--sh-duration) var(--sh-ease);
}
.awqaf-scope .form-input:hover  { border-color: var(--field-border-color-hover); }
.awqaf-scope .form-input:focus  { border-color: var(--field-border-color-focus); box-shadow: var(--field-ring-focus); }
.awqaf-scope textarea.form-input { height: auto; padding: .5rem .75rem; }

.awqaf-scope .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    height: var(--ui-btn-h);
    padding: 0 .85rem;
    font-family: var(--font-text);
    font-size: .82rem;
    font-weight: 600;
    color: var(--foreground);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--sh-radius-sm);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color var(--sh-duration) var(--sh-ease),
                border-color var(--sh-duration) var(--sh-ease),
                color var(--sh-duration) var(--sh-ease);
}
.awqaf-scope .btn:hover { background: var(--accent); border-color: var(--border-strong); }
.awqaf-scope .btn-sm    { height: 2rem; padding: 0 .7rem; font-size: .78rem; }
.awqaf-scope .btn-ghost { background: transparent; border-color: transparent; color: var(--muted-foreground); }
.awqaf-scope .btn-ghost:hover { background: var(--accent); border-color: transparent; color: var(--foreground); }
.awqaf-scope .btn-primary { background: var(--primary); border-color: var(--primary); color: var(--primary-on); }
.awqaf-scope .btn-primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }

@media (prefers-reduced-motion: reduce) {
    :root { --sh-duration: 0ms; }
}