/* Graphon UI v2 foundation */
@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Thin.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Thin%20Italic.ttf") format("truetype");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20UltraLight.ttf") format("truetype");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20UltraLight%20Italic.ttf") format("truetype");
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Light%20Italic.ttf") format("truetype");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Italic.ttf") format("truetype");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Medium%20Italic.ttf") format("truetype");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Demi.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Demi%20Italic.ttf") format("truetype");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "AvenirNextWorld";
    src: url("/assets/fonts/avenir-next-world/Avenir%20Next%20World%20Bold%20Italic.ttf") format("truetype");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

:root {
    --g-bg: #f7f8fc;
    --g-surface: #ffffff;
    --g-surface-soft: #fafbff;
    --g-border: #e7eaf1;
    --g-border-strong: #d8dee9;
    --g-text: #111827;
    --g-muted: #6b7280;
    --g-subtle: #9ca3af;
    --g-primary: #2563eb;
    --g-primary-hover: #1d4ed8;
    --g-primary-2: #7c3aed;
    --g-gradient: linear-gradient(135deg, #a855f7 0%, #2563eb 52%, #0ea5e9 100%);
    --graphon-ui-text: #111827;
    --graphon-ui-muted: #6b7280;
    --graphon-ui-subtle: #c3c8d2;
    --graphon-ui-border: #e5e7eb;
    --graphon-ui-border-strong: #d8dee9;
    --graphon-ui-surface: #ffffff;
    --graphon-ui-surface-soft: #f8fafc;
    --graphon-ui-primary: #2563eb;
    --graphon-ui-primary-hover: #1d4ed8;
    --graphon-ui-danger: #ef4444;
    --graphon-ui-control-radius: 6px;
    --graphon-ui-card-radius: 6px;
    --graphon-ui-control-height: 38px;
    --graphon-ui-control-height-lg: 52px;
    --graphon-ui-button-font-weight: 450;
    --graphon-ui-focus-ring: 0 0 0 4px rgba(37, 99, 235, .08);
    --graphon-ui-danger-ring: 0 0 0 4px rgba(239, 68, 68, .08);
    --graphon-ui-box-border: #e5e7eb;
    --graphon-ui-box-border-hover: rgba(37, 99, 235, .35);
    --graphon-ui-box-bg: #ffffff;
    --graphon-ui-box-shadow: none;
    --graphon-ui-box-shadow-hover: 0 0 0 4px rgba(37, 99, 235, .05);
    --graphon-ui-button-gradient: linear-gradient(135deg, #b245e7 0%, #2563eb 58%, #0284c7 100%);
    --graphon-ui-button-shadow: 0 14px 28px rgba(37, 99, 235, .22);
    --graphon-ui-button-shadow-hover: 0 16px 32px rgba(37, 99, 235, .26);
    --g-success: #22c55e;
    --g-warning: #f59e0b;
    --g-danger: #ef4444;
    --g-info: #3b82f6;
    --g-radius-sm: 10px;
    --g-radius: 14px;
    --g-radius-lg: 20px;
    --g-shadow: 0 12px 32px rgba(15, 23, 42, .06);
    --g-shadow-soft: 0 6px 18px rgba(15, 23, 42, .045);
    --g-font: AvenirNextWorld, "Avenir Next World", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bs-body-font-family: var(--g-font);
    --bs-body-color: var(--g-text);
    --bs-body-bg: var(--g-bg);
    --bs-border-color: var(--g-border);
    --bs-primary: var(--g-primary);
    --bs-primary-rgb: 37, 99, 235;
    --bs-success: var(--g-success);
    --bs-warning: var(--g-warning);
    --bs-danger: var(--g-danger);
}

body:not(.login-body) {
    color: var(--g-text);
    background: #fff !important;
    font-family: var(--bs-body-font-family);
}

html:not(:has(body.login-body)) {
    background: #fff !important;
}

body:not(.login-body)::before {
    content: "" !important;
    position: fixed !important;
    top: 50% !important;
    right: clamp(-520px, -30vw, -360px) !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 0 !important;
    width: min(820px, 64vw) !important;
    height: min(980px, 150vh) !important;
    display: block !important;
    border-radius: 999px 0 0 999px !important;
    background:
        radial-gradient(circle at 35% 45%, rgb(230 239 255), transparent 32%),
        linear-gradient(135deg, rgba(244, 240, 255, .94) 0%, rgba(232, 240, 255, .96) 54%, rgba(220, 235, 255, .98) 100%) !important;
    opacity: 1 !important;
    filter: none !important;
    pointer-events: none;
    transform: translateY(-50%) !important;
    animation: none !important;
}

body:not(.login-body)::after {
    display: none !important;
    content: none !important;
}

body:not(.login-body) .topbar,
body:not(.login-body) main,
body:not(.login-body) .container,
body:not(.login-body) .container-fluid,
body:not(.login-body) .page-shell-1650,
body:not(.login-body) .page-shell-1700,
body:not(.login-body) .page-shell-1750,
body:not(.login-body) .mainmenu-page,
body:not(.login-body) .graphon-dashboard-v2 {
    position: relative;
    z-index: 1;
}

body:not(.login-body) .card,
body:not(.login-body) .modal-content,
body:not(.login-body) .dropdown-menu {
    border-color: var(--graphon-ui-box-border);
    border-radius: var(--graphon-ui-card-radius);
    box-shadow: var(--graphon-ui-box-shadow);
}

body:not(.login-body) .card {
    background: var(--g-surface);
}

body:not(.login-body) .btn {
    min-height: var(--graphon-ui-control-height);
    border-radius: var(--graphon-ui-control-radius);
    font-weight: var(--graphon-ui-button-font-weight);
}

body:not(.login-body) .btn-primary {
    border-color: transparent;
    background: var(--graphon-ui-button-gradient);
    color: #fff;
    box-shadow: var(--graphon-ui-button-shadow);
}

body:not(.login-body) .btn-primary:hover,
body:not(.login-body) .btn-primary:focus {
    border-color: transparent;
    background: var(--graphon-ui-button-gradient);
    color: #fff;
    filter: saturate(1.06) brightness(.98);
    box-shadow: var(--graphon-ui-button-shadow-hover);
}

body:not(.login-body) .btn-outline-primary,
body:not(.login-body) .btn-outline-secondary,
body:not(.login-body) .btn-light {
    border-color: var(--g-border);
    background: #fff;
    color: #374151;
}

body:not(.login-body) .btn-outline-primary:hover,
body:not(.login-body) .btn-outline-secondary:hover,
body:not(.login-body) .btn-light:hover {
    border-color: var(--g-border-strong);
    background: var(--g-surface-soft);
    color: var(--g-text);
}

body:not(.login-body) .form-control,
body:not(.login-body) .form-select,
body:not(.login-body) .input-group-text {
    min-height: var(--graphon-ui-control-height);
    border-color: var(--graphon-ui-border);
    border-radius: var(--graphon-ui-control-radius);
    color: #0f172a;
    font-weight: 500;
}

body:not(.login-body) .form-control:focus,
body:not(.login-body) .form-select:focus {
    border-color: rgba(37, 99, 235, .58);
    box-shadow: var(--graphon-ui-focus-ring);
}

body:not(.login-body) .form-control::placeholder {
    color: var(--graphon-ui-subtle);
}

.graphon-ui-field {
    display: grid;
    gap: 6px;
}

.graphon-ui-label {
    margin: 0;
    color: var(--graphon-ui-muted);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.25;
}

.graphon-ui-input,
.graphon-ui-field .form-control,
.graphon-ui-field .form-select {
    min-height: var(--graphon-ui-control-height) !important;
    border: 1px solid var(--graphon-ui-border) !important;
    border-radius: var(--graphon-ui-control-radius) !important;
    background: var(--graphon-ui-surface) !important;
    color: var(--graphon-ui-text);
    font-size: 13px;
    font-weight: 400;
    box-shadow: none !important;
}

.graphon-ui-input:focus,
.graphon-ui-field .form-control:focus,
.graphon-ui-field .form-select:focus {
    border-color: rgba(37, 99, 235, .58) !important;
    box-shadow: var(--graphon-ui-focus-ring) !important;
}

.graphon-ui-input::placeholder,
.graphon-ui-field .form-control::placeholder {
    color: var(--graphon-ui-subtle);
}

.graphon-ui-box {
    border: 1px solid var(--graphon-ui-box-border) !important;
    border-radius: var(--graphon-ui-card-radius) !important;
    background: var(--graphon-ui-box-bg) !important;
    box-shadow: var(--graphon-ui-box-shadow) !important;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}

.graphon-ui-box:hover {
    border-color: var(--graphon-ui-box-border-hover) !important;
    box-shadow: var(--graphon-ui-box-shadow-hover) !important;
}

.graphon-ui-btn {
    min-height: var(--graphon-ui-control-height) !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 12px !important;
    border: 1px solid transparent !important;
    border-radius: var(--graphon-ui-control-radius) !important;
    font-size: 13px;
    font-weight: var(--graphon-ui-button-font-weight) !important;
    line-height: 1.2;
    text-decoration: none;
    transition: filter .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}

.graphon-ui-btn--primary {
    border-color: transparent !important;
    background: var(--graphon-ui-button-gradient) !important;
    color: #fff !important;
    box-shadow: var(--graphon-ui-button-shadow) !important;
}

.graphon-ui-btn--primary:hover,
.graphon-ui-btn--primary:focus {
    color: #fff !important;
    filter: saturate(1.06) brightness(.98);
    box-shadow: var(--graphon-ui-button-shadow-hover) !important;
}

.graphon-ui-btn--secondary {
    border-color: var(--graphon-ui-border-strong) !important;
    background: #fff !important;
    color: #374151 !important;
}

.graphon-ui-btn--secondary:hover,
.graphon-ui-btn--secondary:focus {
    border-color: #cbd5e1 !important;
    background: var(--graphon-ui-surface-soft) !important;
    color: var(--graphon-ui-text) !important;
}

body:not(.login-body) .table {
    color: var(--g-text);
}

body:not(.login-body) .table thead th {
    border-color: var(--g-border);
    background: var(--g-surface-soft);
    color: var(--g-muted);
    font-weight: 700;
}

body:not(.login-body) .table tbody td {
    border-color: #eef2f7;
}

body:not(.login-body) .table-hover tbody tr:hover > * {
    --bs-table-hover-bg: var(--g-surface-soft);
}

body:not(.login-body) .badge {
    border-radius: 5px;
    font-weight: 700;
}

body:not(.login-body) .text-muted {
    color: var(--g-muted) !important;
}

body:not(.login-body) .dropdown-menu {
    padding: 8px;
}

body:not(.login-body) .dropdown-item {
    border-radius: 10px;
    color: #374151;
    font-weight: 500;
}

body:not(.login-body) .dropdown-item:hover,
body:not(.login-body) .dropdown-item:focus {
    background: var(--g-surface-soft);
    color: var(--g-text);
}

body:not(.login-body) .modal-header,
body:not(.login-body) .modal-footer {
    border-color: var(--g-border);
}

body:not(.login-body) .alert {
    border-radius: var(--g-radius);
}