/*
 * Scoolyz Control Center - brand layer on top of Filament.
 * Fonts are bundled locally (copied from the Scoolyz app): Quicksand for Latin,
 * IBM Plex Sans Arabic for Arabic text. Nothing is fetched from a font CDN.
 */

@font-face {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url('../fonts/quicksand/quicksand-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url('../fonts/quicksand/quicksand-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Sans Arabic';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-400-normal.woff2') format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

@font-face {
    font-family: 'IBM Plex Sans Arabic';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-500-normal.woff2') format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

@font-face {
    font-family: 'IBM Plex Sans Arabic';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-600-normal.woff2') format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

@font-face {
    font-family: 'IBM Plex Sans Arabic';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-arabic-700-normal.woff2') format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

/* Arabic glyphs fall through Quicksand (no Arabic) to Plex automatically. */
html:root {
    --font-family: 'Quicksand', 'IBM Plex Sans Arabic', ui-sans-serif, system-ui, sans-serif;
}

/* Precise, calm surfaces: slightly tighter headings, tabular figures for money. */
.fi-header-heading,
.fi-section-header-heading {
    letter-spacing: -0.01em;
}

.fi-ta-text,
.fi-wi-stats-overview-stat-value,
.fi-in-text {
    font-variant-numeric: tabular-nums;
}

.fi-wi-stats-overview-stat-value {
    letter-spacing: -0.02em;
}

/* Arabic data fields read right-to-left wherever they appear. */
[lang='ar'],
.scz-ar {
    font-family: 'IBM Plex Sans Arabic', 'Quicksand', sans-serif;
    direction: rtl;
    unicode-bidi: isolate;
}

/* Health dots used on the Schools list and the Servers board. */
.scz-dot {
    display: inline-block;
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 9999px;
    vertical-align: middle;
}
.scz-dot--green { background: #16a34a; }
.scz-dot--amber { background: #f59e0b; }
.scz-dot--red { background: #dc2626; }
.scz-dot--unknown { background: #9ca3af; }

/* Small building blocks for the custom tabs (Filament's CSS holds only its own classes). */
.scz-stack > * + * { margin-top: 0.75rem; }
.scz-stack--lg > * + * { margin-top: 1.5rem; }
.scz-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.scz-push { margin-inline-start: auto; gap: 0.5rem; }
.scz-muted { color: rgb(113 113 122); font-size: 0.875rem; }
.dark .scz-muted { color: rgb(161 161 170); }
.scz-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.8em; }
.scz-strong { font-weight: 600; }
.scz-strike { text-decoration: line-through; color: rgb(161 161 170); }
.scz-h3 { font-size: 0.875rem; font-weight: 600; margin-bottom: 0.5rem; }

.scz-note { border-radius: 0.75rem; padding: 0.875rem 1rem; font-size: 0.875rem; line-height: 1.5;
    border: 1px solid rgb(228 228 231); background: rgb(250 250 250); }
.scz-note p { margin-top: 0.25rem; }
.scz-note ul { margin-top: 0.25rem; padding-inline-start: 1.25rem; list-style: disc; }
.scz-note a { font-weight: 600; text-decoration: underline; }
.scz-note--warning { border-color: rgb(253 230 138); background: rgb(255 251 235); color: rgb(146 64 14); }
.scz-note--danger { border-color: rgb(254 202 202); background: rgb(254 242 242); color: rgb(153 27 27); }
.dark .scz-note { border-color: rgb(255 255 255 / 0.1); background: rgb(255 255 255 / 0.04); }
.dark .scz-note--warning { border-color: rgb(245 158 11 / 0.3); background: rgb(245 158 11 / 0.08); color: rgb(252 211 77); }
.dark .scz-note--danger { border-color: rgb(239 68 68 / 0.3); background: rgb(239 68 68 / 0.08); color: rgb(252 165 165); }

.scz-table { width: 100%; font-size: 0.875rem; border-collapse: collapse; }
.scz-table th { text-align: start; font-weight: 500; color: rgb(113 113 122); padding: 0.375rem 0.75rem 0.375rem 0; }
.scz-table td { padding: 0.5rem 0.75rem 0.5rem 0; border-top: 1px solid rgb(244 244 245); vertical-align: top; }
.dark .scz-table td { border-top-color: rgb(255 255 255 / 0.08); }
.scz-table tr.scz-changed td { background: rgb(255 251 235); }
.dark .scz-table tr.scz-changed td { background: rgb(245 158 11 / 0.08); }
.scz-table td.scz-num, .scz-table th.scz-num { text-align: end; font-variant-numeric: tabular-nums; }

.scz-select { user-select: all; word-break: break-all; }
.scz-grid-2 { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr)); }
.scz-input { margin-inline-start: 0.375rem; border: 1px solid rgb(228 228 231); border-radius: 0.5rem; padding: 0.25rem 0.5rem; background: transparent; color: inherit; }
.dark .scz-input { border-color: rgb(255 255 255 / 0.15); color-scheme: dark; }
.scz-link { font-weight: 600; text-decoration: underline; cursor: pointer; }

.scz-login-emblem {
    display: flex;
    justify-content: center;
    margin-bottom: 0.5rem;
}
.scz-login-emblem img {
    height: 2.75rem;
    width: auto;
}