/* SAP Fiori Blue & White Theme (نظام الثيم المؤسسي أزرق وأبيض - نمط ساب) */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&family=Tajawal:wght@400;500;700;800&family=JetBrains+Mono:wght@500;700;800&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
    --font-arabic: 'Cairo', 'Tajawal', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-latin: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    
    /* Official SAP Palette */
    --sap-primary: #0070f2;
    --sap-primary-hover: #005cbd;
    --sap-primary-active: #004791;
    --sap-header-bg: #002b66;
    --sap-header-dark: #001940;
    --sap-page-bg: #f5f8fc;
    --sap-card-bg: #ffffff;
    --sap-text-main: #1d2d3e;
    --sap-text-secondary: #556b82;
    --sap-border: #d7e2ee;
    --sap-border-subtle: #e7eff7;
    
    /* SAP Statuses */
    --sap-positive: #107e3e;
    --sap-positive-bg: #e5f6eb;
    --sap-critical: #bb0000;
    --sap-critical-bg: #ffebeb;
    --sap-warning: #b85500;
    --sap-warning-bg: #fff1e5;
    --sap-info: #0070f2;
    --sap-info-bg: #ebf3fb;
}

body {
    font-family: var(--font-latin);
    background-color: var(--sap-page-bg);
    color: var(--sap-text-main);
    min-height: 100vh;
    overflow-x: hidden;
}

[dir="rtl"] body,
[dir="rtl"] {
    font-family: var(--font-arabic);
}

/* SAP Enterprise Cards & Panels */
.sap-header {
    background: linear-gradient(135deg, #002b66 0%, #004b99 100%);
    color: #ffffff;
    border-bottom: 2px solid #001940;
    box-shadow: 0 4px 12px rgba(0, 43, 102, 0.15);
}

.sap-card {
    background: #ffffff;
    border: 1px solid var(--sap-border);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 43, 102, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: all 0.2s ease-in-out;
}

.sap-card:hover {
    border-color: #b0cfee;
    box-shadow: 0 6px 18px rgba(0, 112, 242, 0.08);
}

.sap-panel {
    background: #ffffff;
    border: 1px solid var(--sap-border);
    border-radius: 14px;
    box-shadow: 0 4px 14px rgba(0, 43, 102, 0.06);
}

/* SAP Primary Buttons */
.sap-btn-primary {
    background-color: var(--sap-primary);
    color: #ffffff;
    font-weight: 700;
    border-radius: 8px;
    border: 1px solid var(--sap-primary);
    transition: all 0.15s ease;
    box-shadow: 0 2px 4px rgba(0, 112, 242, 0.2);
}

.sap-btn-primary:hover {
    background-color: var(--sap-primary-hover);
    box-shadow: 0 4px 8px rgba(0, 112, 242, 0.3);
    transform: translateY(-1px);
}

.sap-btn-primary:active {
    background-color: var(--sap-primary-active);
    transform: translateY(1px);
}

.sap-btn-secondary {
    background-color: #ffffff;
    color: var(--sap-primary);
    border: 1px solid var(--sap-border);
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.15s ease;
}

.sap-btn-secondary:hover {
    background-color: var(--sap-info-bg);
    border-color: var(--sap-primary);
}

/* SAP Status Badges */
.badge-inside {
    background-color: var(--sap-positive-bg);
    color: var(--sap-positive);
    border: 1px solid #b4e3c4;
    font-weight: 700;
}

.badge-overstay {
    background-color: var(--sap-critical-bg);
    color: var(--sap-critical);
    border: 1px solid #f6b3b3;
    font-weight: 700;
    animation: sap-pulse 2s infinite;
}

.badge-active {
    background-color: var(--sap-info-bg);
    color: var(--sap-info);
    border: 1px solid #b3d5fa;
    font-weight: 700;
}

.badge-exited {
    background-color: #f1f4f8;
    color: var(--sap-text-secondary);
    border: 1px solid #d7e2ee;
    font-weight: 600;
}

.badge-blacklisted {
    background-color: #3b0d0c;
    color: #ffcccc;
    border: 1px solid #8a1f1d;
    font-weight: 800;
}

@keyframes sap-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(187, 0, 0, 0.4);
    }
    50% {
        box-shadow: 0 0 0 4px rgba(187, 0, 0, 0);
    }
}

/* Egyptian License Plate in SAP Light Theme */
.egyptian-plate {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
}

/* Keypad Keys for SAP Theme */
.arabic-key {
    background: #ffffff;
    color: var(--sap-text-main);
    border: 1px solid var(--sap-border);
    border-radius: 6px;
    font-size: 17px;
    font-weight: 700;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.arabic-key:hover {
    background: var(--sap-primary);
    border-color: var(--sap-primary);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 3px 6px rgba(0, 112, 242, 0.2);
}

.arabic-key:active {
    transform: translateY(1px);
    background: var(--sap-primary-active);
}

/* Custom Scrollbars */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #e7eff7;
}
::-webkit-scrollbar-thumb {
    background: #b0cfee;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--sap-primary);
}

/* QR Code Scanner Overlay */
#qr-reader {
    width: 100% !important;
    border: none !important;
    border-radius: 10px;
    overflow: hidden;
}

/* Tactile Touch Buttons */
.touch-btn {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    border-radius: 10px;
    transition: all 0.15s ease;
}

.touch-btn:active {
    transform: scale(0.98);
}