/* Silon × Unfold overlay — applied via UNFOLD["STYLES"] in settings.
   Loads brand fonts and aligns Unfold's defaults with the dashboard
   palette without forking the Unfold templates. */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Tajawal:wght@400;500;700&display=swap');

:root,
.unfold {
    /* Re-pin Unfold's primary tints to brand cyan/blue (rgb space — Unfold
       uses these as `rgb(var(--color-primary-X))`). */
    --color-primary-50:  236 254 255;
    --color-primary-100: 207 250 254;
    --color-primary-200: 165 243 252;
    --color-primary-300: 103 232 249;
    --color-primary-400: 34 211 238;
    --color-primary-500: 0 194 243;
    --color-primary-600: 0 125 255;
    --color-primary-700: 0 102 214;
    --color-primary-800: 0 82 174;
    --color-primary-900: 12 74 110;
    --color-primary-950: 8 47 73;
}

.unfold body,
.unfold .unfold-body,
.unfold .text-base,
.unfold p, .unfold span, .unfold a, .unfold button, .unfold input, .unfold select, .unfold textarea {
    font-family: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.unfold h1, .unfold h2, .unfold h3, .unfold h4, .unfold h5, .unfold h6 {
    font-family: 'Manrope', system-ui, sans-serif;
    letter-spacing: -0.01em;
}

html[lang="ar"] .unfold body,
html[dir="rtl"] .unfold body {
    font-family: 'Tajawal', system-ui, sans-serif;
}

/* Primary action buttons (save, save-and-continue, etc.) inherit brand blue. */
.unfold .button.primary,
.unfold input[type="submit"],
.unfold button[type="submit"].default,
.unfold .submit-row input[name="_save"],
.unfold .submit-row input[name="_continue"],
.unfold .submit-row input[name="_addanother"] {
    background-color: rgb(0 125 255);
    color: #ffffff;
    border-radius: 10px;
    font-weight: 600;
    transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
    box-shadow: 0 8px 22px -10px rgba(0, 125, 255, 0.55);
}

.unfold .button.primary:hover,
.unfold input[type="submit"]:hover,
.unfold .submit-row input[name="_save"]:hover {
    background-color: rgb(0 102 214);
    box-shadow: 0 10px 28px -8px rgba(0, 125, 255, 0.65);
}

/* Login canvas — Cyan Blue ribbons on Light Grey, matching the dashboard
   login. Unfold's default login template wraps the form in `.login`. */
body.login,
body.unfold-login,
.login.unfold,
.login {
    background:
        radial-gradient(ellipse 60% 45% at 100% 12%, rgba(0, 194, 243, 0.22) 0%, transparent 60%),
        radial-gradient(ellipse 50% 40% at 0% 100%, rgba(0, 125, 255, 0.14) 0%, transparent 65%),
        #F2F4F7;
    min-height: 100vh;
}

.login #content,
.login #content-main,
.login .module {
    background: #ffffff;
    border: 1px solid #E5E7EB;
    border-radius: 18px;
    box-shadow: 0 24px 64px rgba(35, 31, 32, 0.10), 0 2px 8px rgba(35, 31, 32, 0.04);
    backdrop-filter: blur(2px);
}

/* Scrollbar polish (light) */
.unfold ::-webkit-scrollbar { width: 8px; height: 8px; }
.unfold ::-webkit-scrollbar-thumb { background: #d4d8de; border-radius: 4px; }
.unfold ::-webkit-scrollbar-thumb:hover { background: #a0a8b4; }

/* Field focus rings — cyan glow to match the dashboard */
.unfold input:focus,
.unfold select:focus,
.unfold textarea:focus {
    border-color: rgb(0 194 243) !important;
    box-shadow: 0 0 0 4px rgba(0, 194, 243, 0.18) !important;
    outline: none !important;
}