@import "tailwindcss";

@theme {
    --font-display: 'Outfit', 'Cairo', Tahoma, sans-serif;
    --font-body: 'Cairo', 'Inter', Tahoma, Arial, sans-serif;

    /* Navy / كحلي غامق */
    --color-primary-950: #020b1c;
    --color-primary-900: #04163A;
    --color-primary-800: #051e50;
    --color-primary-700: #072664;
    --color-primary-600: #092e78;

    /* Royal Blue / أزرق أساسي */
    --color-secondary-700: #08245b;
    --color-secondary-600: #0A2E73;
    --color-secondary-500: #0c398c;
    --color-secondary-400: #1044a3;
    --color-secondary-300: #3a6bbd;
    --color-secondary-200: #8aaee0;
    --color-secondary-100: #e7eaf1;

    /* Orange / برتقالي */
    --color-accent-600: #df7a01;
    --color-accent-500: #F88801;
    --color-accent-400: #f99b24;
    --color-accent-300: #faad47;
    --color-accent-100: #fff3e6;

    /* ألوان الحالة */
    --color-success: #10b981;
    --color-warning: #f59e0b;
    --color-danger: #ef4444;

    /* الأسطح والخلفيات */
    --color-surface: #f4f6fa;
    --color-card: #ffffff;
    --color-text: #04163A;
    --color-muted: #64748b;
    --color-border: #e2e8f0;

    --radius-card: 16px;
    --radius-panel: 24px;
}

/* Glassmorphism */
.glass {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(10, 46, 115, 0.08);
}

.glass-dark {
    background: rgba(4, 22, 58, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.07);
}

/* Custom scrollbar */
.sidebar-scroll::-webkit-scrollbar { width: 4px; }
.sidebar-scroll::-webkit-scrollbar-track { background: transparent; }
.sidebar-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 999px; }

/* Kanban */
.kanban-column { min-width: 310px; max-width: 310px; }
.kanban-cards { min-height: 80px; }

/* Hide scrollbar but keep scrolling */
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

/* Kanban scrollbar */
.kanban-scroll { overflow-x: auto; cursor: grab; user-select: none; }
.kanban-scroll:active { cursor: grabbing; }
.kanban-scroll::-webkit-scrollbar { height: 10px; }
.kanban-scroll::-webkit-scrollbar-track { background: #e2e8f0; border-radius: 999px; }
.kanban-scroll::-webkit-scrollbar-thumb { background: #0A2E73; border-radius: 999px; }
.kanban-scroll::-webkit-scrollbar-thumb:hover { background: #04163A; }

/* Transition for sidebar */
.sidebar-transition { transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1); }
@media (max-width: 1100px) {
    .sidebar-transition { transform: translateX(100%); }
    .sidebar-transition.open { transform: translateX(0); }
}

/* Dark Mode Overrides */
[data-theme="dark"] {
    --color-surface: #0f172a;
    --color-card: #1e293b;
    --color-text: #f1f5f9;
    --color-muted: #94a3b8;
    --color-border: #334155;
}

[data-theme="dark"] .glass {
    background: rgba(15, 23, 42, 0.85);
    border-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .bg-white {
    background-color: #1e293b;
}

[data-theme="dark"] .border-gray-200,
[data-theme="dark"] .border-gray-100 {
    border-color: #334155;
}

[data-theme="dark"] .divide-gray-50,
[data-theme="dark"] .divide-gray-100 {
    border-color: #334155;
}

[data-theme="dark"] .bg-gray-50,
[data-theme="dark"] .bg-gray-100,
[data-theme="dark"] .bg-surface {
    background-color: #0f172a;
}

[data-theme="dark"] .text-primary-900,
[data-theme="dark"] .text-text {
    color: #f1f5f9;
}

[data-theme="dark"] .text-muted {
    color: #94a3b8;
}

[data-theme="dark"] .hover\:bg-surface\/50:hover {
    background-color: rgba(15, 23, 42, 0.5);
}

[data-theme="dark"] .hover\:bg-gray-200:hover {
    background-color: #334155;
}

[data-theme="dark"] .shadow-sm {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .bg-secondary-500\/10 {
    background-color: rgba(138, 174, 224, 0.15);
}

[data-theme="dark"] .hover\:bg-secondary-500\/20:hover {
    background-color: rgba(138, 174, 224, 0.25);
}

[data-theme="dark"] .text-secondary-700 {
    color: #8aaee0;
}

[data-theme="dark"] .border-secondary-200 {
    border-color: rgba(138, 174, 224, 0.25);
}

[data-theme="dark"] .bg-secondary-50 {
    background-color: rgba(138, 174, 224, 0.15);
}

[data-theme="dark"] .text-secondary-600 {
    color: #8aaee0;
}

[data-theme="dark"] .bg-green-50 {
    background-color: rgba(16, 185, 129, 0.15);
}

[data-theme="dark"] .text-green-700 {
    color: #6ee7b7;
}

[data-theme="dark"] .bg-red-50 {
    background-color: rgba(239, 68, 68, 0.15);
}

[data-theme="dark"] .text-red-600 {
    color: #fca5a5;
}

[data-theme="dark"] .bg-gray-100 {
    background-color: #334155;
}

[data-theme="dark"] .text-gray-500 {
    color: #94a3b8;
}

[data-theme="dark"] .kanban-scroll::-webkit-scrollbar-track {
    background: #1e293b;
}

[data-theme="dark"] .kanban-scroll::-webkit-scrollbar-thumb {
    background: #3a6bbd;
}

[data-theme="dark"] .kanban-scroll::-webkit-scrollbar-thumb:hover {
    background: #8aaee0;
}

.notif-action {
    cursor: pointer;
    transition: all 0.15s;
}