:root{--bg:#080e19;--panel:#101928;--panel2:#121d2f;--panel3:#182338;--line:#24324a;--text:#f5f7fb;--muted:#8d98aa;--gold:#ffad0a;--gold2:#ffca54;--green:#16d89a;--blue:#2f7df6;--purple:#a84bf5;--red:#ff4766;--shadow:0 18px 45px rgba(0,0,0,.22)}
*{box-sizing:border-box}html,body{margin:0;font-family:'Plus Jakarta Sans',Arial,sans-serif;background:var(--bg);color:var(--text)}body{min-height:100vh}a{text-decoration:none;color:inherit}.app-shell{min-height:100vh;background:radial-gradient(circle at 90% 0,rgba(35,75,130,.12),transparent 28%),var(--bg)}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:244px;background:linear-gradient(180deg,#101a2b,#0d1727);border-right:1px solid #22314a;color:#fff;padding:19px 11px;display:flex;flex-direction:column;z-index:40}.premium-brand{display:flex;align-items:center;gap:12px;padding:0 5px 18px;border-bottom:1px solid #243149}.brand-mark{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#ffb512,#ff9e00);display:grid;place-items:center;color:#151b25;font-weight:900;font-size:22px;box-shadow:0 0 28px rgba(255,173,10,.22)}.brand strong{display:block;font-size:17px;letter-spacing:.015em}.brand small{display:block;color:var(--gold);font-weight:800;font-size:10px;margin-top:5px}.tower-pill{margin:17px 0 23px;border:1px solid #5b4617;border-radius:9px;padding:10px;display:flex;align-items:center;gap:7px;font-size:11px;background:rgba(255,174,10,.035)}.tower-pill span{color:var(--gold);font-size:16px}.tower-pill em{margin-left:auto;background:#13c995;color:#03150f;font-style:normal;font-weight:800;font-size:8px;padding:4px 6px;border-radius:12px}.nav-label{font-size:9px;color:#65738a;font-weight:800;letter-spacing:.08em;padding:0 8px 8px}.sidebar nav{display:grid;gap:3px}.sidebar nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:8px;color:#c0c8d6;font-size:12px;position:relative}.sidebar nav a span{width:19px;text-align:center;color:#aab4c5;font-size:15px}.sidebar nav a:hover{background:#162238;color:#fff}.sidebar nav a.active{background:linear-gradient(90deg,rgba(255,173,10,.14),rgba(255,173,10,.03));color:var(--gold);font-weight:800;border-left:3px solid var(--gold)}.sidebar nav a.active span{color:var(--gold)}.nav-badge{margin-left:auto;font-size:9px;padding:2px 6px;border-radius:10px}.nav-badge.gold{background:var(--gold);color:#121212}.sidebar-bottom{margin-top:auto;border-top:1px solid #223149;padding:14px 8px}.logout{color:#9ca8ba;font-size:12px}.logout:hover{color:#fff}
.main{margin-left:244px;min-height:100vh}.premium-topbar{height:72px;border-bottom:1px solid #223149;background:rgba(8,14,25,.92);backdrop-filter:blur(12px);display:flex;align-items:center;padding:0 24px;gap:16px;position:sticky;top:0;z-index:30}.page-heading h1{font-size:19px;margin:0}.page-heading p{font-size:10px;color:var(--muted);margin:4px 0 0}.top-search{margin-left:auto;width:245px;height:37px;background:#0f1828;border:1px solid #2a3851;border-radius:18px;display:flex;align-items:center;padding:0 12px;gap:7px}.top-search span{color:#91a0b5}.top-search input{width:100%;border:0;background:transparent;color:#fff;outline:0;font:inherit;font-size:10px}.top-search input::placeholder{color:#68778e}.top-actions{display:flex;align-items:center;gap:9px}.icon-btn{width:38px;height:38px;border:1px solid #504017;border-radius:10px;background:#111a29;color:var(--gold);position:relative;cursor:pointer;font-size:17px}.icon-btn b{position:absolute;right:-5px;top:-7px;background:#ff462f;color:#fff;border:2px solid var(--bg);font-size:8px;padding:2px 5px;border-radius:11px}.profile-chip{display:flex;align-items:center;gap:8px;margin-left:2px}.profile-chip>span{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#3a8bff,#1d51d9);font-size:11px;font-weight:800;border:2px solid #5e9dff}.profile-chip b,.profile-chip small{display:block}.profile-chip b{font-size:10px}.profile-chip small{font-size:8px;color:#21d895;margin-top:2px}.menu-btn{display:none}
.content{padding:22px 24px 28px}.footer{padding:13px 24px 22px;color:#67758b;font-size:9px;display:flex;justify-content:space-between;border-top:1px solid #142035}.grid{display:grid;gap:14px}.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.card{background:linear-gradient(160deg,#111b2b,#0e1726);border:1px solid #22334d;border-radius:12px;box-shadow:var(--shadow);padding:17px}.card.accent-gold{border-color:#725316}.card.accent-green{border-color:#125946}.card.accent-blue{border-color:#244d88}.card.accent-purple{border-color:#55316e}.card.accent-red{border-color:#76273b}.stat{min-height:118px;position:relative;overflow:hidden}.stat small{color:#9ba5b5;font-size:9px;font-weight:800;text-transform:uppercase}.stat h3{font-size:21px;margin:16px 0 5px}.stat p{font-size:10px;color:#a4adbc;margin:0}.stat-icon{position:absolute;right:14px;top:14px;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font-size:16px}.stat-icon.gold{background:rgba(255,173,10,.12);color:var(--gold)}.stat-icon.green{background:rgba(22,216,154,.12);color:var(--green)}.stat-icon.blue{background:rgba(47,125,246,.14);color:var(--blue)}.stat-icon.purple{background:rgba(168,75,245,.14);color:var(--purple)}.stat-icon.red{background:rgba(255,71,102,.13);color:var(--red)}
.section-title{display:flex;align-items:center;justify-content:space-between;margin:20px 0 10px}.section-title h2{font-size:14px;margin:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 13px;border-radius:8px;border:1px solid transparent;font-weight:800;font-size:10px;cursor:pointer;white-space:nowrap}.btn-gold{background:linear-gradient(180deg,#ffb921,#f19b00);color:#15181d;box-shadow:0 5px 18px rgba(255,173,10,.16)}.btn-outline-gold{border-color:#b97800;color:var(--gold);background:transparent}.btn-dark{background:#182438;color:#fff;border-color:#2a3b55}.btn-light{background:#131f31;border-color:#2a3a52;color:#dfe6ef}.btn-danger{background:#3a1720;color:#ff8396;border-color:#712d3c}.btn-sm{padding:6px 8px;font-size:9px}.table-wrap{overflow:auto;background:#0f1827;border:1px solid #223149;border-radius:11px}.table{width:100%;border-collapse:collapse;min-width:820px}.table th,.table td{padding:12px 13px;border-bottom:1px solid #1d2a3f;text-align:left;font-size:10px;vertical-align:middle}.table th{color:#7e8ba0;background:#101b2c;font-size:8px;text-transform:uppercase;letter-spacing:.04em}.table tr:hover td{background:#111c2c}.table tr:last-child td{border-bottom:0}.table a b{color:#fff}.table small{color:#7f8da1}.badge{display:inline-flex;padding:4px 7px;border-radius:14px;font-size:8px;font-weight:800;background:#263349;color:#cbd4e1}.badge.green{background:rgba(22,216,154,.13);color:var(--green);border:1px solid rgba(22,216,154,.25)}.badge.red{background:rgba(255,71,102,.13);color:#ff6b82;border:1px solid rgba(255,71,102,.25)}.badge.gold{background:rgba(255,173,10,.13);color:var(--gold);border:1px solid rgba(255,173,10,.25)}.badge.blue{background:rgba(47,125,246,.13);color:#60a0ff;border:1px solid rgba(47,125,246,.25)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.input,select,textarea{width:100%;padding:10px 11px;border:1px solid #2a3850;border-radius:8px;background:#0d1726;color:#f5f7fb;font:inherit;font-size:10px;outline:none}.input:focus,select:focus,textarea:focus{border-color:#a66d00;box-shadow:0 0 0 3px rgba(255,173,10,.08)}select option{background:#111b2b}textarea{min-height:105px;resize:vertical}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.form-group label{display:block;font-size:9px;font-weight:800;color:#9ba7b9;margin:0 0 6px}.span-2{grid-column:span 2}.form-actions{display:flex;gap:8px;margin-top:16px}.alert{padding:11px 13px;border-radius:8px;margin-bottom:14px;font-size:10px}.alert-success{background:#0e2b24;color:#63e6b6;border:1px solid #174a3d}.alert-danger{background:#321820;color:#ff8296;border:1px solid #66303f}.alert-warning{background:#332815;color:#ffd06b;border:1px solid #665128}.empty{text-align:center;color:#6f7d91;padding:28px}.muted{color:var(--muted)}.nowrap{white-space:nowrap}
.split{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}.detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.detail-list div{padding:11px;border:1px solid #213048;border-radius:8px;background:#0d1725}.detail-list small{display:block;color:#74839a;margin-bottom:4px;font-size:8px}
.tower-card{min-height:124px}.tower-card h3{margin:0;font-size:14px}.tower-card p{margin:4px 0 14px;color:#8c98aa;font-size:9px}.tower-top{display:flex;align-items:flex-start;justify-content:space-between}.progress{height:9px;background:#1d2a3c;border-radius:9px;overflow:hidden}.progress span{display:block;height:100%;border-radius:9px}.progress.gold span{background:linear-gradient(90deg,#ffbd29,#ef9000)}.progress.blue span{background:linear-gradient(90deg,#3e8cff,#2266e8)}.progress-meta{display:flex;justify-content:space-between;font-size:10px;margin-top:13px}.gold-text{color:var(--gold)}.green-text{color:var(--green)}.blue-text{color:#4f91ff}
.alert-panel{min-height:162px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.panel-head h3{font-size:13px;margin:0}.visit-line{display:flex;align-items:center;justify-content:space-between;padding:10px;border-left:3px solid var(--gold);border-radius:7px;background:linear-gradient(90deg,rgba(255,173,10,.08),rgba(255,173,10,.02));margin-top:8px}.visit-line b,.visit-line small{display:block}.visit-line b{font-size:10px}.visit-line small{color:var(--gold);font-size:8px;margin-top:3px}.overdue-line{padding:11px;border-left:3px solid var(--red);border-radius:7px;background:linear-gradient(90deg,rgba(255,71,102,.13),rgba(255,71,102,.04));display:flex;align-items:center;justify-content:space-between}.overdue-line b{font-size:10px}.overdue-line small{display:block;color:#ff627b;font-size:8px;margin-top:4px}
.chart-card h3{font-size:12px;margin:0 0 14px}.donut-wrap{display:flex;align-items:center;gap:18px}.donut{width:126px;height:126px;border-radius:50%;background:conic-gradient(#2f7df6 0 34%,#9747ef 34% 60%,#16c98d 60% 81%,#ffae14 81% 94%,#ff4e61 94% 100%);position:relative;display:grid;place-items:center}.donut:after{content:'';position:absolute;width:76px;height:76px;border-radius:50%;background:#101928}.donut-center{z-index:1;text-align:center}.donut-center b{display:block;font-size:18px}.donut-center small{font-size:8px;color:#9aa6b7}.legend{display:grid;gap:7px;font-size:8px;min-width:120px}.legend div{display:flex;align-items:center;justify-content:space-between;gap:9px}.legend i{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:6px}.bar-chart{height:130px;display:flex;align-items:flex-end;gap:13px;padding:12px 8px 0;border-left:1px solid #2d3c54;border-bottom:1px solid #2d3c54}.bar-chart div{flex:1;text-align:center;position:relative}.bar-chart span{display:block;background:linear-gradient(180deg,#388cff,#175cdb);border-radius:3px 3px 0 0;min-height:8px}.bar-chart small{position:absolute;top:100%;left:50%;transform:translateX(-50%);color:#78869a;font-size:8px;margin-top:7px}.recent-list{display:grid;gap:5px}.recent-person{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #1d2a3e}.recent-person:last-child{border-bottom:0}.avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#16c98d;color:#071810;font-size:9px;font-weight:800}.recent-person b{font-size:9px}.recent-person small{display:block;color:#8591a4;font-size:8px;margin-top:2px}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(4px);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:.15s}.modal-backdrop.show{opacity:1}.modal-backdrop[hidden]{display:none}.alert-modal{width:min(580px,100%);max-height:86vh;overflow:auto;background:#101a2d;border:1px solid #815c13;border-radius:13px;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 35px rgba(255,173,10,.08)}.modal-head{display:flex;gap:10px;align-items:center;padding:14px 18px;border-bottom:1px solid #28364e}.modal-icon{width:35px;height:35px;background:var(--gold);color:#111;border-radius:8px;display:grid;place-items:center}.modal-head h3{margin:0;font-size:13px}.modal-head p{margin:2px 0 0;font-size:8px;color:var(--gold)}.close-x{margin-left:auto;background:transparent;border:0;color:#98a4b5;font-size:20px;cursor:pointer}.modal-body{padding:15px 18px}.visit-card{border:1px solid #604716;background:#121c2c;border-radius:9px;padding:12px;margin-bottom:9px}.visit-top{display:flex;justify-content:space-between;align-items:center}.visit-time{font-size:9px;color:var(--gold)}.visit-card h4{font-size:11px;margin:9px 0 4px}.visit-card p{font-size:8px;color:#8e9bad;margin:0}.modal-foot{display:flex;justify-content:space-between;gap:9px;padding:12px 18px;border-top:1px solid #28364e}
.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 70% 20%,#23344f 0,#0f1725 30%,#070b12 70%);padding:20px}.login-card{width:min(430px,100%);background:linear-gradient(160deg,#121d2e,#0d1522);border:1px solid #2a3952;border-radius:16px;padding:30px;box-shadow:0 30px 80px rgba(0,0,0,.45)}.login-logo{display:flex;align-items:center;gap:12px;margin-bottom:24px}.login-card h1{margin:0 0 6px;font-size:22px}.login-card p{color:var(--muted);font-size:10px}.install{max-width:760px;margin:40px auto;padding:0 20px}
@media(max-width:1200px){.grid-5{grid-template-columns:repeat(3,1fr)}.top-search{display:none}.profile-chip div{display:none}}
@media(max-width:980px){.grid-5,.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:1fr 1fr}.split{grid-template-columns:1fr}.profile-chip{display:none}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.menu-btn{display:block;border:0;background:#152136;color:#fff;padding:8px 10px;border-radius:7px}.premium-topbar{padding:0 12px}.content{padding:16px 12px}.grid-5,.grid-4,.grid-3,.grid-2,.form-grid,.detail-list{grid-template-columns:1fr}.span-2{grid-column:span 1}.top-actions .btn-outline-gold{display:none}.top-actions .btn-gold{font-size:0;padding:9px}.top-actions .btn-gold:after{content:'+';font-size:16px}.page-heading p{display:none}.card{padding:14px}.footer{padding:12px}}


/* =====================================================
   AL-MADNI CRM — TYPOGRAPHY READABILITY UPGRADE
   ===================================================== */

html {
    font-size: 16px;
}

body {
    font-size: 16px;
    line-height: 1.55;
}

/* Sidebar */
.sidebar,
.sidebar a,
.sidebar-nav a,
.nav-item {
    font-size: 15px !important;
}

.sidebar .brand-title,
.brand-name {
    font-size: 20px !important;
}

.sidebar .brand-subtitle,
.sidebar-label,
.nav-section-title {
    font-size: 12px !important;
}

/* Main page heading */
.page-title,
.topbar h1,
.main-header h1 {
    font-size: 25px !important;
}

.page-subtitle,
.topbar-subtitle {
    font-size: 13px !important;
}

/* KPI cards */
.kpi-card .label,
.stat-card .label,
.metric-label {
    font-size: 13px !important;
}

.kpi-card .value,
.stat-card .value,
.metric-value {
    font-size: 28px !important;
    line-height: 1.2 !important;
}

.kpi-card .sub,
.stat-card .sub,
.metric-subtitle {
    font-size: 13px !important;
}

/* Dashboard cards and panels */
.card,
.panel,
.dashboard-card {
    font-size: 15px;
}

.card h2,
.card h3,
.panel h2,
.panel h3,
.dashboard-card h2,
.dashboard-card h3 {
    font-size: 18px !important;
}

/* General secondary / muted information */
.muted,
.text-muted,
.small,
small {
    font-size: 13px !important;
}

/* Tables */
table {
    font-size: 14px !important;
}

table th {
    font-size: 13px !important;
}

table td {
    font-size: 14px !important;
}

/* Forms */
input,
select,
textarea {
    font-size: 15px !important;
}

label {
    font-size: 14px !important;
}

/* Buttons */
.btn,
button {
    font-size: 14px !important;
}

/* Badges */
.badge,
.status-badge,
.pill {
    font-size: 12px !important;
}

/* Leads, visits and customer information */
.lead-name,
.customer-name,
.visit-name {
    font-size: 15px !important;
}

.lead-meta,
.customer-meta,
.visit-meta {
    font-size: 13px !important;
}

/* Chart legends */
.chart-legend,
.legend,
.chart-label {
    font-size: 13px !important;
}

/* User profile */
.user-name {
    font-size: 15px !important;
}

.user-role {
    font-size: 12px !important;
}

/* Footer */
footer,
.footer {
    font-size: 12px !important;
}

/* Improve readability on large desktop screens */
@media (min-width: 1400px) {
    body {
        font-size: 16px;
    }

    .sidebar,
    .sidebar a,
    .sidebar-nav a,
    .nav-item {
        font-size: 15px !important;
    }
}

/* ===== AL-MADNI CRM - SMALL TEXT FIX ===== */

/* Recent Leads */
.recent-lead-item,
.recent-leads .lead-item {
    font-size: 16px !important;
}

.recent-lead-item .lead-name,
.recent-leads .lead-name {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.recent-lead-item .lead-detail,
.recent-lead-item .lead-meta,
.recent-leads .lead-detail,
.recent-leads .lead-meta {
    font-size: 15px !important;
    line-height: 1.5 !important;
}

/* Today's Planned Visits */
.visit-item,
.visit-card,
.visit-row {
    font-size: 16px !important;
}

.visit-item strong,
.visit-card strong,
.visit-row strong {
    font-size: 16px !important;
    font-weight: 700 !important;
}

.visit-item small,
.visit-card small,
.visit-row small {
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* Dashboard small text fallback */
.dashboard-card small,
.dashboard-card .small,
.card small,
.card .small {
    font-size: 14px !important;
}

/* Recent lead avatar initials */
.recent-lead-item .avatar,
.recent-leads .avatar {
    font-size: 13px !important;
    font-weight: 700 !important;
}

/* Panel headings */
.dashboard-card h3,
.card h3 {
    font-size: 19px !important;
}

/* ===== RECENT LEADS EXACT FONT FIX ===== */

.recent-list .recent-person {
    padding: 15px 0 !important;
}

.recent-list .recent-person b {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.recent-list .recent-person small {
    font-size: 15px !important;
    line-height: 1.45 !important;
    margin-top: 3px !important;
}

.recent-list .recent-person .avatar {
    font-size: 13px !important;
    font-weight: 800 !important;
}

.recent-list .recent-person .badge {
    font-size: 12px !important;
    padding: 5px 9px !important;
}

/* ==================================================
   AL-MADNI OFFICIAL DARK GREEN THEME
   ================================================== */

/* Main page background */
html,
body {
    background: #062f30 !important;
}

/* Main application/content background */
.app,
.app-shell,
.main,
main,
.main-content,
.content,
.page-content {
    background-color: #062f30 !important;
}

/* Sidebar - slightly deeper green */
.sidebar {
    background: #05292a !important;
}

/* Top navigation/header */
.topbar,
.top-bar,
.header,
.app-header {
    background: #062b2c !important;
}

/* Dashboard cards */
.card,
.panel,
.stat-card,
.chart-card {
    background: #0b3839 !important;
}

/* Inner rows / lead / visit areas */
.recent-person,
.visit-line,
.overdue-line,
.table-wrap {
    background-color: #0a3435 !important;
}

/* Borders */
.card,
.panel,
.stat-card,
.chart-card {
    border-color: rgba(202, 161, 66, 0.22) !important;
}

/* Keep Al-Madni gold accents */
:root {
    --gold: #caa142;
    --accent: #caa142;
}

/* AL-MADNI OFFICIAL GREEN THEME */

/* Exact background color: #023020 */
html,
body,
.app,
.app-shell,
.main,
main,
.main-content,
.content,
.page-content {
    background: #023020 !important;
}

/* Sidebar */
.sidebar {
    background: #023020 !important;
}

/* Header / Topbar */
.topbar,
.top-bar,
.header,
.app-header {
    background: #023020 !important;
}

/* Dashboard cards - slightly different for visibility */
.card,
.panel,
.stat-card,
.chart-card {
    background: #073a35 !important;
}

/* Inner rows */
.recent-person,
.visit-line,
.overdue-line,
.table-wrap {
    background: #093d38 !important;
}

/* ==================================================
   AL-MADNI LIGHT THEME
   Brand Color: #023020
   ================================================== */

:root {
    --brand-green: #023020;
    --brand-green-soft: #eaf3f0;
    --brand-green-pale: #f4f8f6;
    --brand-gold: #caa142;

    --bg: #f7f9f8;
    --surface: #ffffff;
    --surface-2: #f0f5f3;
    --text: #15201d;
    --muted: #6f7d78;
    --border: #dbe5e1;
}

/* Main background */
html,
body,
.app,
.app-shell,
.main,
main,
.main-content,
.content,
.page-content {
    background: var(--bg) !important;
    color: var(--text) !important;
}

/* Sidebar */
.sidebar {
    background: #ffffff !important;
    color: var(--text) !important;
    border-right: 1px solid var(--border) !important;
}

/* Sidebar navigation */
.sidebar a,
.sidebar .nav-item {
    color: #31423d !important;
}

.sidebar a:hover,
.sidebar a.active,
.sidebar .nav-item:hover,
.sidebar .nav-item.active {
    background: var(--brand-green-soft) !important;
    color: var(--brand-green) !important;
}

/* Topbar */
.topbar,
.top-bar,
.header,
.app-header {
    background: #ffffff !important;
    border-bottom: 1px solid var(--border) !important;
    color: var(--text) !important;
}

/* Cards */
.card,
.panel,
.stat-card,
.chart-card,
.dashboard-card {
    background: #ffffff !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 8px 22px rgba(2, 48, 32, 0.06) !important;
}

/* Inner sections */
.recent-person,
.visit-line,
.overdue-line,
.table-wrap {
    background: var(--surface-2) !important;
    color: var(--text) !important;
}

/* Headings */
h1,
h2,
h3,
h4,
.page-title,
.panel-title {
    color: var(--brand-green) !important;
}

/* Muted text */
small,
.muted,
.text-muted,
.page-subtitle,
.user-role {
    color: var(--muted) !important;
}

/* Tables */
.table,
table {
    background: #ffffff !important;
    color: var(--text) !important;
}

.table th,
table th {
    background: #eef4f1 !important;
    color: var(--brand-green) !important;
}

.table td,
table td {
    border-color: var(--border) !important;
}

/* Inputs */
input,
select,
textarea {
    background: #ffffff !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}

/* Primary buttons */
.btn-gold,
.btn-primary,
button.primary {
    background: var(--brand-green) !important;
    color: #ffffff !important;
    border-color: var(--brand-green) !important;
}

/* Secondary buttons */
.btn-light,
.btn-outline {
    background: #ffffff !important;
    color: var(--brand-green) !important;
    border: 1px solid var(--brand-green) !important;
}

/* Brand accents */
.badge.green,
.status-badge.green {
    background: #dff0e9 !important;
    color: var(--brand-green) !important;
}

/* Gold accent preserved */
.gold,
.accent-gold,
.brand-accent {
    color: var(--brand-gold) !important;
}

/* Footer */
.footer,
footer {
    background: transparent !important;
    color: var(--muted) !important;
}

/* =========================================================
   AL-MADNI CRM — FINAL LIGHT BRAND THEME
   Primary: #023020
   Gold:    #D4AF37
   ========================================================= */

:root {
    --am-green: #023020;
    --am-green-hover: #06452f;
    --am-green-soft: #edf5f1;
    --am-green-soft-2: #f5f9f7;

    --am-gold: #D4AF37;
    --am-gold-hover: #bd982b;
    --am-gold-soft: #fff8e4;

    --am-bg: #f4f7f5;
    --am-white: #ffffff;
    --am-text: #17211e;
    --am-muted: #6b7974;
    --am-border: #dce6e1;
}

/* ===== MAIN CRM ===== */

html,
body {
    background: var(--am-bg) !important;
    color: var(--am-text) !important;
}

.main,
main,
.main-content,
.content,
.page-content {
    background: var(--am-bg) !important;
    color: var(--am-text) !important;
}

/* ===== SIDEBAR ===== */

.sidebar {
    background: var(--am-green) !important;
    border-right: 1px solid rgba(212,175,55,.35) !important;
    color: #ffffff !important;
}

.sidebar a,
.sidebar .nav-item {
    color: rgba(255,255,255,.86) !important;
}

.sidebar a:hover,
.sidebar .nav-item:hover {
    background: rgba(212,175,55,.12) !important;
    color: #ffffff !important;
}

.sidebar a.active,
.sidebar .nav-item.active {
    background: var(--am-gold) !important;
    color: var(--am-green) !important;
    font-weight: 700 !important;
}

/* sidebar section labels */
.sidebar small,
.sidebar .muted,
.sidebar .nav-label {
    color: rgba(255,255,255,.62) !important;
}

/* ===== HEADER / TOP BAR ===== */

.topbar,
.top-bar,
.header,
.app-header {
    background: #ffffff !important;
    color: var(--am-text) !important;
    border-bottom: 1px solid var(--am-border) !important;
}

/* ===== CARDS / PANELS ===== */

.card,
.panel,
.stat-card,
.chart-card {
    background: #ffffff !important;
    color: var(--am-text) !important;
    border: 1px solid var(--am-border) !important;
    box-shadow: 0 5px 18px rgba(2,48,32,.06) !important;
}

/* subtle green top-level card accent */
.stat-card {
    border-top: 3px solid var(--am-green) !important;
}

/* ===== HEADINGS ===== */

h1,
h2,
h3,
h4,
.panel-head h3,
.card h3 {
    color: var(--am-green) !important;
}

/* ===== NORMAL TEXT ===== */

p,
small,
.muted,
.text-muted {
    color: var(--am-muted);
}

/* ===== INNER ROWS ===== */

.recent-person,
.visit-line,
.overdue-line {
    background: var(--am-green-soft-2) !important;
    color: var(--am-text) !important;
    border-color: var(--am-border) !important;
}

/* Names remain prominent */
.recent-person b,
.visit-line b,
.customer-name,
.lead-name,
.visitor-name {
    color: var(--am-green) !important;
    font-weight: 700 !important;
}

/* ===== PRIMARY BUTTONS ===== */

.btn-primary,
button.btn-primary {
    background: var(--am-green) !important;
    border-color: var(--am-green) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
button.btn-primary:hover {
    background: var(--am-green-hover) !important;
}

/* ===== GOLD ACTION BUTTONS ===== */

.btn-gold,
button.btn-gold {
    background: var(--am-gold) !important;
    border-color: var(--am-gold) !important;
    color: var(--am-green) !important;
    font-weight: 700 !important;
}

.btn-gold:hover,
button.btn-gold:hover {
    background: var(--am-gold-hover) !important;
}

/* ===== OUTLINE / SECONDARY BUTTONS ===== */

.btn-light,
.btn-outline {
    background: #ffffff !important;
    border: 1px solid var(--am-green) !important;
    color: var(--am-green) !important;
}

.btn-light:hover,
.btn-outline:hover {
    background: var(--am-green-soft) !important;
}

/* ===== FORMS ===== */

input,
select,
textarea {
    background: #ffffff !important;
    color: var(--am-text) !important;
    border: 1px solid #ccd9d3 !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--am-green) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(2,48,32,.10) !important;
}

/* ===== TABLES ===== */

table {
    background: #ffffff !important;
    color: var(--am-text) !important;
}

table th {
    background: var(--am-green) !important;
    color: #ffffff !important;
    border-color: var(--am-green) !important;
}

table td {
    background: #ffffff !important;
    color: var(--am-text) !important;
    border-color: var(--am-border) !important;
}

table tbody tr:hover td {
    background: var(--am-green-soft-2) !important;
}

/* ===== STATUS BADGES ===== */

.badge,
.status-badge,
.pill {
    font-weight: 700 !important;
}

/* ===== SEARCH ===== */

.search-box,
.search {
    background: #ffffff !important;
    border-color: var(--am-border) !important;
    color: var(--am-text) !important;
}

/* ===== GOLD ACCENTS ===== */

.accent-gold,
.gold {
    color: var(--am-gold) !important;
}

/* ===== PROGRESS BARS ===== */

.progress {
    background: #e4ece8 !important;
}

.progress-bar {
    background: var(--am-green) !important;
}

/* ===== LINKS ===== */

.main-content a:not(.btn),
.content a:not(.btn) {
    color: var(--am-green);
}

/* ===== FOOTER ===== */

footer,
.footer {
    color: var(--am-muted) !important;
    border-color: var(--am-border) !important;
}

/* ===== SELECTION ===== */

::selection {
    background: var(--am-gold);
    color: var(--am-green);
}

/* =========================================================
   AL-MADNI CRM — FINAL DARK GREEN + GOLD THEME
   Primary Green: #023020
   Gold: #D4AF37
   ========================================================= */

:root{
    --am-green: #023020;
    --am-green-deep: #011F1A;
    --am-green-card: #073A35;
    --am-green-card-2: #0A403A;

    --am-gold: #D4AF37;
    --am-gold-hover: #E3C24D;

    --am-teal: #18D6A3;
    --am-blue: #66C7FF;

    --am-text: #FFFFFF;
    --am-muted: #AFC4BD;
    --am-border: rgba(212,175,55,.24);
}

/* MAIN BACKGROUND */
html,
body,
.app,
.main,
main,
.main-content,
.content,
.page-content{
    background: var(--am-green-deep) !important;
    color: var(--am-text) !important;
}

/* SIDEBAR */
.sidebar{
    background: var(--am-green) !important;
    color: #fff !important;
    border-right: 1px solid rgba(212,175,55,.22) !important;
}

/* SIDEBAR LINKS */
.sidebar a,
.sidebar .nav-item{
    color: rgba(255,255,255,.90) !important;
}

.sidebar a:hover,
.sidebar .nav-item:hover{
    background: rgba(212,175,55,.10) !important;
    color: #fff !important;
}

/* ACTIVE NAV */
.sidebar a.active,
.sidebar .nav-item.active{
    background: var(--am-gold) !important;
    color: var(--am-green-deep) !important;
    font-weight: 800 !important;
}

/* SIDEBAR LABELS */
.sidebar small,
.sidebar .muted,
.sidebar .nav-label{
    color: #9EC8BA !important;
}

/* TOP HEADER */
.topbar,
.top-bar,
.header,
.app-header{
    background: var(--am-green-deep) !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(212,175,55,.18) !important;
}

/* CARDS */
.card,
.panel,
.stat-card,
.chart-card,
.dashboard-card{
    background: var(--am-green-card) !important;
    color: #fff !important;
    border: 1px solid var(--am-border) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.18) !important;
}

/* INNER CARD ROWS */
.recent-person,
.visit-line,
.overdue-line,
.table-wrap{
    background: var(--am-green-card-2) !important;
    color: #fff !important;
    border-color: rgba(255,255,255,.08) !important;
}

/* HEADINGS */
h1,
h2,
h3,
h4,
.panel-head h3,
.card h3,
.page-title{
    color: #fff !important;
}

/* SECONDARY TEXT */
small,
.muted,
.text-muted,
.page-subtitle,
.user-role{
    color: var(--am-muted) !important;
}

/* NAMES */
.recent-person b,
.visit-line b,
.customer-name,
.lead-name,
.visitor-name{
    color: #fff !important;
    font-weight: 700 !important;
}

/* PRIMARY GREEN BUTTON */
.btn-primary,
button.btn-primary{
    background: var(--am-green) !important;
    color: #fff !important;
    border: 1px solid var(--am-gold) !important;
}

/* GOLD ACTION BUTTONS */
.btn-gold,
button.btn-gold{
    background: var(--am-gold) !important;
    color: var(--am-green-deep) !important;
    border-color: var(--am-gold) !important;
    font-weight: 800 !important;
}

.btn-gold:hover,
button.btn-gold:hover{
    background: var(--am-gold-hover) !important;
}

/* OUTLINE BUTTONS */
.btn-light,
.btn-outline{
    background: transparent !important;
    color: var(--am-gold) !important;
    border: 1px solid var(--am-gold) !important;
}

.btn-light:hover,
.btn-outline:hover{
    background: rgba(212,175,55,.12) !important;
}

/* INPUTS */
input,
select,
textarea{
    background: #052A25 !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.13) !important;
}

input::placeholder,
textarea::placeholder{
    color: #8EAAA1 !important;
}

input:focus,
select:focus,
textarea:focus{
    border-color: var(--am-gold) !important;
    box-shadow: 0 0 0 3px rgba(212,175,55,.12) !important;
}

/* TABLES */
table{
    background: var(--am-green-card) !important;
    color: #fff !important;
}

table th{
    background: var(--am-green) !important;
    color: var(--am-gold) !important;
    border-color: rgba(255,255,255,.07) !important;
}

table td{
    background: var(--am-green-card) !important;
    color: #fff !important;
    border-color: rgba(255,255,255,.07) !important;
}

table tbody tr:hover td{
    background: #0B463F !important;
}

/* BADGES */
.badge,
.status-badge,
.pill{
    font-weight: 700 !important;
}

/* Available / success */
.badge.green,
.status-badge.green{
    background: rgba(24,214,163,.15) !important;
    color: var(--am-teal) !important;
    border: 1px solid rgba(24,214,163,.25) !important;
}

/* Gold / warning */
.badge.gold{
    background: rgba(212,175,55,.15) !important;
    color: var(--am-gold) !important;
    border: 1px solid rgba(212,175,55,.25) !important;
}

/* Blue */
.badge.blue{
    background: rgba(102,199,255,.12) !important;
    color: var(--am-blue) !important;
}

/* Red */
.badge.red{
    background: rgba(255,91,91,.13) !important;
    color: #FF6A6A !important;
}

/* SEARCH */
.search-box,
.search{
    background: #052A25 !important;
    border-color: rgba(255,255,255,.12) !important;
    color: #fff !important;
}

/* PROGRESS */
.progress{
    background: rgba(255,255,255,.10) !important;
}

.progress-bar{
    background: linear-gradient(90deg,var(--am-gold),#F0CC58) !important;
}

/* LINKS */
.main-content a:not(.btn),
.content a:not(.btn){
    color: var(--am-gold);
}

/* FOOTER */
footer,
.footer{
    color: #809D94 !important;
    border-color: rgba(255,255,255,.08) !important;
}

/* GOLD ACCENTS */
.gold,
.accent-gold{
    color: var(--am-gold) !important;
}

/* SELECTION */
::selection{
    background: var(--am-gold);
    color: var(--am-green-deep);
}

/* Sidebar reminder count - high contrast */
.sidebar .badge,
.sidebar .status-badge {
    color: #023020 !important;
    font-weight: 800 !important;
}

/* Specifically notification/reminder count */
.sidebar-nav .badge,
.nav-item .badge,
.sidebar a .badge {
    background: #e0b832 !important;
    color: #023020 !important;
    border: 1px solid #f2cf58 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

/* FIX: Site Visit Reminder Number */
.nav-badge.gold {
    background: #DDB832 !important;
    color: #023020 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    min-width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    text-align: center !important;
    border-radius: 50% !important;
    display: inline-block !important;
}