:root {
    --font-family: 'Hodoorak Cairo', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --hdoorak-admin-font-family: 'Hodoorak Cairo', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

html,
body,
.fi,
.fi *:not(code):not(kbd):not(pre):not(samp),
.fi input,
.fi select,
.fi textarea,
.fi button {
    font-family: var(--hdoorak-admin-font-family) !important;
}

.fi code,
.fi kbd,
.fi pre,
.fi samp {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !important;
}

/* Make Filament admin content use the full available width. */
.fi-main {
    max-width: none !important;
    width: 100% !important;
}

.fi-main > .fi-page {
    width: 100%;
}


/* Light mode: mirror the login hero background and visual treatment. */
html:not(.dark) .fi-sidebar {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 105% 92%, rgba(255, 255, 255, 0.14) 0 7rem, transparent 7.1rem),
        linear-gradient(160deg, rgba(37, 99, 235, .98), rgba(29, 78, 216, .92)) !important;
}



html:not(.dark) .fi-sidebar > * {
    position: relative;
    z-index: 1;
}

html:not(.dark) .fi-sidebar-header,
html:not(.dark) .fi-topbar nav,
html:not(.dark) .fi-sidebar-nav,
html:not(.dark) .fi-sidebar-nav-groups {
    background: transparent !important;
}

html:not(.dark) .fi-logo,
html:not(.dark) .fi-sidebar-header .fi-logo,
html:not(.dark) .fi-sidebar-header .fi-logo span {
    color: #ffffff !important;
}

.fi-sidebar-header .fi-logo {
    display: inline-flex !important;
    align-items: center !important;
    gap: .7rem !important;
}

.fi-sidebar-header .fi-logo::before {
    content: "";
    display: block;
    flex: 0 0 2.55rem;
    width: 2.55rem;
    height: 2.55rem;
    border-radius: .85rem;
    background: #ffffff url('../images/hodoorak-logo-primary.svg') center / 1.48rem auto no-repeat;
    border: 1px solid rgba(37, 99, 235, .12);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .14);
}

html:not(.dark) .fi-sidebar-group-label,
html:not(.dark) .fi-sidebar-group-button,
html:not(.dark) .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item-icon,
html:not(.dark) .fi-sidebar-group-collapse-button,
html:not(.dark) .fi-sidebar-header button,
html:not(.dark) .fi-sidebar-header .fi-icon-btn,
html:not(.dark) .fi-sidebar-header svg,
html:not(.dark) .fi-sidebar svg {
    color: #dbeafe !important;
}

html:not(.dark) .fi-sidebar-group-label,
html:not(.dark) .fi-sidebar-group-button {
    opacity: .95;
}

html:not(.dark) .fi-sidebar-item > .fi-sidebar-item-button,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item-button {
    color: #eff6ff !important;
    border: 1px solid transparent !important;
    border-radius: .85rem !important;
    background: transparent !important;
}

html:not(.dark) .fi-sidebar-item > .fi-sidebar-item-button:hover,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item-button:hover,
html:not(.dark) .fi-sidebar-group-button:hover {
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
}

html:not(.dark) .fi-sidebar-item > .fi-sidebar-item-button[aria-current="page"],
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item-button[aria-current="page"],
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-button,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

html:not(.dark) .fi-sidebar-item > .fi-sidebar-item-button[aria-current="page"] .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item-button[aria-current="page"] .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item > .fi-sidebar-item-button[aria-current="page"] .fi-sidebar-item-icon,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item-button[aria-current="page"] .fi-sidebar-item-icon,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-icon,
html:not(.dark) .fi-sidebar-group-items .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-icon {
    color: #ffffff !important;
}

html:not(.dark) .fi-sidebar-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

html:not(.dark) .fi-sidebar-nav {
    border-color: rgba(255, 255, 255, 0.16) !important;
}