/* ============================================================
   IBM Carbon (Gray-10 light theme) for modipay.in
   Authoritative theme layer. Loaded last on every page.
   Tokens taken from IBM Carbon Design System (g10).
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
    /* Carbon g10 tokens */
    --cds-background:#f4f4f4;
    --cds-layer:#ffffff;          /* card / raised surface */
    --cds-layer-accent:#e0e0e0;
    --cds-field:#f4f4f4;          /* input field bg */
    --cds-text:#161616;           /* text-primary */
    --cds-text-2:#525252;         /* text-secondary */
    --cds-text-help:#6f6f6f;      /* helper */
    --cds-text-placeholder:#a8a8a8;
    --cds-border-subtle:#e0e0e0;
    --cds-border-strong:#8d8d8d;
    --cds-blue:#0f62fe;           /* interactive-01 / link */
    --cds-blue-hover:#0353e9;
    --cds-blue-active:#002d9c;
    --cds-navy:#001d6c;
    --cds-blue-tint:#edf5ff;      /* hover / selected row */
    --cds-success:#24a148;
    --cds-error:#da1e28;
    --cds-warning:#f1c21b;
    --cds-focus:#0f62fe;
    /* spacing scale */
    --sp-2:2px; --sp-3:4px; --sp-4:8px; --sp-5:12px; --sp-6:16px;
    --sp-7:24px; --sp-8:32px; --sp-9:40px; --sp-10:48px;

    /* remap legacy accent tokens -> Carbon */
    --p:#0f62fe !important; --p2:#001d6c !important;
    --g:linear-gradient(135deg,#0f62fe,#001d6c) !important;
    --primary:#0f62fe !important; --primary-dark:#0353e9 !important;
    --success:#24a148 !important; --danger:#da1e28 !important;
    --warning:#f1c21b !important; --info:#0f62fe !important;
    --mp-bg:#f4f4f4 !important; --mp-card:#ffffff !important;
    --mp-orange:#0f62fe !important; --mp-muted:#525252 !important;
    --zap-c1:#0f62fe !important;
    --mp-border:#e0e0e0 !important; --mp-text:#161616 !important;
}

/* ---- typography ---------------------------------------------------- */
html{ -webkit-text-size-adjust:100%; }
body{
    font-family:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif !important;
    font-size:14px !important; line-height:1.43 !important;
    letter-spacing:0 !important;
    color:var(--cds-text) !important;
    -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,.page-title,.section-title,.profile-title{
    font-family:'IBM Plex Sans',sans-serif !important;
    color:var(--cds-text) !important; font-weight:600 !important;
    letter-spacing:0 !important;
}
h1,.page-title{ font-size:1.75rem !important; line-height:1.25 !important; font-weight:400 !important; }
h2{ font-size:1.5rem !important; font-weight:400 !important; }
h3{ font-size:1.25rem !important; }
code,kbd,pre,.mono{ font-family:'IBM Plex Mono',monospace !important; }
a{ color:var(--cds-blue) !important; text-decoration:none !important; }
a:hover{ color:var(--cds-blue-hover) !important; text-decoration:underline !important; }

/* ---- base shell ---------------------------------------------------- */
html, body, .content-wrapper, .page-wrapper, #sidebar-collapse{
    background:var(--cds-background) !important; color:var(--cds-text) !important;
}

/* ====================================================================
   SYSTEMATIC TEXT RESET
   The legacy theme hardcodes white/near-white text in hundreds of
   per-page rules (color:#fff, rgba(255,255,255,...)). :where() keeps
   specificity at 0 so the targeted colour rules below always win,
   while !important beats the (non-important) legacy rules.
   Scoped to content surfaces only — never the navy header/sidebar.
   ==================================================================== */
:where(.content-wrapper, .container-fluid, .page-content, .glass-card, .card,
       .ibox, .ibox-body, .wl-card, .stat-card, .dashboard-card, .signin-card,
       .main-panel, .page-inner)
 :where(h1,h2,h3,h4,h5,h6,p,span,div,td,th,li,label,small,strong,b,em,i,dt,dd,
        .font-strong,.nav-label,.title,.value,.sub,.desc,.card-text){
    color:var(--cds-text) !important;
}
/* secondary / muted text */
:where(.content-wrapper,.container-fluid,.glass-card,.card,.ibox,.wl-card,.signin-card)
 :where(.text-muted,.muted,.form-label,.sub,.help,.hint,.section-lead,.card-text,
        small.text-muted,.desc,.stat-label,.breadcrumb-item){
    color:var(--cds-text-2) !important;
}
::placeholder{ color:var(--cds-text-placeholder) !important; }

/* ---- top header bar (Carbon shell: dark, white text) --------------- */
.header, .page-brand{
    background:var(--cds-navy) !important;
    border:0 !important; border-bottom:1px solid var(--cds-navy) !important;
    box-shadow:none !important;
}
.header *, .page-brand *{ color:#ffffff !important; }
.page-brand .brand{ font-weight:600 !important; letter-spacing:.01em; }
.navbar-toolbar a, .navbar-toolbar i, .dropdown-user>a, .dropdown-user>a *{ color:rgba(255,255,255,.9) !important; }
.navbar-toolbar img{ border:2px solid rgba(255,255,255,.35) !important; border-radius:50% !important; }
.navbar-search .form-control{ background:rgba(255,255,255,.14) !important; color:#fff !important; border:0 !important; border-radius:0 !important; }
.navbar-search .form-control::placeholder{ color:rgba(255,255,255,.65) !important; }

/* ---- sidebar (white, Carbon side-nav) ------------------------------ */
.page-sidebar, #sidebar, #sidebar-collapse{
    background:var(--cds-layer) !important;
    border-right:1px solid var(--cds-border-subtle) !important;
    box-shadow:none !important;
}
.page-sidebar .admin-block{ border-bottom:1px solid var(--cds-border-subtle) !important; padding:var(--sp-6) !important; }
.page-sidebar .admin-info .font-strong{ color:var(--cds-text) !important; font-weight:600 !important; }
.page-sidebar .admin-info small{ color:var(--cds-text-help) !important; }
.side-menu li a{ padding:12px 16px !important; font-size:.875rem !important; }
.side-menu li a, .side-menu li a .nav-label{ color:var(--cds-text-2) !important; font-weight:400 !important; }
.side-menu li .sidebar-item-icon, .side-menu li .sidebar-item-icon svg{ color:var(--cds-text-2) !important; fill:var(--cds-text-2) !important; }
.side-menu li.heading{
    color:var(--cds-text-help) !important; background:transparent !important;
    text-transform:uppercase; font-size:.69rem !important; letter-spacing:.06em;
    font-weight:600 !important; padding:20px 16px 8px !important;
}
.side-menu>li>a{ border-left:3px solid transparent !important; border-radius:0 !important; }
.side-menu>li>a:hover{ background:var(--cds-blue-tint) !important; color:var(--cds-text) !important; }
.side-menu>li>a:hover .nav-label{ color:var(--cds-text) !important; }
.side-menu>li>a:hover .sidebar-item-icon, .side-menu>li>a:hover svg{ color:var(--cds-blue) !important; fill:var(--cds-blue) !important; }
.side-menu>li.active>a, .side-menu>li>a.active{ background:var(--cds-blue-tint) !important; border-left:3px solid var(--cds-blue) !important; }
.side-menu>li.active>a .nav-label, .side-menu>li>a.active .nav-label{ color:var(--cds-text) !important; font-weight:600 !important; }
.side-menu>li.active>a .sidebar-item-icon, .side-menu>li.active>a svg,
.side-menu>li>a.active .sidebar-item-icon, .side-menu>li>a.active svg{ color:var(--cds-blue) !important; fill:var(--cds-blue) !important; }

/* ---- cards / surfaces (Carbon tile: flat, 1px subtle border) ------- */
.glass-card, .card, .ibox, .wl-card, .stat-card, .dashboard-card, .signin-card,
.theme-config .theme-config-box, .price-card, .node-item{
    background:var(--cds-layer) !important;
    border:1px solid var(--cds-border-subtle) !important;
    border-radius:0 !important;
    box-shadow:none !important;
    backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
    color:var(--cds-text) !important;
}
.card-header, .ibox-head, .ibox-title{
    background:var(--cds-layer) !important;
    border-bottom:1px solid var(--cds-border-subtle) !important;
    color:var(--cds-text) !important; border-radius:0 !important;
    padding:16px 20px !important;
}
.card-header h3, .card-header h4, .ibox-title{ color:var(--cds-text) !important; font-size:1rem !important; font-weight:600 !important; }
.card-header h3 i, .card-header i, .ibox-title i{ color:var(--cds-blue) !important; }
.card-body, .ibox-body{ padding:20px !important; }
.card-footer, .card-footer.bg-white{ background:var(--cds-layer) !important; border-top:1px solid var(--cds-border-subtle) !important; }

/* KPI / stat cards */
.stat-card{ padding:20px !important; }
.stat-value{ color:var(--cds-text) !important; font-weight:600 !important; }
.stat-label{ color:var(--cds-text-2) !important; }
.stat-icon-wrap{ background:var(--cds-blue-tint) !important; color:var(--cds-blue) !important; border-radius:0 !important; }
.stat-icon-wrap i{ color:var(--cds-blue) !important; }
.stat-change{ color:var(--cds-text-2) !important; }

/* ---- buttons (Carbon button spec) --------------------------------- */
.btn, .btn-primary, .btn-primary-cta, .wl-btn, .btn-secondary, .btn-sm,
button[name="save_domain"]{
    border-radius:0 !important; box-shadow:none !important;
    font-family:'IBM Plex Sans',sans-serif !important; font-weight:400 !important;
    letter-spacing:0 !important; transition:background .11s,border-color .11s !important;
}
.btn-primary, .btn-primary-cta, .wl-btn, .btn.btn-primary, button[name="save_domain"]{
    background:var(--cds-blue) !important; border:1px solid var(--cds-blue) !important; color:#fff !important;
}
.btn-primary:hover, .btn-primary-cta:hover, .wl-btn:hover, .btn.btn-primary:hover{
    background:var(--cds-blue-hover) !important; border-color:var(--cds-blue-hover) !important; color:#fff !important;
}
.btn-primary:active, .btn.btn-primary:active{ background:var(--cds-blue-active) !important; }
.btn-secondary, .btn-outline-secondary, .btn-light, .dropdown-toggle-dash{
    background:var(--cds-layer) !important; color:var(--cds-blue) !important;
    border:1px solid var(--cds-blue) !important;
}
.btn-secondary:hover, .btn-outline-secondary:hover{ background:var(--cds-blue-tint) !important; }
.btn-success{ background:var(--cds-success) !important; border-color:var(--cds-success) !important; color:#fff !important; }
.btn-danger{ background:var(--cds-error) !important; border-color:var(--cds-error) !important; color:#fff !important; }
.btn:focus-visible, .btn:focus{ outline:2px solid var(--cds-focus) !important; outline-offset:2px !important; }

/* ---- forms / inputs (Carbon text input) --------------------------- */
.form-control, input[type="text"], input[type="password"], input[type="number"],
input[type="email"], input[type="search"], input[type="tel"], input[type="url"],
input[type="date"], select, textarea{
    background:var(--cds-field) !important; color:var(--cds-text) !important;
    border:0 !important; border-bottom:1px solid var(--cds-border-strong) !important;
    border-radius:0 !important; box-shadow:none !important;
    font-family:'IBM Plex Sans',sans-serif !important; font-size:.875rem !important;
    min-height:40px !important;
}
.form-control:focus, select:focus, textarea:focus, input:focus{
    border-bottom:2px solid var(--cds-focus) !important;
    outline:2px solid var(--cds-focus) !important; outline-offset:-2px !important;
    background:var(--cds-field) !important; color:var(--cds-text) !important;
}
label, .form-label{ color:var(--cds-text-2) !important; font-size:.75rem !important; font-weight:400 !important; letter-spacing:.02em; }
select option{ background:var(--cds-layer) !important; color:var(--cds-text) !important; }

/* ---- tables (Carbon data table) ----------------------------------- */
.table{ color:var(--cds-text) !important; background:var(--cds-layer) !important; border-collapse:collapse !important; }
.table thead th, .table th{
    background:var(--cds-background) !important; color:var(--cds-text) !important;
    border:0 !important; border-bottom:1px solid var(--cds-border-subtle) !important;
    font-weight:600 !important; font-size:.75rem !important; text-transform:none !important;
    letter-spacing:.02em; padding:12px 16px !important;
}
.table td{ border:0 !important; border-bottom:1px solid var(--cds-border-subtle) !important; color:var(--cds-text-2) !important; padding:14px 16px !important; }
.table tbody tr:hover td{ background:var(--cds-blue-tint) !important; }

/* ---- dropdown menu ------------------------------------------------- */
.dropdown-menu{
    background:var(--cds-layer) !important; border:1px solid var(--cds-border-subtle) !important;
    box-shadow:0 2px 6px rgba(0,0,0,.2) !important; border-radius:0 !important;
}
.dropdown-menu .dropdown-item, .dropdown-menu a{ color:var(--cds-text) !important; padding:11px 16px !important; }
.dropdown-menu .dropdown-item:hover{ background:var(--cds-blue-tint) !important; color:var(--cds-text) !important; }
.dropdown-divider{ border-color:var(--cds-border-subtle) !important; }

/* ---- tags / status badges (Carbon tag) ---------------------------- */
.badge, .badge-status{ border-radius:0 !important; font-weight:500 !important; padding:4px 10px !important; }
.badge-success-s, .Success, .badge.badge-success{ background:#defbe6 !important; color:#0e6027 !important; border:0 !important; }
.badge-danger-s, .badge.badge-danger{ background:#fff1f1 !important; color:#a2191f !important; border:0 !important; }
.badge-warning-s, .Pending, .badge.badge-warning{ background:#fcf4d6 !important; color:#684e00 !important; border:0 !important; }
.badge-primary, .badge.badge-info{ background:var(--cds-blue-tint) !important; color:var(--cds-blue-active) !important; border:0 !important; }

/* page heading / breadcrumb */
.page-heading{ border-bottom:1px solid var(--cds-border-subtle) !important; padding-bottom:12px !important; }
.breadcrumb{ background:transparent !important; padding-left:0 !important; }
.breadcrumb-item, .breadcrumb-item a{ color:var(--cds-text-2) !important; }

/* mobile drawer toggle on navy bar */
.my-mobile-toggle, .my-mobile-toggle-fixed{ color:#fff !important; }

/* scrollbars */
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-thumb{ background:var(--cds-border-strong) !important; border-radius:0 !important; }
::-webkit-scrollbar-track{ background:transparent !important; }

/* ====================================================================
   KILL 3D / glass / heavy decoration everywhere
   ==================================================================== */
.hero-visual, .hero-visual *, .node-center, .model-stack, .model-card,
.model-stack *, [style*="preserve-3d"], [style*="perspective"]{
    transform:none !important; perspective:none !important;
    transform-style:flat !important; animation:none !important;
}
*{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }

/* ---- auth pages (login / register) -------------------------------- */
.signin-glow, .signin-page .grid-bg{ opacity:0 !important; background:none !important; display:none !important; }
.signin-page{ background:var(--cds-background) !important; }
.signin-card{
    background:var(--cds-layer) !important; border:1px solid var(--cds-border-subtle) !important;
    border-radius:0 !important; box-shadow:0 2px 6px rgba(0,0,0,.06) !important; color:var(--cds-text) !important;
}
.signin-brand, .signin-brand *{ color:var(--cds-blue) !important; }
.signin-card .sub, .foot-line, .rem{ color:var(--cds-text-2) !important; }
.meta-row a, .foot-line a, .back-home{ color:var(--cds-blue) !important; }
.rem input{ accent-color:var(--cds-blue) !important; }

/* ---- register page: clean Carbon split (navy left, hide 3D) -------- */
.signup-left{ background:var(--cds-navy) !important; color:#fff !important; }
.signup-left *{ color:#fff !important; }
.signup-left .left-brand, .signup-left .left-brand *{ color:#fff !important; }
.left-stage, .model-stack, .model-card{ display:none !important; }
.signup-left .hero-accent, .signup-left h1 span{ color:#78a9ff !important; } /* blue-40 on navy */

/* register custom inputs */
.auth-input{
    background:var(--cds-field) !important; color:var(--cds-text) !important;
    border:0 !important; border-bottom:1px solid var(--cds-border-strong) !important;
    border-radius:0 !important; min-height:40px !important;
}
.auth-input:focus{ border-bottom:2px solid var(--cds-focus) !important; outline:2px solid var(--cds-focus) !important; outline-offset:-2px !important; }
