@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');
:root{--bg:#0c0708;--panel:#150a0d;--panel2:#1b0d10;--line:rgba(255,255,255,.08);--aqua:#ef233c;--aqua2:#ff6575;--text:#edfaff;--muted:#829aa8;--green:#48dda0;--red:#ff6575;--yellow:#ffd166}
*{box-sizing:border-box} body{font-family:'Cairo',sans-serif!important;background:radial-gradient(circle at 80% 0,rgba(239,35,60,.08),transparent 28%),var(--bg)!important;color:var(--text)!important}.app-shell{min-height:100vh}.main-content{background:transparent!important}.card,.aqua-card{background:linear-gradient(145deg,rgba(14,36,49,.96),rgba(7,22,31,.98))!important;border:1px solid var(--line)!important;border-radius:18px!important;color:var(--text)!important;box-shadow:0 18px 50px rgba(0,0,0,.18)}.card-header,.card-footer{background:transparent!important;border-color:var(--line)!important}.page-title{font-weight:800;color:#fff}.text-muted{color:var(--muted)!important}.form-control,.form-select{background:#12090b!important;color:var(--text)!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:12px!important;min-height:46px}.form-control:focus,.form-select:focus{border-color:rgba(239,35,60,.65)!important;box-shadow:0 0 0 3px rgba(239,35,60,.08)!important}.form-label{color:#ffd0d5;font-size:12px;font-weight:800}.btn{border-radius:11px!important;font-weight:800}.btn-primary{background:linear-gradient(100deg,#d81935,#ff7585)!important;border:0!important;color:#04141b!important}.table{--bs-table-bg:transparent!important;--bs-table-color:#dceaf0!important;--bs-table-border-color:rgba(255,255,255,.07)!important}.table thead th{background:#241015!important;color:#ffc7ce!important;border:0!important;white-space:nowrap}.table tbody td{background:transparent!important;color:#dceaf0!important;vertical-align:middle}.badge-aqua{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(239,35,60,.10);border:1px solid rgba(239,35,60,.20);color:#ff8290;font-weight:800;font-size:11px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.metric{padding:18px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,rgba(14,36,49,.92),rgba(7,22,31,.95))}.metric .value{font-size:28px;font-weight:800}.metric .label{color:var(--muted);font-size:12px}.aqua-section{margin-bottom:22px}.aqua-section-title{font-size:16px;font-weight:800;color:#fff;margin-bottom:12px}.logo-img{display:block;max-width:100%;object-fit:contain}.alert{border-radius:14px!important}.mobile-only{display:none}@media(max-width:1000px){.metric-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.metric-grid{grid-template-columns:1fr}.desktop-only{display:none!important}.mobile-only{display:block}.card{border-radius:14px!important}.page-title{font-size:22px}.table-responsive{border-radius:12px}.btn{min-height:42px}}

/* =========================================================
   SCORPIOON HR FINAL RED THEME OVERRIDE
========================================================= */

:root{
    --bg:#0b0708 !important;
    --panel:#171014 !important;
    --panel2:#1d1216 !important;
    --line:rgba(255,255,255,.08) !important;

    --aqua:#e11d48 !important;
    --aqua2:#fb7185 !important;

    --text:#f8fafc !important;
    --muted:#94a3b8 !important;

    --green:#22c55e !important;
    --red:#ef4444 !important;
    --yellow:#f59e0b !important;
}

body{
    background:
        radial-gradient(circle at 85% 0,rgba(225,29,72,.10),transparent 28%),
        radial-gradient(circle at 10% 100%,rgba(127,29,29,.08),transparent 30%),
        #0b0708 !important;
    color:#f8fafc !important;
}

.sidebar{
    background:#12090b !important;
    border-left:1px solid rgba(225,29,72,.18) !important;
}

.sidebar-brand{
    background:#12090b !important;
    border-bottom:1px solid rgba(225,29,72,.14) !important;
}

.sidebar-logo{
    filter:drop-shadow(0 6px 18px rgba(225,29,72,.20)) !important;
}

.sidebar .list-group-item,
.sidebar .list-group-item-action{
    color:#94a3b8 !important;
}

.sidebar .list-group-item i{
    color:#94a3b8 !important;
    background:#1b1014 !important;
    border:1px solid rgba(255,255,255,.05) !important;
}

.sidebar .list-group-item:hover{
    background:rgba(225,29,72,.08) !important;
    color:#fff !important;
}

.sidebar .list-group-item:hover i{
    color:#fb7185 !important;
    background:rgba(225,29,72,.12) !important;
}

.sidebar .list-group-item.active{
    background:linear-gradient(90deg,rgba(225,29,72,.16),rgba(225,29,72,.06)) !important;
    color:#fff !important;
    border:1px solid rgba(225,29,72,.28) !important;
}

.sidebar .list-group-item.active i{
    color:#fff !important;
    background:#e11d48 !important;
    border-color:#e11d48 !important;
}

.sidebar-logout{
    background:#12090b !important;
    border-top:1px solid rgba(225,29,72,.14) !important;
}

.sidebar-logout button{
    color:#fb7185 !important;
    border-color:rgba(225,29,72,.45) !important;
    background:transparent !important;
}

.sidebar-logout button:hover{
    background:#e11d48 !important;
    color:#fff !important;
}

.card,
.aqua-card,
.metric{
    background:linear-gradient(145deg,#171014,#110a0c) !important;
    border:1px solid rgba(255,255,255,.07) !important;
    box-shadow:0 18px 45px rgba(0,0,0,.22) !important;
}

.card-header,
.card-footer{
    border-color:rgba(255,255,255,.07) !important;
}

.form-control,
.form-select{
    background:#110a0c !important;
    color:#f8fafc !important;
    border:1px solid rgba(255,255,255,.10) !important;
}

.form-control:focus,
.form-select:focus{
    border-color:#e11d48 !important;
    box-shadow:0 0 0 3px rgba(225,29,72,.12) !important;
}

.form-label{
    color:#e2e8f0 !important;
}

.btn-primary{
    background:linear-gradient(100deg,#be123c,#fb7185) !important;
    border:0 !important;
    color:#fff !important;
}

.btn-outline-info,
.btn-outline-primary{
    color:#fb7185 !important;
    border-color:rgba(225,29,72,.55) !important;
}

.btn-outline-info:hover,
.btn-outline-primary:hover{
    background:#e11d48 !important;
    color:#fff !important;
    border-color:#e11d48 !important;
}

.badge-aqua{
    background:rgba(225,29,72,.10) !important;
    border-color:rgba(225,29,72,.20) !important;
    color:#fb7185 !important;
}

.table{
    --bs-table-bg:transparent !important;
    --bs-table-color:#e2e8f0 !important;
    --bs-table-border-color:rgba(255,255,255,.06) !important;
}

.table thead th{
    background:#241116 !important;
    color:#fda4af !important;
}

.table tbody td{
    color:#e2e8f0 !important;
}

.text-info{
    color:#fb7185 !important;
}

.bg-info{
    background:#e11d48 !important;
}

.border-info{
    border-color:#e11d48 !important;
}

.text-primary{
    color:#fb7185 !important;
}

.bg-primary{
    background:#e11d48 !important;
}

.border-primary{
    border-color:#e11d48 !important;
}

/* Dashboard-specific aqua/cyan remnants */
.metric .value,
.aqua-text,
.sum-box.aqua strong{
    color:#fb7185 !important;
}

.portal-nav a.active,
.portal-nav a:hover{
    color:#fff !important;
    background:rgba(225,29,72,.10) !important;
    border-color:rgba(225,29,72,.22) !important;
}

/* scrollbar */
.sidebar .list-group{
    scrollbar-color:#4a1d26 transparent !important;
}

.sidebar .list-group::-webkit-scrollbar-thumb{
    background:#4a1d26 !important;
}

.sidebar .list-group::-webkit-scrollbar-thumb:hover{
    background:#7f1d1d !important;
}


/* =========================================================
   SCORPIOON ICON + PANEL CLEANUP
========================================================= */

/* panels / sections that still look blue */
.card,
.aqua-card,
.metric,
.table-responsive,
[class*="summary"],
[class*="panel"],
[class*="widget"],
[class*="hero"],
[class*="box"]{
    background: linear-gradient(145deg,#161014,#0f090b) !important;
}

/* top title sections / banners */
.page-hero,
.hero,
.header-card,
.dashboard-hero,
.section-hero{
    background: linear-gradient(90deg, rgba(225,29,72,.08), rgba(255,255,255,.02)) !important;
    border-color: rgba(225,29,72,.18) !important;
}

/* generic bootstrap icons */
i.bi,
[class^="bi-"],
[class*=" bi-"]{
    color: #fb7185 !important;
}

/* icon wrappers / squares / circles */
.icon-box,
.icon-wrap,
.icon-circle,
.metric-icon,
.stat-icon,
.summary-icon,
.action-icon,
.quick-icon,
.empty-icon,
.hero-icon,
.feature-icon,
.card-icon,
.tile-icon{
    color: #fb7185 !important;
    background: rgba(225,29,72,.10) !important;
    border: 1px solid rgba(225,29,72,.22) !important;
    box-shadow: none !important;
}

/* sidebar icons keep red styling */
.sidebar .list-group-item i{
    color:#fda4af !important;
    background:#1a1013 !important;
    border:1px solid rgba(225,29,72,.20) !important;
}
.sidebar .list-group-item.active i{
    color:#fff !important;
    background:#e11d48 !important;
    border-color:#e11d48 !important;
}

/* top nav / floating small icons */
.navbar i,
.topbar i,
.header-tools i,
.quick-actions i{
    color:#fb7185 !important;
}

/* empty states */
.empty-state,
.empty-box,
.no-data,
.no-results{
    color:#cbd5e1 !important;
}
.empty-state i,
.empty-box i,
.no-data i,
.no-results i{
    color:#fb7185 !important;
}

/* buttons that still appear cyan */
.btn-info,
.btn-outline-info,
.btn-outline-primary,
.btn-primary{
    background-image: none !important;
}

.btn-info,
.btn-primary{
    background: linear-gradient(90deg,#e11d48,#fb7185) !important;
    border-color:#e11d48 !important;
    color:#fff !important;
}

.btn-outline-info,
.btn-outline-primary{
    color:#fb7185 !important;
    border-color:rgba(225,29,72,.45) !important;
    background: rgba(225,29,72,.03) !important;
}
.btn-outline-info:hover,
.btn-outline-primary:hover{
    background:#e11d48 !important;
    color:#fff !important;
    border-color:#e11d48 !important;
}

/* search / filter bars */
input,
select,
textarea{
    background:#100b0d !important;
}

.input-group-text,
.search-box button,
.filter-btn,
.filter-button{
    background:#1a1013 !important;
    color:#fb7185 !important;
    border-color:rgba(225,29,72,.25) !important;
}

/* table headers still bluish */
.table thead th{
    background:#241116 !important;
    color:#fecdd3 !important;
}

/* force old aqua helper classes to red */
.aqua-text,
.badge-aqua,
.aqua-section-title,
.aq-kicker,
.sum-box.aqua strong{
    color:#fb7185 !important;
}
.badge-aqua{
    background:rgba(225,29,72,.10) !important;
    border:1px solid rgba(225,29,72,.22) !important;
}

/* preserve semantic states */
.text-success, .btn-success, .badge.bg-success, .bg-success { color: inherit; }
.text-warning, .btn-warning, .badge.bg-warning, .bg-warning { color: inherit; }
.text-danger, .btn-danger, .badge.bg-danger, .bg-danger { color: inherit; }


/* =========================================================
   SCORPIOON - ICON NORMALIZATION
========================================================= */

.loans-page i.bi,
.devices-page i.bi,
.settings-page i.bi,
.dashboard-page i.bi {
    color:#fb7185 !important;
}

/* icon containers */
.loans-page [class*="icon"],
.devices-page [class*="icon"],
.settings-page [class*="icon"] {
    border-color:rgba(225,29,72,.22) !important;
}

/* preserve status colors */
.text-success,
.status.online,
.stat-card.active .stat-icon,
.stat-card.active .stat-number {
    color:#42e7ad !important;
}

.text-warning,
.status.offline {
    color:#ffc56c !important;
}

.text-danger,
.status.disabled {
    /* Bootstrap/state styling stays semantic */
}

/* search / filter action buttons */
.loans-page button[type="submit"],
.devices-page .search-btn,
.devices-page button[type="submit"] {
    background:linear-gradient(135deg,#be123c,#fb7185) !important;
    border-color:#e11d48 !important;
    color:#fff !important;
}

/* remove cyan focus/glow */
.loans-page input:focus,
.loans-page select:focus,
.devices-page input:focus,
.devices-page select:focus {
    border-color:#e11d48 !important;
    box-shadow:0 0 0 3px rgba(225,29,72,.10) !important;
}


/* =========================================================
   SCORPIOON FINAL BUTTON + LOGIN CLEANUP
========================================================= */

/* كل الأزرار الرئيسية */
.btn-primary,
.btn-info,
button.btn-primary,
button.btn-info,
input[type="submit"].btn-primary,
input[type="submit"].btn-info {
    background: linear-gradient(135deg,#be123c,#e11d48,#fb7185) !important;
    border: 1px solid rgba(251,113,133,.28) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(225,29,72,.16) !important;
}

.btn-primary:hover,
.btn-info:hover,
button.btn-primary:hover,
button.btn-info:hover {
    background: linear-gradient(135deg,#9f1239,#e11d48) !important;
    color:#fff !important;
    border-color:#fb7185 !important;
}

/* أي زر submit معمول custom */
button[type="submit"] {
    --bs-btn-color:#fff;
}

/* LOGIN */
.login-page {
    background:
        radial-gradient(circle at 15% 15%,rgba(225,29,72,.10),transparent 28%),
        #0b0708 !important;
}

.login-card {
    background:
        linear-gradient(145deg,#171014,#10090b) !important;
    border:1px solid rgba(225,29,72,.18) !important;
    box-shadow:0 28px 70px rgba(0,0,0,.34) !important;
}

.login-card input,
.login-card .form-control {
    background:#10090b !important;
    color:#fff !important;
    border:1px solid rgba(255,255,255,.10) !important;
}

.login-card input:focus,
.login-card .form-control:focus {
    border-color:#e11d48 !important;
    box-shadow:0 0 0 3px rgba(225,29,72,.12) !important;
}

/* زر تسجيل الدخول */
.login-card button[type="submit"],
.login-card .btn-primary {
    background:linear-gradient(135deg,#be123c,#e11d48,#fb7185) !important;
    color:#fff !important;
    border:0 !important;
}

/* SETTINGS SAVE BUTTON */
.settings-page button[type="submit"],
.settings-page .btn-primary {
    background:linear-gradient(135deg,#be123c,#e11d48,#fb7185) !important;
    color:#fff !important;
}

/* PAYROLL CALCULATE BUTTON */
.payroll-page button[type="submit"],
.payroll-page .btn-primary,
.payroll-page .btn-info {
    background:linear-gradient(135deg,#be123c,#e11d48,#fb7185) !important;
    color:#fff !important;
}

/* remove remaining cyan shadows */
.btn,
button {
    --bs-btn-focus-shadow-rgb:225,29,72 !important;
}