/* theme 20261010 - "Modern" theme layer for the front end (Karam CRM). Deep green + gold, the brand of the Umrah Groups page.
   Loaded ONLY when <html class="kh-modern"> (per user: user menu > Theme; default: setup System > Sys Settings);
   media="screen" -> prints, ReportViewer, A4 vouchers / invoices are never affected. Classic = this file not loaded. */
html.kh-modern{
  --primary:#146c54;--primary-d:#0f5743;--bg:#f6f4ee;--head:#0f2e25;
  --k-g:#0f3d2e;--k-g2:#14513f;--k-gd:#062319;--k-gold:#c8a44d;--k-gold-l:#ead08a;--k-ink:#0f2e25;--k-muted:#5f6f69;
  --k-line:#e5e1d6;--k-line2:#d6d1c3;--k-hover:#eef5f1;--k-sel:#e1efe8;--k-r:8px;--k-r-s:6px;
  --k-sh:0 1px 2px rgba(15,46,37,.05),0 6px 18px rgba(15,46,37,.07);--k-sh-h:0 10px 28px rgba(15,46,37,.14);
  --k-font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  --k-focus:0 0 0 3px rgba(20,108,84,.2)}
html.kh-modern,html.kh-modern body{background:var(--bg);font-family:var(--k-font);color:#3b4743}
html.kh-modern a{color:var(--primary)}html.kh-modern a:hover{color:var(--primary-d)}

/* ---------- top bar + menu ---------- */
html.kh-modern .header{background:linear-gradient(110deg,var(--k-gd) 0%,var(--k-g) 45%,var(--k-g2) 100%);border-bottom:0;box-shadow:0 2px 12px rgba(6,35,25,.25)}
html.kh-modern .header .logo-container{border-right:1px solid rgba(200,164,77,.25);background:#fff;border-radius:0 0 var(--k-r) 0}
html.kh-modern .header .home{color:var(--k-gold)}
html.kh-modern .header-nav>li>a{color:#f1ede1;letter-spacing:.3px;border-radius:var(--k-r-s);margin:10px 1px;padding:0 10px;transition:background-color .12s,color .12s}
html.kh-modern .header-nav>li:hover>a,html.kh-modern .header-nav>li.open>a{background:rgba(255,255,255,.1);color:var(--k-gold-l)}
html.kh-modern .header-nav .dropdown-menu{border-top:3px solid var(--k-gold);border-radius:0 0 var(--k-r) var(--k-r);box-shadow:0 16px 40px rgba(6,35,25,.18);padding:6px}
html.kh-modern .header-nav .mega-title{color:var(--k-g);border-bottom:1px solid var(--k-line)}
html.kh-modern .header-nav .dropdown-item{border-radius:var(--k-r-s);color:#3b4743}
html.kh-modern .header-nav .dropdown-item:hover{background:var(--k-hover);color:var(--k-g)}

/* ---------- page title band + user menu ---------- */
html.kh-modern .page-header{background:#fff;border-bottom:1px solid var(--k-line);box-shadow:0 1px 3px rgba(15,46,37,.05)}
html.kh-modern .page-header h2{color:var(--k-ink);font-weight:600;border-bottom:3px solid var(--k-gold)}
html.kh-modern .userbox{background:#fff;border-left:1px solid var(--k-line);border-right:1px solid var(--k-line);color:#3b4743}
html.kh-modern .userbox .name{color:var(--k-ink);font-weight:600}html.kh-modern .userbox .role{color:var(--k-muted)}
html.kh-modern .userbox .caret-down{color:var(--k-muted)}
html.kh-modern .userbox img{box-shadow:0 0 0 2px var(--k-gold)}
html.kh-modern .userbox .dropdown-menu{border:1px solid var(--k-line);border-top:3px solid var(--k-gold);border-radius:0 0 var(--k-r) var(--k-r);box-shadow:var(--k-sh-h);padding:6px}
html.kh-modern .userbox .dropdown-item{border-radius:var(--k-r-s)}
html.kh-modern .userbox .dropdown-item:hover{background:var(--k-hover);color:var(--k-g)}
html.kh-modern .nl-search{border-right:1px solid var(--k-line)}
html.kh-modern .nl-search input{border:1px solid var(--k-line2)}
html.kh-modern .nl-search .btn{border:1px solid var(--k-line2);border-left:0}
html.kh-modern .quick-search input{border-radius:var(--k-r-s) 0 0 var(--k-r-s);border-color:var(--k-line2);background:#fff}
html.kh-modern .quick-search .btn{background:var(--primary);color:#fff}
html.kh-modern .quick-search .btn:last-child,html.kh-modern .quick-search .dropdown .btn{border-radius:0 var(--k-r-s) var(--k-r-s) 0}

/* ---------- cards ---------- */
html.kh-modern .card{background:#fff;border:1px solid var(--k-line);border-radius:var(--k-r);box-shadow:var(--k-sh)}
html.kh-modern .card-header{background:#fff;border-top:0;border-bottom:1px solid var(--k-line);border-radius:var(--k-r) var(--k-r) 0 0!important}
html.kh-modern .card-header .card-title{color:var(--k-ink);font-weight:600;font-size:17px;letter-spacing:-.2px}
html.kh-modern .card-header:not(.blue) .card-title:before{content:"";display:inline-block;width:4px;height:16px;border-radius:2px;background:var(--k-gold);margin-right:10px;vertical-align:-2px}
html.kh-modern .card-header.blue{background:linear-gradient(110deg,var(--k-g) 0%,var(--k-g2) 100%);border-bottom:2px solid var(--k-gold)}
html.kh-modern .card-header.blue .card-title{color:#fff}
html.kh-modern .card-header .card-actions{color:var(--k-muted)}
html.kh-modern .card-body{background:#fff;border-radius:0 0 var(--k-r) var(--k-r)}
html.kh-modern .card-footer{background:#fbfaf6;border-top:1px solid var(--k-line);border-radius:0 0 var(--k-r) var(--k-r)}

/* ---------- buttons + inputs ---------- */
html.kh-modern .btn{border-radius:var(--k-r-s);transition:background-color .12s,border-color .12s,box-shadow .12s}
html.kh-modern .btn-primary{background:var(--primary);border-color:var(--primary)}
html.kh-modern .btn-primary:hover,html.kh-modern .btn-primary:active{background:var(--primary-d)!important;border-color:var(--primary-d)!important}
html.kh-modern .btn-default{border-color:var(--k-line2);color:#2f3b37}
html.kh-modern .btn-default:hover{background:#f4f2ea}
html.kh-modern .btn:focus,html.kh-modern .btn.focus{box-shadow:var(--k-focus)}
html.kh-modern .form-control{border-radius:var(--k-r-s);border-color:var(--k-line2)}
html.kh-modern .form-control:focus{border-color:var(--primary);box-shadow:var(--k-focus)}
html.kh-modern .dx-texteditor.dx-editor-outlined{border-radius:var(--k-r-s);border-color:var(--k-line2)}
html.kh-modern .dx-texteditor.dx-editor-outlined.dx-state-hover{border-color:#a9b7ae}
html.kh-modern .dx-texteditor.dx-editor-outlined.dx-state-focused{border-color:var(--primary);box-shadow:var(--k-focus)}
html.kh-modern .dx-checkbox-checked .dx-checkbox-icon{background-color:var(--primary);border-color:var(--primary);color:#fff}
html.kh-modern .dx-checkbox-icon{border-radius:4px}
html.kh-modern .dx-button-mode-contained.dx-button-default{background-color:var(--primary);border-radius:var(--k-r-s)}
html.kh-modern .dx-button-mode-contained.dx-button-default.dx-state-hover{background-color:var(--primary-d)}
html.kh-modern .dx-button{border-radius:var(--k-r-s)}
html.kh-modern .dx-form .dx-field-item-label-text,html.kh-modern .criteria label{color:var(--k-muted)}
html.kh-modern .dx-form-group-caption{color:var(--k-g);font-weight:600}
html.kh-modern .notice{border-radius:var(--k-r-s)}
html.kh-modern .notice.info{border-color:var(--primary);background:#eef6f2;color:#1d3d33}

/* ---------- grids: rounded, sticky headers, zebra rows ---------- */
html.kh-modern .content-body .dx-datagrid{border-radius:var(--k-r-s);font-family:var(--k-font)}
html.kh-modern .content-body .dx-datagrid-borders>.dx-datagrid-headers,html.kh-modern .content-body .dx-datagrid-borders>.dx-datagrid-rowsview,html.kh-modern .content-body .dx-datagrid-borders>.dx-datagrid-total-footer{border-color:var(--k-line)}
html.kh-modern .content-body .card-body>.dx-datagrid .dx-datagrid-headers,html.kh-modern .content-body .card-body>div>.dx-datagrid .dx-datagrid-headers{position:sticky;top:59px;z-index:8}
html.kh-modern .dx-datagrid-headers,html.kh-modern .dx-datagrid-headers .dx-header-row>td{background:#f4f1e8;color:#33403b;font-weight:600}
html.kh-modern .dx-datagrid-headers .dx-header-row>td{border-bottom:2px solid var(--k-line2)!important}
html.kh-modern .dx-datagrid .dx-row-lines>td,html.kh-modern .dx-datagrid .dx-column-lines>td{border-color:#eeebe3}
html.kh-modern .dx-datagrid-rowsview .dx-data-row:nth-child(even):not(.dx-selection)>td{background-color:#faf9f5}
html.kh-modern .dx-datagrid-rowsview .dx-row-alt>td,html.kh-modern .dx-datagrid-rowsview .dx-row-alt.dx-row:not(.dx-row-removed){background-color:#faf9f5}
html.kh-modern .dx-datagrid-rowsview .dx-data-row.dx-state-hover:not(.dx-selection)>td,html.kh-modern .dx-datagrid-rowsview .dx-data-row:hover:not(.dx-selection)>td{background-color:var(--k-hover)}
html.kh-modern .dx-datagrid-rowsview .dx-selection.dx-row>td,html.kh-modern .dx-datagrid-rowsview .dx-selection.dx-row:hover>td{background-color:var(--k-sel);color:#123}
html.kh-modern .dx-datagrid-pager{border-top:1px solid var(--k-line)}
html.kh-modern .dx-pager .dx-pages .dx-selection,html.kh-modern .dx-pager .dx-page-sizes .dx-selection{background-color:var(--primary);color:#fff;border-radius:var(--k-r-s)}
html.kh-modern .dx-pager .dx-page,html.kh-modern .dx-pager .dx-page-size{border-radius:var(--k-r-s)}
/* plain tables (dashboards, search) */
html.kh-modern .content-body .table{color:#33403b}
html.kh-modern .content-body .table thead th{background:#f4f1e8;color:#33403b;font-weight:600;border-bottom:2px solid var(--k-line2);border-top:0}
html.kh-modern .content-body .table-striped tbody tr:nth-of-type(odd){background:#faf9f5}
html.kh-modern .content-body .table tbody tr:hover{background:var(--k-hover)}
html.kh-modern .content-body .table td,html.kh-modern .content-body .table th{border-color:#eeebe3}
html.kh-modern .table-responsive{border-radius:var(--k-r-s)}
html.kh-modern .dash-table th{background:#f4f1e8}

/* ---------- dashboards ---------- */
html.kh-modern .my-area .tile{background:#fff;border:1px solid var(--k-line);border-radius:var(--k-r);box-shadow:0 1px 2px rgba(15,46,37,.05);color:#2f3b37;transition:box-shadow .15s,border-color .15s}
html.kh-modern .my-area .tile:hover{background:#fff;border-color:var(--k-gold);box-shadow:var(--k-sh-h)}
html.kh-modern .my-area .tile i,html.kh-modern .my-area .tile.green i{color:var(--k-g2)}
html.kh-modern .my-area .tile .cnt{background:var(--k-gold);color:var(--k-gd);font-weight:700}
html.kh-modern .big-card{border:1px solid rgba(200,164,77,.45);box-shadow:var(--k-sh-h)}
html.kh-modern .big-card.g-green{background:linear-gradient(150deg,#17573f 0%,#0f3d2e 60%,#0a2f23 100%)}
html.kh-modern .big-card.g-cyan{background:linear-gradient(150deg,#ead08a 0%,#c8a44d 100%)}
html.kh-modern .big-card.g-green,html.kh-modern .big-card.g-green h3,html.kh-modern .big-card.g-green p,html.kh-modern .big-card.g-green .arrow,html.kh-modern .big-card.g-green .ico{color:#fff}
html.kh-modern .big-card.g-green .ico{background:rgba(200,164,77,.22);color:var(--k-gold-l)}
html.kh-modern .big-card.g-green .cnt-badge{background:var(--k-gold);color:var(--k-gd)}
html.kh-modern .big-card.g-cyan,html.kh-modern .big-card.g-cyan h3,html.kh-modern .big-card.g-cyan p,html.kh-modern .big-card.g-cyan .arrow{color:var(--k-gd)}
html.kh-modern .big-card.g-cyan .ico{background:rgba(255,255,255,.35);color:var(--k-g)}
html.kh-modern .stat{background:#fff;border:1px solid var(--k-line);border-top:3px solid var(--k-gold);border-radius:var(--k-r);box-shadow:var(--k-sh)}
html.kh-modern .stat i{color:var(--k-g2)}
html.kh-modern .stat:hover{background:#fff;box-shadow:var(--k-sh-h)}
html.kh-modern .sum-chips .chip{border-radius:var(--k-r-s);box-shadow:0 1px 3px rgba(0,0,0,.12)}
html.kh-modern .sum-chips .chip.blue{background:var(--k-g2)}
html.kh-modern .sum-chips .chip b{color:var(--k-gold-l)}
html.kh-modern .balance-box .t{color:var(--k-g)}
html.kh-modern .balance-box .ic{background:var(--k-gold);color:var(--k-gd)}
html.kh-modern .country-cards a{border-radius:var(--k-r);background:linear-gradient(135deg,#0f3d2e,#14513f);box-shadow:var(--k-sh)}
html.kh-modern .country-cards a span{border-radius:0 var(--k-r-s) 0 var(--k-r)}
html.kh-modern .load-row .btn{border-radius:999px;padding:8px 20px}
html.kh-modern .rep-list .dx-datagrid-rowsview .dx-row.dx-selection>td{background:var(--primary)!important}
html.kh-modern .form-toolbar{background:var(--bg)}

/* ---------- sign in ---------- */
html.kh-modern body.sign{background:radial-gradient(circle at 20% 0%,#14513f 0%,#0f3d2e 45%,#062319 100%)}
html.kh-modern .card-sign{border:0;background:transparent;box-shadow:none}
html.kh-modern .card-sign .card-title-sign .title{background:var(--k-gold);color:var(--k-gd);border-radius:var(--k-r) var(--k-r) 0 0}
html.kh-modern .card-sign .card-body{border-top:4px solid var(--k-gold);border-radius:var(--k-r) 0 var(--k-r) var(--k-r);box-shadow:0 18px 50px rgba(0,0,0,.35)}
html.kh-modern .center-sign .logo img{background:#fff;border-radius:var(--k-r);padding:6px}
html.kh-modern body.sign .text-muted{color:#cfd8d3!important}
html.kh-modern .card-sign .input-group-text{background:#f4f1e8;border-color:var(--k-line2)}

/* keyboard focus */
html.kh-modern a:focus-visible,html.kh-modern button:focus-visible{outline:2px solid var(--primary);outline-offset:1px}
