:root {
    --fp-panel-bg: #070a24;
    --fp-panel-surface: #11163a;
    --fp-panel-surface-2: #171e4b;
    --fp-panel-primary: #2f49ff;
    --fp-panel-accent: #12ddf3;
    --fp-panel-text: #f7faff;
    --fp-panel-muted: #9aa5ce;
    --fp-panel-border: rgba(255,255,255,.09);
    --fp-panel-shadow: 0 24px 60px rgba(0,0,0,.28);
}

html[data-bs-theme="dark"], html[data-bs-theme="light"] {
    --bs-body-bg: var(--fp-panel-bg);
    --bs-body-color: var(--fp-panel-text);
    --bs-primary: var(--fp-panel-primary);
    --bs-primary-rgb: 47,73,255;
    --bs-link-color: var(--fp-panel-accent);
}

body.fp-panel-body,
body.fp-login-body {
    background:
        radial-gradient(circle at 12% 8%, rgba(47,73,255,.22), transparent 31%),
        radial-gradient(circle at 88% 4%, rgba(18,221,243,.13), transparent 27%),
        var(--fp-panel-bg) !important;
    color: var(--fp-panel-text);
}

body.fp-panel-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: linear-gradient(to bottom, #000, transparent 82%);
}

.app-header {
    background: rgba(7,10,36,.78) !important;
    border-bottom: 1px solid var(--fp-panel-border) !important;
    backdrop-filter: blur(18px);
}

.app-sidebar {
    background: linear-gradient(180deg, #0b0e30 0%, #090b24 100%) !important;
    border-right: 1px solid var(--fp-panel-border);
    box-shadow: 20px 0 55px rgba(0,0,0,.22);
}

.app-sidebar .menu-heading,
.app-sidebar .menu-title,
.app-sidebar .menu-icon,
.app-sidebar .menu-arrow::after {
    color: var(--fp-panel-muted) !important;
}

.app-sidebar .menu-link {
    border-radius: 13px;
    margin-bottom: 4px;
    transition: .2s ease;
}

.app-sidebar .menu-link:hover,
.app-sidebar .menu-link.active {
    background: linear-gradient(135deg, rgba(47,73,255,.28), rgba(18,221,243,.11)) !important;
    box-shadow: inset 0 0 0 1px rgba(18,221,243,.15);
}

.app-sidebar .menu-link:hover .menu-title,
.app-sidebar .menu-link.active .menu-title,
.app-sidebar .menu-link:hover .menu-icon,
.app-sidebar .menu-link.active .menu-icon {
    color: #fff !important;
}

.card,
.modal-content,
.dropdown-menu,
.menu-sub-dropdown {
    background: linear-gradient(145deg, rgba(23,30,75,.96), rgba(13,17,48,.98)) !important;
    border: 1px solid var(--fp-panel-border) !important;
    box-shadow: var(--fp-panel-shadow);
}

.card-header,
.modal-header,
.modal-footer {
    border-color: var(--fp-panel-border) !important;
}

.form-control,
.form-select,
.input-group-text,
textarea.form-control {
    color: var(--fp-panel-text) !important;
    background-color: rgba(255,255,255,.055) !important;
    border-color: rgba(255,255,255,.11) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--fp-panel-accent) !important;
    box-shadow: 0 0 0 .25rem rgba(18,221,243,.12) !important;
}

.form-control::placeholder { color: rgba(154,165,206,.7) !important; }
.form-label, .card-title h1, .card-title h2, .card-title h3, h1, h2, h3, h4, h5, h6 { color: var(--fp-panel-text) !important; }
.text-muted, .text-gray-500, .text-gray-600, .text-gray-700 { color: var(--fp-panel-muted) !important; }
.text-gray-800, .text-gray-900 { color: var(--fp-panel-text) !important; }
.table { --bs-table-bg: transparent; --bs-table-color: var(--fp-panel-text); --bs-table-border-color: var(--fp-panel-border); }
.table thead th { color: var(--fp-panel-muted) !important; }

.btn-primary {
    background: linear-gradient(135deg, var(--fp-panel-primary), var(--fp-panel-accent)) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 12px 30px rgba(47,73,255,.24);
}
.btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn-light-primary { background: rgba(47,73,255,.14) !important; color: #8dbdff !important; }
.btn-light-danger { background: rgba(255,92,119,.13) !important; color: #ff9aac !important; }
.btn-light { background: rgba(255,255,255,.07) !important; border-color: var(--fp-panel-border) !important; color: var(--fp-panel-text) !important; }

.fp-admin-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 8px 2px;
}
.fp-admin-head h1 { font-size: clamp(1.65rem, 2.4vw, 2.35rem); }
.fp-admin-kicker { color: var(--fp-panel-accent); letter-spacing: .18em; font-weight: 800; font-size: .72rem; }
.fp-stat-card { overflow: hidden; position: relative; }
.fp-stat-card::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    right: -72px;
    bottom: -85px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(18,221,243,.35), transparent 68%);
}
.fp-stat-card .card-body { display: flex; flex-direction: column; gap: 7px; }
.fp-stat-card strong { color: #fff; font-size: 2.4rem; line-height: 1; }
.fp-stat-card small, .fp-stat-label { color: var(--fp-panel-muted); }
.fp-stat-label { text-transform: uppercase; letter-spacing: .11em; font-size: .7rem; font-weight: 800; }
.fp-endpoint { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 14px; border: 1px solid var(--fp-panel-border); border-radius: 13px; background: rgba(255,255,255,.035); }
.fp-endpoint span { display: block; color: var(--fp-panel-muted); font-size: .75rem; margin-bottom: 5px; }
.fp-endpoint code { color: #dce7ff; word-break: break-all; font-size: .76rem; }
.fp-code-admin { display: inline-block; color: var(--fp-panel-accent); background: rgba(18,221,243,.08); border: 1px solid rgba(18,221,243,.17); border-radius: 8px; padding: 7px 9px; letter-spacing: .09em; }
.fp-color-grid input[type="color"] { min-height: 48px; padding: 5px; }

.fp-admin-loading::after {
    content: "Sincronizando...";
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    place-items: center;
    background: rgba(4,6,22,.76);
    color: #fff;
    font-weight: 750;
    letter-spacing: .05em;
    backdrop-filter: blur(7px);
}

.fp-login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, 42%) 1fr; }
.fp-login-form { display: flex; align-items: center; justify-content: center; padding: 50px; background: rgba(7,10,36,.95); }
.fp-login-form-inner { width: min(430px, 100%); }
.fp-login-logo { width: 240px; max-width: 78%; display: block; margin: 0 auto 28px; filter: drop-shadow(0 18px 32px rgba(18,221,243,.18)); }
.fp-login-visual { position: relative; min-height: 100vh; overflow: hidden; background: #090b27; }
.fp-login-visual > img { width: 100%; height: 100%; object-fit: cover; opacity: .72; }
.fp-login-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #070a24 0%, transparent 36%), linear-gradient(0deg, rgba(7,10,36,.55), transparent 55%); }
.fp-login-copy { position: absolute; z-index: 2; left: 7%; right: 7%; bottom: 8%; max-width: 700px; }
.fp-login-copy h1 { font-size: clamp(2rem, 4vw, 4rem); margin-bottom: 14px; }
.fp-login-copy p { color: #d5dcf8; font-size: 1.05rem; max-width: 580px; }

@media (max-width: 991px) {
    .fp-admin-head { align-items: flex-start; flex-direction: column; }
    .fp-login-shell { grid-template-columns: 1fr; }
    .fp-login-visual { display: none; }
    .fp-login-form { min-height: 100vh; padding: 28px; }
}
