/**
 * Dedo — هوية الألوان الافتراضية للمشروع
 * كحلي ملكي غامق + تموجات فاتحة + نص أبيض + تفاعل Baby Blue
 */
:root {
    --dedo-royal-950: #020814;
    --dedo-royal-900: #051428;
    --dedo-royal-800: #071f3d;
    --dedo-royal-700: #0a2848;
    --dedo-royal-600: #0d3260;
    --dedo-baby-blue: #a8e6ff;
    --dedo-baby-blue-bright: #c8f4ff;
    --dedo-baby-blue-dim: #7dd3fc;
    --dedo-text: #ffffff;
    --dedo-text-muted: rgba(232, 246, 255, 0.78);
    --dedo-border-soft: rgba(255, 255, 255, 0.12);
    --dedo-wave-image: url("/branding/dedo-wave-hero.png");
}

/* خلفية بوابة المنصة والصفحات المعتمدة على الهوية */
.dedo-portal-bg {
    position: relative;
    background-color: var(--dedo-royal-950);
    background-image:
        radial-gradient(ellipse 130% 95% at 50% -25%, rgba(255, 255, 255, 0.42), rgba(200, 244, 255, 0.18) 34%, rgba(125, 211, 252, 0.06) 52%, transparent 70%),
        radial-gradient(ellipse 100% 80% at 92% 38%, rgba(125, 211, 252, 0.22), rgba(56, 189, 248, 0.08) 45%, transparent 60%),
        radial-gradient(ellipse 95% 85% at 6% 62%, rgba(96, 165, 250, 0.14), transparent 58%),
        radial-gradient(ellipse 115% 100% at 50% 108%, rgba(2, 8, 20, 0.97), rgba(5, 20, 40, 0.88) 44%, rgba(10, 40, 72, 0.28) 64%, transparent 80%),
        linear-gradient(165deg, var(--dedo-royal-800) 0%, var(--dedo-royal-900) 42%, var(--dedo-royal-950) 100%);
    background-size: auto, auto, auto, auto, auto;
}

.dedo-portal-bg::before {
    content: "";
    position: fixed;
    inset: 0;
    background-image: var(--dedo-wave-image);
    background-size: cover;
    background-position: 50% 40%;
    opacity: 0.38;
    mix-blend-mode: screen;
    pointer-events: none;
    z-index: 0;
}

.dedo-portal-bg::after {
    content: "";
    position: fixed;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
        radial-gradient(ellipse 88% 58% at 50% 16%, rgba(255, 255, 255, 0.11), transparent 68%);
    pointer-events: none;
    z-index: 0;
}

/* بطاقات البوابة — حركة خفيفة + ظل بلمسة Baby Blue */
.dedo-portal-card-active {
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.45s ease;
}

.dedo-portal-card-active .dedo-card-photo {
    transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.dedo-portal-card-active:hover .dedo-card-photo {
    transform: scale(1.08);
}

.dedo-portal-card-static .dedo-card-photo {
    filter: saturate(0.55) brightness(0.75);
}

/* Hover / Focus للروابط والبطاقات — Baby Blue */
.dedo-portal-card-active:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 2px var(--dedo-baby-blue-dim),
        0 0 48px -12px rgba(168, 230, 255, 0.45);
}

.dedo-portal-card-active:hover {
    transform: translateY(-12px) scale(1.02);
    box-shadow:
        0 32px 64px -16px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(255, 255, 255, 0.12),
        0 0 80px -20px rgba(168, 230, 255, 0.38);
}

.dedo-header-glow {
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.1),
        rgba(168, 230, 255, 0.35),
        rgba(125, 211, 252, 0.18),
        transparent
    );
}

/* لوحة الحسابات — محاذاة بصرية مع dash-shell التاجر (merchant-dashboard-layout) */
.dedo-accounting-app {
    color: #0f172a;
}

.dedo-accounting-app.dash-shell-accounting {
    position: relative;
    background: linear-gradient(168deg, #eef2ff 0%, #f8fafc 42%, #f0f9ff 100%);
}

.dedo-accounting-app.dash-shell-accounting::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(ellipse 85% 55% at 100% -15%, rgba(99, 102, 241, 0.14), transparent 55%),
        radial-gradient(ellipse 70% 45% at -5% 105%, rgba(37, 99, 235, 0.1), transparent 50%),
        radial-gradient(ellipse 50% 35% at 50% 100%, rgba(14, 165, 233, 0.06), transparent 45%);
}

.dedo-accounting-main {
    position: relative;
    z-index: 1;
    background: transparent;
}

.accounting-dash-z {
    position: relative;
    z-index: 1;
}

/* شريط علوي — نفس روح merchant-top-navbar (#2563eb) */
.accounting-dash-header {
    background: #ffffff;
    border-bottom: 1px solid rgba(37, 99, 235, 0.1);
    box-shadow:
        0 4px 28px rgba(37, 99, 235, 0.1),
        0 8px 32px rgba(15, 23, 42, 0.04),
        inset 0 -1px 0 rgba(255, 255, 255, 0.8);
}

/* الشريط الجانبي — نفس تدرّج/ظل التاجر */
.accounting-dash-sidebar {
    isolation: isolate;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.94) 38%, rgba(238, 242, 255, 0.93) 100%);
    border-inline-start: 1px solid rgba(255, 255, 255, 0.92);
    box-shadow:
        8px 0 40px -12px rgba(15, 23, 42, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.accounting-dash-sidebar::before {
    content: "";
    position: absolute;
    inset: -35% auto auto -30%;
    width: 140%;
    aspect-ratio: 1;
    max-width: 420px;
    background:
        radial-gradient(circle at 70% 30%, rgba(59, 130, 246, 0.16), transparent 55%),
        radial-gradient(circle at 25% 70%, rgba(99, 102, 241, 0.11), transparent 50%);
    pointer-events: none;
    z-index: 0;
}

.accounting-dash-sidebar > * {
    position: relative;
    z-index: 2;
}

.dedo-accounting-card {
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow:
        0 4px 6px -1px rgba(15, 23, 42, 0.05),
        0 14px 40px -18px rgba(37, 99, 235, 0.14);
}

/* قديم — احتياط إن وُجد في HTML */
.dedo-accounting-sidebar-surface {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.94) 38%, rgba(238, 242, 255, 0.93) 100%);
}
