html.modern-ui {
--ui-bg:#FFF8EE;--ui-panel:#FFFDF8;--ui-panel-2:#FFF4DE;--ui-border:#F2D18B;
--ui-text:#2C2C2C;--ui-muted:#8A6D3B;--ui-primary:#F05A28;--ui-primary-soft:#FFF4D8;
--ui-gold:#F4B400;--ui-gold-dark:#D99A00;--ui-orange:#F05A28;--ui-orange-dark:#D9481A;
--ui-success:#3BAA4A;--ui-warning:#F4B400;--ui-danger:#E53935;--ui-radius:8px;
font-size:14px;color-scheme:light;
}
html.modern-ui.dark-mode {
--ui-bg:#0b1220;--ui-panel:#111a2b;--ui-panel-2:#162135;--ui-border:#273449;
--ui-text:#e7edf7;--ui-muted:#94a3b8;--ui-primary:#F0824A;--ui-primary-soft:rgba(240,90,40,.16);
--ui-gold:#F5C34D;--ui-gold-dark:#D99A00;--ui-orange:#F0824A;--ui-orange-dark:#D9481A;
--ui-success:#4CC161;--ui-warning:#F5C34D;--ui-danger:#f87171;color-scheme:dark;
}
html.modern-ui body {
--bg-body:var(--ui-bg);--bg-sidebar:var(--ui-panel);--bg-content:var(--ui-bg);
--bg-card:var(--ui-panel);--bg-light:var(--ui-panel-2);--text-primary:var(--ui-text);
--text-secondary:var(--ui-muted);--text-muted:var(--ui-muted);--border-color:var(--ui-border);
--input-bg:var(--ui-panel-2);--primary-color:var(--ui-primary);--accent-color:var(--ui-primary);
background:var(--ui-bg)!important;color:var(--ui-text)!important;
font:14px/1.4 Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
}
html.modern-ui *{box-sizing:border-box;scrollbar-color:var(--ui-gold) transparent}
html.modern-ui :is(h1,h2,h3,h4,h5,h6){color:var(--ui-text)!important}
html.modern-ui :is(.text-muted,.form-text,small){color:var(--ui-muted)!important}
html.modern-ui a{color:var(--ui-primary)}
html.modern-ui .dashboard-wrapper{gap:8px;background:var(--ui-bg)!important;box-shadow:none!important}
html.modern-ui .sidebar{
width:238px;height:calc(100dvh - 16px);margin:8px 0 8px 8px;padding:10px 9px 14px;
background:linear-gradient(180deg,#fff 0%,#fffdf9 56%,#fff8e9 100%)!important;
border:1px solid #f1d9aa!important;border-radius:16px;
box-shadow:0 12px 34px rgba(128,78,15,.08)!important
}
html.modern-ui .sidebar.collapsed{width:72px;padding-inline:7px}
html.modern-ui .sidebar .brand-logo{
min-height:88px;padding:4px 8px 13px;margin:0 0 7px!important;
border-bottom:1px solid rgba(242,209,139,.48)
}
html.modern-ui .sidebar .brand-logo .logo-img{
height:60px!important;margin:0 0 4px!important;
filter:drop-shadow(0 7px 11px rgba(244,180,0,.25))
}
html.modern-ui .sidebar .brand-logo .logo-text{font-size:13px!important}
html.modern-ui .sidebar .menu-category-header{color:var(--ui-orange)!important;font-weight:700!important;letter-spacing:.04em!important}
html.modern-ui .sidebar :is(.nav-link,.menu-dropdown-btn){
min-height:42px;margin-bottom:4px;padding:9px 12px;gap:12px;border:1px solid transparent;border-radius:10px;
color:var(--ui-text)!important;font-size:13.5px;font-weight:600;line-height:1.2;
transition:background 180ms ease,color 180ms ease,border-color 180ms ease,box-shadow 180ms ease
}
html.modern-ui .sidebar :is(.nav-link,.menu-dropdown-btn) :is(i,svg){width:18px!important;height:18px!important;color:var(--ui-gold)!important}
html.modern-ui .sidebar :is(.nav-link,.menu-dropdown-btn):hover{
color:var(--ui-orange-dark)!important;background:#FFF3DA!important
}
html.modern-ui .sidebar :is(.nav-link,.menu-dropdown-btn):hover :is(i,svg){color:var(--ui-orange-dark)!important}
html.modern-ui .sidebar .nav-link.active{
color:var(--ui-orange-dark)!important;
background:linear-gradient(90deg,#fff1d3,#fff8e9)!important;
border-color:#f2d49b!important;
box-shadow:0 6px 16px rgba(215,137,17,.08)!important
}
html.modern-ui .sidebar .nav-link.active :is(i,svg){color:var(--ui-orange-dark)!important}
html.modern-ui .menu-dropdown-btn.active,
html.modern-ui .menu-dropdown-btn[aria-expanded="true"]{background:transparent!important}
html.modern-ui .sidebar-submenu{margin:1px 0 3px 17px;padding-left:6px;border-color:var(--ui-border)!important}
html.modern-ui .sidebar-submenu .nav-link{min-height:32px;padding:5px 8px;font-size:12px}
html.modern-ui.dark-mode .sidebar{
background:linear-gradient(180deg,var(--ui-panel),#111827)!important;
border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .sidebar .sidebar-plant-art{opacity:.32;filter:saturate(1.1)}
html.modern-ui .main-content{
position:relative;min-width:0;margin:8px 8px 8px 0!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border);border-radius:10px!important;box-shadow:none!important
}
html.modern-ui .global-daalsetu-watermark{
position:absolute;z-index:0;inset:70px 22px 30px;pointer-events:none;
background-position:center;background-repeat:no-repeat;background-size:min(58vw,720px) auto;
opacity:.04;filter:saturate(.82)
}
html.modern-ui .scrollable-content{position:relative}
html.modern-ui.dark-mode .global-daalsetu-watermark{opacity:.055;filter:grayscale(.1) brightness(1.4)}
html.modern-ui .scrollable-content{padding:12px 16px 16px!important}
html.modern-ui .page-content{max-width:none!important;width:100%;margin:0}
html.modern-ui .top-header{
min-height:60px;max-height:64px;flex-wrap:nowrap;padding:7px 0 8px;margin-bottom:10px;
background:transparent!important;border:0;border-bottom:1px solid var(--ui-border);border-radius:0
}
html.modern-ui .welcome-card{gap:1px!important;padding:0 4px!important;background:transparent!important}
html.modern-ui .welcome-card-title{color:var(--ui-text)!important;font-size:15px!important}
html.modern-ui .welcome-card-subtitle{color:var(--ui-muted)!important;font-size:12px!important}
html.modern-ui .header-actions{flex-wrap:nowrap;gap:5px}
html.modern-ui .header-icons .btn-icon{
width:34px;min-width:34px;height:34px;min-height:34px;margin:0;color:var(--ui-text)!important;
background:var(--ui-panel-2)!important;border:1px solid var(--ui-border)!important;border-radius:8px;
transition:background 180ms ease,color 180ms ease
}
html.modern-ui .header-icons .btn-icon:hover{
color:var(--ui-orange-dark)!important;background:#FFF4D8!important
}
html.modern-ui .header-profile-image{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important}
html.modern-ui .header-profile p{font-size:12px!important}.modern-ui .header-profile small{font-size:10px!important}
.theme-preset-control{
height:34px;display:inline-flex;align-items:center;gap:5px;padding:0 8px;color:#334155;
background:#fff;border:1px solid #cbd5e1;border-radius:8px
}
.theme-preset-control select{height:30px;max-width:120px;padding:0 20px 0 2px;color:inherit;background:transparent;border:0;font:600 11.5px Inter,system-ui}
html.modern-ui .theme-preset-control{color:var(--ui-text);background:var(--ui-panel-2);border:1px solid var(--ui-orange)}
html.modern-ui .theme-preset-control select{color:var(--ui-text);background-color:var(--ui-panel-2)}
html.modern-ui :is(.page-title,h1){margin:0 0 4px!important;font-size:28px!important;line-height:1.2!important}
html.modern-ui :is(.section-title,.card-title,h2){font-size:20px!important;line-height:1.25}
html.modern-ui .page-header{margin-bottom:10px!important}
html.modern-ui :is(.breadcrumb,.breadcrumb-custom,.breadcrumb-text){margin-bottom:6px!important;font-size:12px!important}
html.modern-ui .row{--bs-gutter-x:12px;--bs-gutter-y:12px}
html.modern-ui :is(.card,.card-custom,.card-box,.content-card,.stat-card,.kpi-card,.summary-card,.kpi){
color:var(--ui-text)!important;background:var(--ui-panel)!important;border:1px solid #F7E4B6!important;
border-radius:18px!important;box-shadow:0 12px 30px rgba(244,180,0,.08)!important;
position:relative;overflow:hidden;
transition:transform 180ms ease,box-shadow 180ms ease
}
html.modern-ui :is(.card-body,.card-custom,.card-box,.content-card,.stat-card,.kpi-card){padding:12px 14px!important}
/* A subtle warm tint keeps shared cards and panels consistent across modules. */
html.modern-ui :is(.card,[class$="-card"],[class*="-card "],[class$="-panel"],[class*="-panel "]){
background-color:#fffdf8!important;border-color:#f1d9aa!important
}
html.modern-ui :is([class$="-card"],[class*="-card "]):hover{
background-color:#fff9ed!important
}
html.modern-ui :is([class$="-card"],[class*="-card "]).is-selected{
background-color:#fff2d2!important;border-color:var(--ui-gold)!important
}
html.modern-ui :is(.stat-card,.kpi-card,.summary-card,.kpi){min-height:96px!important;margin-bottom:10px!important}
html.modern-ui :is(.stat-card,.kpi-card,.summary-card,.kpi)::before{
content:"";position:absolute;inset:0 0 auto 0;height:4px;
background:linear-gradient(90deg,var(--ui-gold),var(--ui-orange))
}
html.modern-ui :is(.stat-card,.kpi-card,.summary-card,.kpi):hover{
transform:translateY(-4px)!important;box-shadow:0 20px 45px rgba(240,90,40,.15)!important
}
html.modern-ui :is(.stat-icon,.kpi-icon){
background:linear-gradient(135deg,#FFF7E8,#FFE6C2)!important;
color:var(--ui-orange)!important
}
html.modern-ui .card-header{color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .dropdown-menu,.modern-ui .modal-content{
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border:1px solid var(--ui-border)!important;
border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.25)
}
html.modern-ui .dropdown-item{color:var(--ui-text);border-radius:6px}
html.modern-ui .dropdown-item:hover{color:var(--ui-orange-dark);background:var(--ui-primary-soft)}
html.modern-ui :is(.modal-header,.modal-footer){border-color:var(--ui-border)!important}
html.modern-ui .modal-header{
background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;
border-bottom:0!important
}
html.modern-ui .modal-header :is(.modal-title,h1,h2,h3,h4,h5,strong){color:#fff!important}
html.modern-ui .modal-header .btn-close{filter:brightness(0) invert(1);opacity:.9}
html.modern-ui .modal-header .btn-close:hover{opacity:1}
html.modern-ui :is(.form-control,.form-select,textarea,input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=search],input[type=date],input[type=file]){
min-height:42px;padding:7px 10px;color:var(--ui-text)!important;background:#fffaf1!important;
border:1px solid var(--ui-border)!important;border-radius:7px!important;font-size:13px;
transition:border-color 150ms ease,box-shadow 150ms ease
}
html.modern-ui.dark-mode :is(.form-control,.form-select,textarea,input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=search],input[type=date],input[type=file]){
background:var(--ui-panel-2)!important
}
/* Native select menus across every panel use the same DaalSetu gold palette. */
html.modern-ui select{
color-scheme:light!important;
accent-color:var(--ui-gold)!important
}
html.modern-ui select option,
html.modern-ui select optgroup{
color:#3f321f!important;
background:#fffaf0!important
}
html.modern-ui select option:checked{
color:#fff!important;
background:#f4b400 linear-gradient(0deg,#f4b400 0%,#ea7c1c 100%)!important;
box-shadow:0 0 0 100vmax #f4b400 inset!important
}
html.modern-ui select option:hover,
html.modern-ui select option:focus{
color:#5b3b08!important;
background:#ffe7b0!important;
box-shadow:0 0 0 100vmax #ffe7b0 inset!important
}
html.modern-ui select option:disabled{
color:#a58c67!important;
background:#fff7e8!important
}
html.modern-ui.dark-mode select{
color-scheme:dark!important
}
html.modern-ui.dark-mode select option,
html.modern-ui.dark-mode select optgroup{
color:var(--ui-text)!important;
background:var(--ui-panel-2)!important
}
html.modern-ui.dark-mode select option:checked{
color:#111827!important;
background:var(--ui-gold)!important;
box-shadow:0 0 0 100vmax var(--ui-gold) inset!important
}
html.modern-ui.dark-mode .search-wrap input,
html.modern-ui.dark-mode .search-input,
html.modern-ui.dark-mode :is(.category-search input,.notification-search input,.header-search input){
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important
}
html.modern-ui :is(.form-control,.form-select,textarea,input):focus{border-color:var(--ui-gold)!important;box-shadow:0 0 0 5px rgba(244,180,0,.15)!important}
html.modern-ui .form-label{margin-bottom:4px;color:var(--ui-text)!important;font-size:12px;font-weight:600}
html.modern-ui :is(.form-group,.mb-3){margin-bottom:10px!important}
html.modern-ui table{--bs-table-bg:transparent;--bs-table-color:var(--ui-text);--bs-table-border-color:var(--ui-border);color:var(--ui-text)!important;background:var(--ui-panel)!important;font-size:13px}
html.modern-ui table thead{position:sticky;top:0;z-index:5}
html.modern-ui table thead th{height:44px;padding:8px 10px!important;color:#8A5A00!important;background:#FFF4DE!important;border-color:var(--ui-border)!important;font-size:11px;font-weight:700}
html.modern-ui table tbody td{height:44px;padding:7px 10px!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.modern-ui table tbody tr{transition:background 150ms ease}
html.modern-ui table tbody tr:hover{background:#FFF8EF!important;box-shadow:inset 2px 0 var(--ui-orange)}
html.modern-ui table tbody tr.is-selected,
html.modern-ui table tbody tr.selected{background:#FFF0D2!important}
/* html.modern-ui .table-responsive{border:1px solid var(--ui-border);border-radius:8px} */
html.modern-ui .table-responsive{
border:1px solid var(--ui-border);
border-radius:8px;
overflow-x:auto;
overflow-y:visible;
}
html.modern-ui :is(.btn,.perm-btn,.rm-btn,.action-btn,.btn-action,.filter-btn){
min-height:34px!important;display:inline-flex;align-items:center;justify-content:center;gap:6px;
padding:6px 11px!important;border-radius:7px!important;font:650 12px/1.2 Inter,system-ui!important;
box-shadow:none!important;transform:none!important;text-decoration:none!important;
transition:transform 180ms ease,box-shadow 180ms ease,background 180ms ease,border-color 180ms ease
}
html.modern-ui :is(.btn-primary,.btn-dal,.perm-btn-primary,.rm-btn-primary,.action-btn-primary){
color:#fff!important;background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;
border:1px solid transparent!important;box-shadow:0 10px 25px rgba(240,90,40,.18)!important
}
html.modern-ui :is(.btn-primary,.btn-dal,.perm-btn-primary,.rm-btn-primary,.action-btn-primary):hover{
background:linear-gradient(135deg,var(--ui-gold-dark),var(--ui-orange-dark))!important;
transform:translateY(-2px)!important;box-shadow:0 14px 30px rgba(240,90,40,.26)!important
}
html.modern-ui :is(.btn-outline-primary,.btn-outline-dal,.rm-btn-outline-primary){color:var(--ui-orange)!important;background:#fff!important;border:1px solid var(--ui-border)!important}
html.modern-ui :is(.btn-outline-primary,.btn-outline-dal,.rm-btn-outline-primary):hover{background:#FFF2D8!important;border-color:var(--ui-orange)!important;transform:translateY(-2px)!important}
html.modern-ui :is(.btn-outline-secondary,.btn-light,.perm-btn-light,.rm-btn-secondary,.action-btn-neutral){color:var(--ui-orange)!important;background:#fff!important;border:1px solid var(--ui-border)!important}
html.modern-ui :is(.btn-outline-secondary,.btn-light,.perm-btn-light,.rm-btn-secondary,.action-btn-neutral):hover{background:#FFF2D8!important;transform:translateY(-2px)!important}
html.modern-ui :is(.btn-danger,.btn-outline-danger,.rm-btn-outline-danger){color:var(--ui-danger)!important;background:color-mix(in srgb,var(--ui-danger) 8%,transparent)!important;border:1px solid var(--ui-danger)!important}
html.modern-ui :is(.btn-success,.rm-btn-success){color:#fff!important;background:var(--ui-success)!important;border:1px solid var(--ui-success)!important}
html.modern-ui :is(.btn-sm,.action-btn,.btn-action){min-height:30px!important;padding:4px 8px!important;font-size:11px!important}
html.modern-ui :is(.btn,.perm-btn,.rm-btn,.action-btn,.btn-action):disabled{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;opacity:.62!important;box-shadow:none!important;transform:none!important}
/* Bootstrap utility badges/buttons: replace default blue/cyan with brand tones */
html.modern-ui :is(.badge.bg-info,.text-bg-info){color:#8A5A00!important;background:#FFF5DA!important}
html.modern-ui :is(.badge.bg-primary,.text-bg-primary){color:#fff!important;background:var(--ui-orange)!important}
html.modern-ui :is(.badge.bg-secondary,.text-bg-secondary){color:var(--ui-muted)!important;background:var(--ui-panel-2)!important}
html.modern-ui :is(.badge.bg-success,.text-bg-success){color:#fff!important;background:var(--ui-success)!important}
html.modern-ui :is(.badge.bg-warning,.text-bg-warning){color:#8A5A00!important;background:var(--ui-warning)!important}
html.modern-ui :is(.badge.bg-danger,.text-bg-danger){color:#fff!important;background:var(--ui-danger)!important}
html.modern-ui :is(.btn-info,.btn-outline-info){color:#8A5A00!important;background:#FFF5DA!important;border:1px solid #F2D18B!important}
html.modern-ui .pagination{gap:3px}.modern-ui .page-link{min-width:30px;height:30px;padding:5px 8px;color:var(--ui-orange);background:#fff;border-color:var(--ui-border);border-radius:6px!important;font-size:12px}
html.modern-ui .page-link:hover{color:var(--ui-orange-dark);background:#FFF4D8}
html.modern-ui .page-item.active .page-link{color:#fff!important;background:var(--ui-orange)!important;border-color:var(--ui-orange)!important}
html.modern-ui .page-item.disabled .page-link{color:var(--ui-muted);background:var(--ui-panel-2);border-color:var(--ui-border)}
html.modern-ui.dark-mode :is(.bg-white,.bg-light){color:var(--ui-text)!important;background-color:var(--ui-panel-2)!important}
html.modern-ui.dark-mode :is(.branch-access-card,.permission-page,.permission-shell,.permission-toolbar,.permission-card,.rm-card,.challan-create-shell,.challan-create-card,.challan-form-shell,.challan-form-card,.challan-detail-shell,.challan-info-card,.kyc-card,.kyc-filter-card,.vehicle-card,.driver-card,.form-section,.content-panel,.deal-stat-card,.contract-detail-card,.category-panel,.kpi,.cardx,.cardx-head,.cardx-title,.kpi-top,.kpi-icon,.kpi-title,.kpi-value,.kpi-sub,.kpi-change,.brand-stat-card,.brand-stat-label,.brand-stat-value,.brand-stat-icon,.brand-products-badge,.market-hero){
color:var(--ui-text)!important;background:var(--ui-panel)!important;border-color:var(--ui-border)!important;box-shadow:none!important
}
html.modern-ui.dark-mode :is(.permission-card h5,.permission-action-name,.rm-page-title,.rm-card-title,.challan-create-title,.challan-create-section-title,.form-section-title,.category-panel-title,.summary-card .card-value,.kpi-title,.kpi-value,.kpi-sub,.kpi-change,.cardx-title,.brand-stat-label,.brand-stat-value){color:var(--ui-text)!important}
html.modern-ui.dark-mode :is(.permission-toolbar,.rm-card-header,.category-panel-header){color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui.dark-mode :is(button,.btn):disabled{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui.dark-mode :is(input,select,textarea):disabled,.modern-ui.dark-mode :is(input,textarea)[readonly]{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important;opacity:1}
/* Visibility toggles: consistent compact pill instead of split white/dark blocks. */
html.modern-ui :is(.visibility-toggle,.permission-toggle label){
border:1px solid var(--ui-border)!important;background:var(--ui-panel-2)!important;color:var(--ui-text)!important;box-shadow:none!important
}
html.modern-ui .visibility-toggle{min-width:72px!important;height:30px!important;border-radius:999px!important;padding:3px 8px!important;gap:6px!important}
html.modern-ui .visibility-toggle :is(i,svg){width:14px!important;height:14px!important}
html.modern-ui .visibility-toggle.is-on{color:#fff!important;background:var(--ui-success)!important;border-color:var(--ui-success)!important}
html.modern-ui .visibility-toggle.is-off{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important}
html.modern-ui .visibility-toggle::before{display:none!important}
html.modern-ui .product-table .visibility-toggle{width:70px!important;min-width:70px!important;height:30px!important;padding:0 8px!important;box-shadow:none!important;transform:none!important}
html.modern-ui .product-table .visibility-toggle-knob{top:3px!important;width:22px!important;height:22px!important;color:var(--ui-text)!important;background:var(--ui-panel)!important;border:1px solid var(--ui-border)!important;box-shadow:0 1px 2px rgba(0,0,0,.14)!important}
html.modern-ui .product-table .visibility-toggle.is-off .visibility-toggle-knob{left:3px!important;color:var(--ui-muted)!important;background:var(--ui-panel)!important}
html.modern-ui .product-table .visibility-toggle.is-on .visibility-toggle-knob{left:44px!important;color:var(--ui-success)!important;background:#fff!important}
html.modern-ui .product-table .visibility-toggle.is-off .visibility-toggle-text{padding-left:25px!important}
html.modern-ui .product-table .visibility-toggle.is-on .visibility-toggle-text{padding-right:25px!important}
/* Column manager */
html.modern-ui .modern-column-toolbar{position:relative;z-index:25;display:flex;justify-content:flex-end;min-height:34px;margin:0 0 6px}
html.modern-ui .modern-column-trigger,.modern-ui .modern-column-reset{min-height:32px;padding:5px 9px;color:var(--ui-text);background:var(--ui-panel-2);border:1px solid var(--ui-border);border-radius:7px;font:650 11.5px Inter;cursor:pointer}
html.modern-ui .modern-column-manager{position:absolute;top:36px;right:0;z-index:1200;display:flex;flex-direction:column;width:min(290px,calc(100vw - 36px));max-height:min(500px,calc(100dvh - 20px));overflow:hidden;color:var(--ui-text);background:var(--ui-panel-2);border:1px solid var(--ui-border);border-radius:9px;box-shadow:0 14px 36px rgba(0,0,0,.3)}
html.modern-ui .modern-column-manager.is-viewport-positioned{position:fixed;top:auto;right:auto}
html.modern-ui .modern-column-manager-head{display:flex;justify-content:space-between;padding:10px;border-bottom:1px solid var(--ui-border);font-size:12px}.modern-ui .modern-column-manager-head span{color:var(--ui-muted);font-size:10px}
html.modern-ui .modern-column-list{flex:1 1 auto;min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain;padding:6px}
html.modern-ui .modern-column-item{display:grid;grid-template-columns:20px 18px 1fr;align-items:center;gap:7px;min-height:34px;padding:5px 7px;border-radius:6px;cursor:grab}
html.modern-ui .modern-column-item:hover{background:var(--ui-primary-soft)}.modern-ui .modern-column-item.is-dragging{opacity:.45}
html.modern-ui .modern-column-item input{width:15px;height:15px;margin:0;accent-color:var(--ui-primary)}.modern-ui .modern-column-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px}
html.modern-ui .modern-column-manager-footer{display:flex;justify-content:flex-end;padding:7px;border-top:1px solid var(--ui-border)}
@media(max-width:991.98px){html.modern-ui .sidebar{margin:0;height:100dvh;border-radius:0}.modern-ui .main-content{margin:0!important;border-radius:0!important}.modern-ui .scrollable-content{padding:10px!important}}
@media(max-width:767.98px){html.modern-ui .top-header{max-height:none;flex-wrap:wrap}.modern-ui .theme-preset-control select{max-width:96px}.modern-ui :is(.page-title,h1){font-size:23px!important}}
@media(max-width:767.98px){
html.modern-ui .global-daalsetu-watermark{
inset:90px 12px 24px;background-size:min(82vw,430px) auto;opacity:.03
}
}
/* Compact header alignment */
html.modern-ui .top-header{
min-height:56px!important;height:56px!important;max-height:56px!important;
padding:5px 0!important;margin-bottom:10px!important;align-items:center!important;overflow:visible
}
html.modern-ui .welcome-card{min-width:0!important;max-width:320px!important}
html.modern-ui .welcome-card-title{overflow:hidden;font-size:14px!important;line-height:1.15!important;text-overflow:ellipsis;white-space:nowrap}
html.modern-ui .welcome-card-subtitle{font-size:11px!important;line-height:1.15!important}
html.modern-ui .header-actions{align-items:center!important;justify-content:flex-end!important;gap:4px!important}
html.modern-ui .theme-preset-control{height:32px!important;min-height:32px!important;padding:0 7px!important;gap:5px!important}
html.modern-ui .theme-preset-control:focus-within{border-color:var(--ui-primary)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--ui-primary) 18%,transparent)!important}
html.modern-ui .theme-preset-control select{
width:118px!important;height:28px!important;min-height:28px!important;padding:0 20px 0 1px!important;
border:0!important;outline:0!important;box-shadow:none!important;font-size:11px!important
}
html.modern-ui .header-icons .btn-icon{width:32px!important;min-width:32px!important;height:32px!important;min-height:32px!important;border-radius:7px!important}
html.modern-ui .header-icons .btn-icon :is(i,svg){width:14px!important;height:14px!important;font-size:13px!important}
html.modern-ui .header-profile{min-width:0!important;max-width:210px!important;gap:6px!important;margin-left:4px!important}
html.modern-ui .header-profile-image{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;border-width:1px!important}
html.modern-ui .header-profile>div{min-width:0;line-height:1.05!important}
html.modern-ui .header-profile p{overflow:hidden;max-width:140px;margin-bottom:1px!important;font-size:11.5px!important;line-height:1.1!important;text-overflow:ellipsis;white-space:nowrap}
html.modern-ui .header-profile small{display:inline-block;overflow:hidden;max-width:150px;font-size:9.5px!important;line-height:1.05!important;text-overflow:ellipsis;white-space:nowrap}
html.modern-ui #headerDateTime{font-size:9px!important}
html.modern-ui .notification-dropdown{color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .notification-dropdown-header{background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .visibility-toggle[aria-busy="true"]{cursor:wait!important;opacity:.65!important}
/* Final brand-color normalization: web UI uses DaalSetu orange/gold, never Bootstrap blue. */
html.modern-ui {
--bs-primary:#F05A28;
--bs-primary-rgb:240,90,40;
--bs-link-color:#D9481A;
--bs-link-color-rgb:217,72,26;
--bs-link-hover-color:#B93A14;
--bs-link-hover-color-rgb:185,58,20;
--bs-info:#F4B400;
--bs-info-rgb:244,180,0;
accent-color:var(--ui-gold);
}
html.modern-ui ::selection{color:#2c2416;background:#ffd878}
html.modern-ui :is(a:not(.btn):not(.action-link-btn),.link-primary,.text-primary,.text-info){color:var(--ui-orange)!important}
html.modern-ui :is(a:not(.btn):not(.action-link-btn),.link-primary,.text-primary,.text-info):hover{color:var(--ui-orange-dark)!important}
html.modern-ui :is(.bg-primary,.bg-info){background-color:var(--ui-orange)!important}
html.modern-ui :is(.border-primary,.border-info){border-color:var(--ui-gold)!important}
html.modern-ui :is(.nav-pills .nav-link.active,.nav-pills .show>.nav-link,.list-group-item.active,.dropdown-item.active,.dropdown-item:active){
color:#fff!important;background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;
border-color:var(--ui-orange)!important
}
html.modern-ui .nav-tabs .nav-link{color:var(--ui-muted)!important}
html.modern-ui .nav-tabs .nav-link:hover{color:var(--ui-orange)!important;border-color:#f6d799 #f6d799 transparent!important}
html.modern-ui .nav-tabs .nav-link.active{
color:var(--ui-orange-dark)!important;background:#fff8e9!important;
border-color:var(--ui-gold) var(--ui-gold) #fff8e9!important
}
html.modern-ui :is(.form-check-input,input[type="checkbox"],input[type="radio"]){accent-color:var(--ui-orange)!important}
html.modern-ui .form-check-input:checked{background-color:var(--ui-orange)!important;border-color:var(--ui-orange)!important}
html.modern-ui .form-check-input:focus{border-color:var(--ui-gold)!important;box-shadow:0 0 0 .2rem rgba(244,180,0,.18)!important}
html.modern-ui .form-switch .form-check-input:checked{background-color:var(--ui-orange)!important;border-color:var(--ui-orange)!important}
html.modern-ui :is(.progress-bar,.spinner-border.text-primary){color:var(--ui-orange)!important;background-color:var(--ui-orange)!important}
html.modern-ui :is(.alert-primary,.alert-info){color:#6f4300!important;background:#fff2cf!important;border-color:#f2cf82!important}
html.modern-ui :is(.btn-link,[role="button"]).text-primary{color:var(--ui-orange)!important}
html.modern-ui :is(button,a,input,select,textarea):focus-visible{outline:2px solid var(--ui-gold)!important;outline-offset:2px}
@media(max-width:1199.98px){html.modern-ui .header-profile #headerDateTime{display:none!important}.modern-ui .header-profile{max-width:150px!important}}
@media(max-width:767.98px){html.modern-ui .top-header{height:auto!important;min-height:52px!important;max-height:none!important}.modern-ui .welcome-card{max-width:180px!important}.modern-ui .theme-preset-control select{width:92px!important}.modern-ui .header-profile>div{display:none!important}}
/* Final header spacing and visual rhythm */
html.modern-ui .top-header{
min-height:62px!important;height:62px!important;max-height:62px!important;
position:relative;isolation:isolate;
display:flex!important;align-items:center!important;justify-content:space-between!important;
gap:20px!important;padding:8px 10px!important;margin-bottom:12px!important;
background:linear-gradient(180deg,#FFFFFF,#FFF8EF)!important;border:1px solid var(--ui-border)!important;
border-radius:9px!important
}
html.modern-ui .top-header-wheat{
position:absolute;z-index:0;left:50%;top:50%;width:290px;height:58px;
overflow:hidden;pointer-events:none;transform:translate(-50%,-50%)
}
html.modern-ui .top-header-wheat span{
position:absolute;left:50%;top:50%;width:92px;height:245px;
background-position:center;background-repeat:no-repeat;background-size:contain;
opacity:.2;filter:saturate(.9);transform:translate(-50%,-50%) rotate(90deg)
}
html.modern-ui .top-header>:not(.top-header-wheat){position:relative;z-index:1}
html.modern-ui .welcome-card{
flex:1 1 auto!important;min-width:160px!important;max-width:420px!important;
padding:0 6px!important;margin:0!important
}
html.modern-ui .welcome-card-title{margin:0 0 3px!important;color:var(--ui-text)!important;font-size:14px!important;font-weight:700!important}
html.modern-ui .welcome-card-subtitle{margin:0!important;color:var(--ui-gold-dark)!important;font-size:11px!important;font-weight:600!important}
html.modern-ui .header-actions{
flex:0 0 auto!important;display:flex!important;align-items:center!important;
justify-content:flex-end!important;gap:7px!important;margin:0!important
}
html.modern-ui .theme-controls{display:inline-flex;align-items:center;margin-right:2px}
html.modern-ui .theme-preset-control{height:34px!important;min-height:34px!important;padding:0 9px!important}
html.modern-ui .theme-preset-control select{width:122px!important;height:30px!important}
html.modern-ui .header-icons .btn-icon{
position:relative;width:34px!important;min-width:34px!important;height:34px!important;min-height:34px!important;
padding:0!important;margin:0!important
}
html.modern-ui #notificationBadge{
top:-4px!important;right:-5px!important;left:auto!important;transform:none!important;
min-width:17px;height:17px;padding:2px 4px!important;display:inline-flex;align-items:center;justify-content:center;
background-color:var(--ui-orange)!important;border:2px solid var(--ui-panel);font-size:8px!important;line-height:1
}
html.modern-ui #notificationBadge.d-none{display:none!important}
html.modern-ui .header-profile{
position:relative;display:flex!important;align-items:center!important;min-width:168px!important;max-width:220px!important;
gap:8px!important;margin:0 0 0 5px!important;padding-left:12px!important
}
html.modern-ui .header-profile::before{
content:"";position:absolute;left:0;top:5px;bottom:5px;width:1px;background:var(--ui-border)
}
html.modern-ui .header-profile-image{
width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;
margin:0!important;box-shadow:0 0 0 2px var(--ui-primary-soft)!important
}
html.modern-ui .header-profile>div{flex:1 1 auto;min-width:0!important;padding-right:12px}
html.modern-ui .header-profile p{max-width:150px!important;margin:0 0 2px!important;font-size:12px!important}
html.modern-ui .header-profile small{max-width:150px!important;font-size:9.5px!important}
html.modern-ui .header-profile .dropdown-toggle::after{position:absolute;right:0;top:50%;margin:0;transform:translateY(-50%)}
@media(max-width:1199.98px){
html.modern-ui .top-header{gap:12px!important;padding-inline:8px!important}
html.modern-ui .header-actions{gap:5px!important}
html.modern-ui .header-profile{min-width:130px!important;max-width:155px!important;padding-left:9px!important}
html.modern-ui .header-profile>div{padding-right:10px}
html.modern-ui .header-profile small#headerDateTime{display:none!important}
html.modern-ui .theme-preset-control select{width:105px!important}
}
@media(max-width:767.98px){
html.modern-ui .top-header{height:auto!important;min-height:58px!important;max-height:none!important;gap:8px!important;flex-wrap:wrap!important}
html.modern-ui .top-header-wheat{display:none}
html.modern-ui .welcome-card{min-width:140px!important;max-width:calc(100% - 48px)!important}
html.modern-ui .header-actions{width:100%!important;justify-content:flex-start!important;padding-top:7px;border-top:1px solid var(--ui-border)}
html.modern-ui .header-profile{min-width:36px!important;width:36px!important;margin-left:auto!important;padding-left:0!important}
html.modern-ui .header-profile::before,.modern-ui .header-profile>div{display:none!important}
}
/* Authentication screens */
html.modern-ui :is(.login-wrapper,.auth-wrap){
position:relative;min-height:100dvh!important;padding:24px!important;
background:radial-gradient(circle at 15% 10%,color-mix(in srgb,var(--ui-primary) 10%,transparent),transparent 32%),var(--ui-bg)!important
}
html.modern-ui .auth-global-watermark{
position:fixed;z-index:0;left:50%;top:50%;width:min(46vw,520px);aspect-ratio:1;
pointer-events:none;transform:translate(-50%,-50%);
background-position:center;background-repeat:no-repeat;background-size:contain;
opacity:.06;filter:saturate(.88)
}
html.modern-ui :is(.login-card,.register-card){position:relative;isolation:isolate;overflow:hidden}
html.modern-ui :is(.login-card-watermark,.register-card-watermark){
position:absolute;z-index:0;inset:20% 8% 5%;pointer-events:none;
background-position:center 62%;background-repeat:no-repeat;background-size:min(82%,430px) auto;
opacity:.08;filter:saturate(.88)
}
html.modern-ui .register-card-watermark{
inset:8% 18%;background-position:center;background-size:min(68%,460px) auto;opacity:.065
}
html.modern-ui :is(.login-card,.register-card)>:is(.login-card-watermark,.register-card-watermark)~*{
position:relative;z-index:1
}
html.modern-ui.dark-mode :is(.login-card-watermark,.register-card-watermark){
opacity:.075;filter:grayscale(.05) brightness(1.35)
}
html.modern-ui :is(.login-wrapper,.auth-wrap)>.auth-global-watermark~*{
position:relative;z-index:1
}
html.modern-ui.dark-mode .auth-global-watermark{opacity:.055;filter:grayscale(.1) brightness(1.4)}
html.modern-ui :is(.login-card,.register-card,.auth-card){
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border)!important;border-radius:16px!important;
box-shadow:0 18px 50px rgba(0,0,0,.22)!important
}
html.modern-ui .login-card{max-width:620px!important;padding:38px 44px!important}
html.modern-ui .register-card{max-width:1040px!important;padding:24px 28px!important}
html.modern-ui .auth-card{max-width:980px!important;overflow:hidden}
html.modern-ui :is(.auth-title,.register-title,.login-title,.brand-name){color:var(--ui-text)!important}
html.modern-ui :is(.auth-subtitle,.register-subtitle,.login-subtitle){color:var(--ui-muted)!important}
html.modern-ui :is(.auth-left,.auth-right){background:var(--ui-panel)!important}
html.modern-ui .auth-left{
display:flex;align-items:center;justify-content:center;min-height:430px;
background:linear-gradient(145deg,var(--ui-panel-2),var(--ui-panel))!important;border-right:1px solid var(--ui-border)
}
html.modern-ui .auth-illustration{width:min(68%,280px)!important;max-height:170px!important;object-fit:contain!important;opacity:.9}
html.modern-ui .auth-right{padding:34px 38px!important}
html.modern-ui :is(.login-card,.register-card,.auth-card) :is(.form-control,.form-select){
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important
}
html.modern-ui :is(.login-card,.register-card,.auth-card) :is(label,.form-label){color:var(--ui-muted)!important}
html.modern-ui :is(.login-btn,.register-btn,.btn-submit){
min-height:42px!important;color:#fff!important;background:#ea7c1c!important;border:1px solid #ea7c1c!important;
border-radius:8px!important;font-size:13px!important;font-weight:700!important;box-shadow:none!important
}
html.modern-ui :is(.login-btn,.register-btn,.btn-submit):hover{background:#c8650f!important}
html.modern-ui .register-info{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .input-group-text{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .action-link-btn{border-radius:7px!important;font-size:12px!important}
@media(max-width:767.98px){
html.modern-ui :is(.login-wrapper,.auth-wrap){padding:12px!important}
html.modern-ui .auth-global-watermark{
left:50%;top:50%;width:min(82vw,430px);
transform:translate(-50%,-50%);opacity:.035
}
.modern-ui .login-card{padding:24px 20px!important}
.modern-ui .register-card{padding:18px!important}
.modern-ui .auth-right{padding:24px 20px!important}
}
/* Notifications page: dense and theme-safe */
html.modern-ui .notifications-page{
--notif-bg:var(--ui-panel-2);--notif-card-bg:var(--ui-panel);--notif-stroke:var(--ui-border);
--notif-text:var(--ui-text);--notif-muted:var(--ui-muted);--notif-primary:var(--ui-primary);
gap:10px!important;max-width:1500px;margin:0 auto
}
html.modern-ui .notifications-page .notification-card{
padding:12px 14px!important;color:var(--ui-text)!important;background:var(--ui-panel)!important;
border-color:var(--ui-border)!important;border-radius:9px!important;box-shadow:none!important
}
html.modern-ui .notifications-page .notification-header-card{background:var(--ui-panel-2)!important}
html.modern-ui .notifications-page .notification-header-top{margin-bottom:10px!important;gap:10px!important}
html.modern-ui .notifications-page .notification-title{margin-bottom:2px!important;color:var(--ui-text)!important;font-size:19px!important;gap:7px!important}
html.modern-ui .notifications-page .notification-title i{color:var(--ui-primary)!important;font-size:18px!important}
html.modern-ui .notifications-page .notification-subtitle{color:var(--ui-muted)!important;font-size:11.5px!important}
html.modern-ui .notifications-page .notification-toolbar{gap:8px!important;align-items:flex-end!important}
html.modern-ui .notifications-page .search-wrap{min-width:260px!important;flex:1 1 320px!important}
html.modern-ui .notifications-page .search-wrap input{height:38px!important;min-height:38px!important;padding:7px 10px 7px 34px!important;color:var(--ui-text)!important;background:var(--ui-panel)!important;border-color:var(--ui-border)!important;border-radius:7px!important;font-size:12px!important}
html.modern-ui .notifications-page .search-wrap i{left:11px!important;font-size:12px!important}
html.modern-ui .notifications-page .toolbar-field{min-width:145px!important;flex:0 0 145px!important}
html.modern-ui .notifications-page .field-label{margin-bottom:3px!important;color:var(--ui-muted)!important;font-size:10.5px!important}
html.modern-ui .notifications-page .toolbar-field .form-select{height:38px!important;min-height:38px!important;padding:6px 28px 6px 9px!important;border-radius:7px!important;font-size:12px!important}
html.modern-ui .notifications-page .unread-pill{padding:5px 9px!important;font-size:10.5px!important}
html.modern-ui .notifications-page .list-header{margin-bottom:8px!important}
html.modern-ui .notifications-page .list-title{color:var(--ui-text)!important;font-size:16px!important}
html.modern-ui .notifications-page .list-subtitle{color:var(--ui-muted)!important;font-size:10.5px!important}
html.modern-ui .notifications-page .notification-item{
min-height:66px;margin-bottom:7px!important;padding:9px 10px!important;gap:10px!important;
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;border-radius:8px!important
}
html.modern-ui .notifications-page .notification-avatar{width:36px!important;height:36px!important;font-size:14px!important}
html.modern-ui .notifications-page .notification-item-title{margin-bottom:2px!important;color:var(--ui-text)!important;font-size:12px!important}
html.modern-ui .notifications-page .notification-item-message{margin-bottom:5px!important;color:var(--ui-muted)!important;font-size:11.5px!important}
html.modern-ui .notifications-page :is(.type-chip,.status-chip){padding:3px 7px!important;border-radius:5px!important;font-size:9.5px!important}
html.modern-ui .notifications-page .meta-text{color:var(--ui-muted)!important;font-size:10px!important}
html.modern-ui .notifications-page .item-actions{gap:5px!important}
html.modern-ui .notifications-page .btn{min-height:30px!important;padding:4px 8px!important;border-radius:6px!important;font-size:10.5px!important}
html.modern-ui.dark-mode .notifications-page :is(.btn-light-pill,.type-chip){color:var(--ui-text)!important;background:var(--ui-panel)!important;border-color:var(--ui-border)!important}
@media(max-width:767.98px){html.modern-ui .notifications-page .toolbar-field,.modern-ui .notifications-page .search-wrap{min-width:100%!important;flex-basis:100%!important}.modern-ui .notifications-page .notification-item{align-items:flex-start!important}}
/* Edit Profile modal: complete theme ownership */
html.modern-ui #editProfileModal .modal-dialog{max-width:960px!important;margin:24px auto!important}
html.modern-ui #editProfileModal .modal-content{
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border)!important;border-radius:12px!important;
box-shadow:0 24px 64px rgba(0,0,0,.38)!important;overflow:hidden
}
html.modern-ui #editProfileModal .modal-header{
min-height:52px;padding:10px 14px!important;color:#fff!important;
background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;border-color:transparent!important
}
html.modern-ui #editProfileModal .modal-title{color:#fff!important;font-size:15px!important;font-weight:700!important}
html.modern-ui #editProfileModal .btn-close{filter:brightness(0) invert(1);opacity:.9}
html.modern-ui.dark-mode #editProfileModal .btn-close{filter:invert(1) grayscale(1);opacity:.8}
html.modern-ui #editProfileModal .modal-body{padding:12px 14px!important;color:var(--ui-text)!important;background:var(--ui-bg)!important}
html.modern-ui #editProfileModal .modal-footer{
min-height:54px;padding:9px 14px!important;background:var(--ui-panel)!important;border-color:var(--ui-border)!important
}
html.modern-ui #editProfileModal .profile-popup-card{
height:100%;padding:12px!important;color:var(--ui-text)!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border)!important;border-radius:9px!important;box-shadow:none!important
}
html.modern-ui #editProfileModal .profile-popup-heading{margin-bottom:9px!important;color:var(--ui-text)!important;font-size:14px!important;font-weight:700!important}
html.modern-ui #editProfileModal .profile-popup-avatar-wrap{
gap:10px!important;padding:9px!important;margin-bottom:10px!important;
background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;border-radius:8px!important
}
html.modern-ui #editProfileModal .profile-popup-avatar{
width:64px!important;height:64px!important;border-color:var(--ui-panel)!important;
box-shadow:0 0 0 1px var(--ui-border)!important
}
html.modern-ui #editProfileModal :is(.profile-popup-upload-note,.profile-doc-meta,.profile-doc-hint){color:var(--ui-muted)!important}
html.modern-ui #editProfileModal .profile-doc-list{gap:7px!important;margin-bottom:9px!important}
html.modern-ui #editProfileModal .profile-doc-item{
min-height:52px;padding:8px 10px!important;color:var(--ui-text)!important;background:var(--ui-panel-2)!important;
border-color:var(--ui-border)!important;border-radius:7px!important
}
html.modern-ui #editProfileModal .profile-doc-title{color:var(--ui-text)!important;font-size:12.5px!important}
html.modern-ui #editProfileModal .profile-doc-upload-box{
padding:10px!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;border-radius:8px!important
}
html.modern-ui #editProfileModal .form-label{margin-bottom:4px!important;color:var(--ui-muted)!important;font-size:11px!important;font-weight:600!important}
html.modern-ui #editProfileModal :is(.form-control,.form-select){
min-height:38px!important;padding:6px 9px!important;color:var(--ui-text)!important;
background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;font-size:12px!important
}
html.modern-ui #editProfileModal input[type="file"]{padding:3px!important}
html.modern-ui #editProfileModal input[type="file"]::file-selector-button{
height:30px;margin:-1px 8px -1px -1px;padding:4px 9px;color:var(--ui-text);
background:var(--ui-panel)!important;border:1px solid var(--ui-border);border-radius:5px;cursor:pointer
}
html.modern-ui #editProfileModal .badge{padding:4px 7px!important;border-radius:5px!important;font-size:9.5px!important}
html.modern-ui #editProfileModal .row{--bs-gutter-x:12px;--bs-gutter-y:10px}
html.modern-ui #editProfileModal .btn{min-height:34px!important}
@media(max-width:991.98px){html.modern-ui #editProfileModal .modal-dialog{max-width:calc(100vw - 24px)!important;margin:12px auto!important}}
@media(max-width:767.98px){html.modern-ui #editProfileModal .modal-body{padding:10px!important}.modern-ui #editProfileModal .profile-popup-avatar-wrap{align-items:flex-start!important;flex-direction:column!important}.modern-ui #editProfileModal .modal-footer{flex-wrap:wrap!important}}
/* Login form alignment */
html.modern-ui .login-card{width:min(100%,500px)!important;margin:0!important;padding:30px 32px!important}
html.modern-ui .login-logo{margin-bottom:18px!important}
html.modern-ui .logo-icon-lg{width:48px!important;height:48px!important;border-radius:12px!important;font-size:18px!important}
html.modern-ui .login-card .text-center.mb-4{margin-bottom:24px!important}
html.modern-ui .login-card .text-center h4{margin-bottom:6px!important;color:var(--ui-text)!important;font-size:22px!important;line-height:1.25!important}
html.modern-ui .login-card .text-center p{margin:0!important;color:var(--ui-muted)!important;font-size:12px!important}
html.modern-ui .form-group-custom{margin-bottom:16px!important}
html.modern-ui .login-form-wrapper label{display:block;margin:0 0 6px!important;color:var(--ui-muted)!important;font-size:12px!important;font-weight:600!important}
html.modern-ui .login-form-wrapper .position-relative{width:100%}
html.modern-ui .login-form-wrapper input:not([type="checkbox"]){
width:100%!important;height:46px!important;min-height:46px!important;
padding:9px 42px!important;color:var(--ui-text)!important;background:var(--ui-panel-2)!important;
border:1px solid var(--ui-border)!important;border-radius:8px!important;font-size:13px!important;line-height:1.2!important
}
html.modern-ui .login-form-wrapper .position-relative>i.start-0{
left:14px!important;right:auto!important;margin:0!important;transform:translateY(-50%)!important;
color:var(--ui-muted)!important;font-size:13px!important;pointer-events:none
}
html.modern-ui .login-form-wrapper .password-toggle-icon{
left:auto!important;right:13px!important;margin:0!important;transform:translateY(-50%)!important;
color:var(--ui-muted)!important;font-size:14px!important
}
html.modern-ui .login-card .form-check{display:flex;align-items:center;gap:7px;min-height:24px;padding-left:0!important}
html.modern-ui .login-card .form-check-input{position:static!important;float:none!important;width:16px!important;height:16px!important;margin:0!important;background-color:var(--ui-panel-2);border-color:var(--ui-border)}
html.modern-ui .login-card .form-check-label{margin:0!important;color:var(--ui-muted)!important;font-size:11.5px!important;line-height:16px!important}
html.modern-ui .btn-login{height:44px!important;margin-top:4px!important;padding:8px 14px!important;border-radius:8px!important;font-size:13px!important}
html.modern-ui .login-card form>div[style*="display: flex"]{
display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:12px!important
}
html.modern-ui .login-card .action-link-btn{
min-height:38px;display:flex!important;align-items:center;justify-content:center;
padding:7px 9px!important;text-align:center;font-size:11px!important;line-height:1.2
}
@media(max-width:575.98px){html.modern-ui .login-card{padding:24px 18px!important}.modern-ui .login-card form>div[style*="display: flex"]{grid-template-columns:1fr!important}.modern-ui .login-form-wrapper input:not([type="checkbox"]){height:44px!important;min-height:44px!important}}
/* Auth pages stay inside the viewport at common browser zoom levels. */
html.modern-ui body.auth-page{
width:100%;height:100dvh;min-height:0!important;overflow:hidden!important
}
html.modern-ui body.auth-page :is(.login-wrapper,.auth-wrap){
width:100%;height:100dvh;min-height:0!important;max-height:100dvh;
overflow:hidden!important;padding:10px!important
}
html.modern-ui body.login-auth-page .login-card{
margin:0!important
}
html.modern-ui body.registration-auth-page .register-card{
margin:0!important
}
html.modern-ui body.auth-page .auth-split-card{
width:min(94vw,1160px)!important;margin:0!important;zoom:1!important;transform-origin:center center
}
html.modern-ui body.auth-page .registration-split-card{width:min(94vw,1360px)!important}
html.modern-ui body.auth-page .auth-split-card :is(.login-card,.register-card){
width:100%!important;max-width:none!important;margin:0!important;padding:0!important;
overflow:visible!important;background:transparent!important;border:0!important;border-radius:0!important;
box-shadow:none!important;isolation:auto;zoom:1!important
}
html.modern-ui body.auth-page .auth-brand-panel{
position:relative;overflow:hidden;
background:
radial-gradient(circle at 50% 44%,color-mix(in srgb,var(--ui-gold) 13%,transparent),transparent 34%),
linear-gradient(145deg,var(--ui-panel-2),var(--ui-panel))!important
}
html.modern-ui body.auth-page .auth-brand-panel::after{
content:"";position:absolute;left:14%;right:14%;bottom:10%;height:24px;border-radius:50%;
background:radial-gradient(ellipse,rgba(244,180,0,.2),transparent 68%)
}
html.modern-ui body.auth-page .auth-brand-panel .auth-illustration{
position:relative;z-index:1;width:min(66%,330px)!important;max-height:290px!important;
filter:drop-shadow(0 16px 24px rgba(217,154,0,.16))
}
html.modern-ui body.auth-page .login-split-card .auth-right{padding:42px 46px!important}
html.modern-ui body.auth-page .registration-split-card .auth-right{padding:28px 34px!important}
html.modern-ui body.login-auth-page .login-card .text-center.mb-4{text-align:left!important}
html.modern-ui body.login-auth-page .login-card .text-center h4{font-size:30px!important}
html.modern-ui body.login-auth-page .login-card .text-center p{font-size:14px!important}
@media(max-width:991.98px){
html.modern-ui body.auth-page .auth-brand-panel{display:none!important}
html.modern-ui body.auth-page .auth-split-card .auth-right{padding:28px 24px!important}
}
@media(max-height:620px){
html.modern-ui body.login-auth-page .login-split-card{zoom:.9!important}
html.modern-ui body.registration-auth-page .registration-split-card{zoom:.86!important}
}
@media(max-height:500px){
html.modern-ui body.login-auth-page .login-split-card{zoom:.78!important}
html.modern-ui body.registration-auth-page .registration-split-card{zoom:.72!important}
}
@media(max-width:575.98px){
html.modern-ui body.auth-page :is(.login-wrapper,.auth-wrap){padding:6px!important}
html.modern-ui body.login-auth-page .login-split-card{width:calc(100% / .95)!important;zoom:.95!important}
html.modern-ui body.registration-auth-page .registration-split-card{width:calc(100% / .8)!important;zoom:.8!important}
}
@media(max-width:575.98px) and (max-height:700px){
html.modern-ui body.login-auth-page .login-split-card{width:calc(100% / .84)!important;zoom:.84!important}
html.modern-ui body.registration-auth-page .registration-split-card{width:calc(100% / .66)!important;zoom:.66!important}
}
/* Branded login showcase */
html.modern-ui body.login-auth-page .login-wrapper{padding:18px!important}
html.modern-ui body.login-auth-page .login-split-card{
position:relative;width:min(94vw,1240px)!important;height:min(760px,calc(100dvh - 36px));
min-height:620px;overflow:hidden!important;zoom:.75!important;
background:
radial-gradient(circle at 74% 18%,rgba(244,180,0,.055),transparent 22%),
linear-gradient(180deg,#fff,#fffaf3)!important
}
html.modern-ui body.login-auth-page .login-split-card::before,
html.modern-ui body.login-auth-page .login-split-card::after{
content:"";position:absolute;z-index:1;bottom:-8px;width:190px;height:330px;pointer-events:none;
background:url("../images/plant-wheat-transparent.png") center/contain no-repeat;opacity:.3
}
html.modern-ui body.login-auth-page .login-split-card::before{left:-32px;transform:rotate(-6deg)}
html.modern-ui body.login-auth-page .login-split-card::after{right:-30px;transform:scaleX(-1) rotate(-6deg)}
html.modern-ui body.login-auth-page .login-split-card>.row{
position:relative;z-index:2;height:calc(100% - 58px)
}
html.modern-ui body.login-auth-page .login-split-card>.row::after{
content:"";position:absolute;z-index:-1;left:-8%;right:-8%;bottom:-94px;height:220px;
border-radius:50% 50% 0 0;background:rgba(255,231,193,.34);transform:rotate(2deg)
}
html.modern-ui body.login-auth-page .login-split-card .auth-brand-panel{
min-height:0!important;border-right:0!important;background:transparent!important
}
html.modern-ui body.login-auth-page .login-brand-content{
position:relative;z-index:2;width:min(78%,430px);text-align:center
}
html.modern-ui body.login-auth-page .login-brand-content .auth-illustration{
width:min(78%,310px)!important;max-height:260px!important;margin-bottom:18px
}
html.modern-ui body.login-auth-page .login-brand-content h1{
margin:0 0 12px;color:var(--ui-text)!important;font-size:27px!important;font-weight:800!important
}
html.modern-ui body.login-auth-page .login-brand-content h1 span{color:var(--ui-orange)!important}
html.modern-ui body.login-auth-page .login-brand-content>p{
max-width:370px;margin:0 auto;color:var(--ui-muted);font-size:13px;line-height:1.45
}
html.modern-ui body.login-auth-page .login-trust-list{
display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px
}
html.modern-ui body.login-auth-page .login-trust-list div{display:grid;justify-items:center;gap:8px}
html.modern-ui body.login-auth-page .login-trust-list i{
width:48px;height:48px;display:grid;place-items:center;border-radius:50%;
color:var(--ui-gold-dark);background:#fff4de;font-size:17px
}
html.modern-ui body.login-auth-page .login-trust-list span{
color:var(--ui-text);font-size:11px;font-weight:650;line-height:1.25
}
html.modern-ui body.login-auth-page .login-cloud{
position:absolute;left:10%;top:11%;width:120px;height:42px;border-radius:40px;
background:#fff;box-shadow:0 16px 28px rgba(146,98,35,.1)
}
html.modern-ui body.login-auth-page .login-cloud::before,
html.modern-ui body.login-auth-page .login-cloud::after{
content:"";position:absolute;border-radius:50%;background:#fff
}
html.modern-ui body.login-auth-page .login-cloud::before{left:17px;top:-27px;width:55px;height:55px}
html.modern-ui body.login-auth-page .login-cloud::after{right:12px;top:-34px;width:68px;height:68px}
html.modern-ui body.login-auth-page .login-split-card .auth-right{
display:flex;align-items:center;justify-content:center;padding:30px 64px 30px 24px!important;
background:transparent!important
}
html.modern-ui body.login-auth-page .login-split-card .login-card{
width:min(100%,430px)!important;padding:38px 34px!important;overflow:hidden!important;
background:rgba(255,255,255,.96)!important;border:1px solid rgba(242,209,139,.7)!important;
border-radius:20px!important;box-shadow:0 18px 44px rgba(110,73,25,.12)!important
}
html.modern-ui body.login-auth-page .login-card .text-center.mb-4{text-align:center!important}
html.modern-ui body.login-auth-page .login-card .text-center h4{font-size:28px!important;font-weight:800!important}
html.modern-ui body.login-auth-page .login-card .text-center p{
max-width:250px;margin-inline:auto!important;font-size:12px!important;line-height:1.45!important
}
html.modern-ui body.login-auth-page .login-card-watermark{display:none}
html.modern-ui body.login-auth-page .login-page-footer{
position:absolute;z-index:4;left:50%;bottom:14px;display:flex;align-items:center;gap:8px;
color:var(--ui-muted);font-size:11px;transform:translateX(-50%)
}
html.modern-ui body.login-auth-page .login-page-footer i{color:var(--ui-gold)}
@media(max-width:991.98px){
html.modern-ui body.login-auth-page .login-split-card{height:auto;min-height:0;zoom:1!important}
html.modern-ui body.login-auth-page .login-split-card>.row{height:auto;padding-bottom:48px}
html.modern-ui body.login-auth-page .login-split-card .auth-right{padding:30px 24px!important}
html.modern-ui body.login-auth-page .login-split-card::before{opacity:.16}
html.modern-ui body.login-auth-page .login-split-card::after{display:none}
}
@media(max-width:575.98px){
html.modern-ui body.login-auth-page .login-wrapper{padding:6px!important}
html.modern-ui body.login-auth-page .login-split-card{width:100%!important;zoom:1!important}
html.modern-ui body.login-auth-page .login-split-card .login-card{padding:28px 22px!important}
html.modern-ui body.login-auth-page .login-page-footer{bottom:9px;width:100%;justify-content:center}
}
/* Registration viewport: fixed proportions without browser-like scaling. */
html.modern-ui body.registration-auth-page{
height:100dvh;overflow:hidden!important
}
html.modern-ui body.registration-auth-page .auth-wrap{
height:100dvh;min-height:760px!important;padding:clamp(20px,4vh,48px)!important;
display:flex;align-items:center;justify-content:center;overflow:hidden!important
}
html.modern-ui body.registration-auth-page .registration-split-card{
position:fixed!important;left:50%;top:50%;
width:min(900px,calc(100vw - 48px))!important;max-width:900px!important;
height:min(650px,calc(100dvh - 48px));min-height:0;margin:0!important;padding:28px!important;zoom:1!important;
transform:translate(-50%,-50%);transform-origin:center center;
border-radius:22px!important;box-shadow:0 20px 58px rgba(74,49,19,.14)!important
}
html.modern-ui body.registration-auth-page .registration-split-card>.row{
height:100%;min-height:0;align-items:stretch
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-brand-panel{
display:flex!important;flex:0 0 38%;max-width:38%;min-height:0!important;
border-right:1px solid var(--ui-border)!important;border-radius:16px 0 0 16px
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-brand-panel .auth-illustration{
width:70%!important;max-width:240px!important;max-height:240px!important;height:auto
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-right{
flex:0 0 62%;max-width:62%;display:flex;align-items:flex-start;justify-content:center;
padding:20px 24px!important;background:var(--ui-panel)!important
}
html.modern-ui body.registration-auth-page .registration-split-card .register-card{
width:100%!important;max-width:none!important;padding:0!important;zoom:1!important
}
html.modern-ui body.registration-auth-page .register-title{
margin-bottom:6px!important;font-size:32px!important;
line-height:1.1!important;font-weight:800!important
}
html.modern-ui body.registration-auth-page .register-card>p{
margin-bottom:12px!important;font-size:12px!important;line-height:1.4
}
html.modern-ui body.registration-auth-page .register-card .row.g-3{
--bs-gutter-x:12px;--bs-gutter-y:9px
}
html.modern-ui body.registration-auth-page .register-card :is(.form-control,.form-select,.input-group-text){
height:44px!important;min-height:44px!important;font-size:12px!important
}
html.modern-ui body.registration-auth-page .register-card .input-group-text{
width:46px;justify-content:center;padding-inline:12px
}
html.modern-ui body.registration-auth-page .register-card .form-label{
margin-bottom:4px!important;font-size:11px!important;line-height:1.15
}
html.modern-ui body.registration-auth-page .register-info{
margin-top:11px!important;padding:7px 10px!important;font-size:10px!important
}
html.modern-ui body.registration-auth-page .register-btn{
height:44px!important;min-height:44px!important;margin-top:10px!important;font-size:13px!important
}
@media(min-width:1600px){
html.modern-ui body.registration-auth-page .registration-split-card{width:900px!important}
}
@media(min-width:1200px) and (max-width:1599.98px){
html.modern-ui body.registration-auth-page .registration-split-card{width:900px!important}
}
@media(min-width:992px) and (max-width:1199.98px){
html.modern-ui body.registration-auth-page .registration-split-card{
width:min(900px,calc(100vw - 40px))!important;padding:26px!important
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-right{padding:18px 22px!important}
}
@media(min-width:768px) and (max-width:991.98px){
html.modern-ui body.registration-auth-page{
height:auto;min-height:100dvh;overflow:auto!important
}
html.modern-ui body.registration-auth-page .auth-wrap{
height:auto;min-height:100dvh!important;padding:24px!important;overflow:visible!important
}
html.modern-ui body.registration-auth-page .registration-split-card{
position:relative!important;left:auto;top:auto;width:96%!important;height:auto;min-height:0;
margin:auto!important;padding:28px!important;zoom:1!important;transform:none
}
html.modern-ui body.registration-auth-page .registration-split-card>.row{
min-height:0;flex-direction:column
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-brand-panel{
display:flex!important;flex:0 0 auto;max-width:100%;width:100%;min-height:190px!important;
border-right:0!important;border-bottom:1px solid var(--ui-border)!important;border-radius:14px 14px 0 0
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-brand-panel .auth-illustration{
width:150px!important;max-height:150px!important
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-right{
flex:0 0 auto;max-width:100%;width:100%;padding:32px!important
}
}
@media(max-width:767.98px){
html.modern-ui body.registration-auth-page{
height:auto;min-height:100dvh;overflow:auto!important
}
html.modern-ui body.registration-auth-page .auth-wrap{
height:auto;min-height:100dvh!important;padding:12px!important;overflow:visible!important
}
html.modern-ui body.registration-auth-page .registration-split-card{
position:relative!important;left:auto;top:auto;width:100%!important;height:auto;min-height:0;
margin:0!important;padding:20px!important;zoom:1!important;transform:none
}
html.modern-ui body.registration-auth-page .registration-split-card>.row{
min-height:0;flex-direction:column
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-brand-panel{
display:flex!important;flex:0 0 auto;max-width:100%;width:100%;min-height:150px!important;
border:0!important;border-bottom:1px solid var(--ui-border)!important;border-radius:12px 12px 0 0
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-brand-panel .auth-illustration{
width:120px!important;max-height:120px!important
}
html.modern-ui body.registration-auth-page .registration-split-card .auth-right{
flex:0 0 auto;max-width:100%;width:100%;padding:24px 4px 4px!important
}
html.modern-ui body.registration-auth-page .register-title{font-size:32px!important}
html.modern-ui body.registration-auth-page .register-card :is(.form-control,.form-select,.input-group-text){
height:50px!important;min-height:50px!important
}
}
/* Readable placeholders across dark-theme search and form fields */
html.modern-ui.dark-mode :is(input,textarea,.form-control)::placeholder{
color:#91a0b7!important;opacity:1!important;font-weight:400!important
}
html.modern-ui.dark-mode :is(input,textarea,.form-control)::-webkit-input-placeholder{
color:#91a0b7!important;opacity:1!important
}
html.modern-ui.dark-mode :is(input,textarea,.form-control)::-moz-placeholder{
color:#91a0b7!important;opacity:1!important
}
html.modern-ui.dark-mode :is(input,textarea,.form-control):-ms-input-placeholder{
color:#91a0b7!important;opacity:1!important
}
html.modern-ui.dark-mode input[type="search"]{color:var(--ui-text)!important;caret-color:var(--ui-primary)!important}
/* Guaranteed application alerts (fallback when SweetAlert CDN is unavailable) */
.app-alert-stack{
position:fixed;top:16px;right:16px;z-index:20000;display:grid;gap:8px;
width:min(380px,calc(100vw - 32px));pointer-events:none
}
.app-alert-toast{
min-height:48px;display:grid;grid-template-columns:20px minmax(0,1fr) 24px;align-items:center;gap:9px;
padding:10px 11px;color:#2C2C2C;background:#fff;border:1px solid #F2D18B;border-left:4px solid #D99A00;
border-radius:8px;box-shadow:0 12px 30px rgba(15,23,42,.18);font:600 12px/1.4 Inter,system-ui,sans-serif;
pointer-events:auto;animation:appAlertIn 180ms ease-out
}
.app-alert-toast>i{font-size:15px;color:#D99A00}.app-alert-message{min-width:0;overflow-wrap:anywhere}
.app-alert-close{width:24px;height:24px;padding:0;color:#64748b;background:transparent;border:0;border-radius:5px;font-size:20px;line-height:1;cursor:pointer}
.app-alert-close:hover{color:#172033;background:#f1f5f9}
.app-alert-success{border-left-color:#3BAA4A}.app-alert-success>i{color:#3BAA4A}
.app-alert-error{border-left-color:#D9481A}.app-alert-error>i{color:#D9481A}
.app-alert-warning{border-left-color:#F4B400}.app-alert-warning>i{color:#F4B400}
.app-alert-toast.is-leaving{opacity:0;transform:translateX(18px);transition:opacity 180ms ease,transform 180ms ease}
html.modern-ui.dark-mode .app-alert-toast{color:var(--ui-text);background:var(--ui-panel-2);border-color:var(--ui-border);border-left-color:var(--ui-gold);box-shadow:0 16px 34px rgba(0,0,0,.4)}
html.modern-ui.dark-mode .app-alert-success{border-left-color:#4CC161}.modern-ui.dark-mode .app-alert-error{border-left-color:#F0824A}.modern-ui.dark-mode .app-alert-warning{border-left-color:#F5C34D}
html.modern-ui.dark-mode .app-alert-close{color:var(--ui-muted)}html.modern-ui.dark-mode .app-alert-close:hover{color:var(--ui-text);background:var(--ui-panel)}
@keyframes appAlertIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:575.98px){.app-alert-stack{top:10px;right:10px;width:calc(100vw - 20px)}}
/* Dark notification dropdown */
html.modern-ui.dark-mode .notification-dropdown{
color:#e7edf7!important;background:#0f1829!important;border:1px solid #2a3a51!important;
border-radius:9px!important;box-shadow:0 18px 42px rgba(0,0,0,.48)!important
}
html.modern-ui.dark-mode .notification-dropdown-header{
color:#f8fafc!important;background:#131f33!important;border-color:#2a3a51!important
}
html.modern-ui.dark-mode .notification-dropdown-header strong{color:#f8fafc!important;font-size:13px!important}
html.modern-ui.dark-mode .notification-dropdown-header a{color:var(--ui-gold)!important;font-size:11px!important}
html.modern-ui.dark-mode .notification-dropdown-list{
background:#0f1829!important;scrollbar-color:#566984 #0f1829!important
}
html.modern-ui.dark-mode .notification-dropdown-list::-webkit-scrollbar{width:7px}
html.modern-ui.dark-mode .notification-dropdown-list::-webkit-scrollbar-track{background:#0f1829!important}
html.modern-ui.dark-mode .notification-dropdown-list::-webkit-scrollbar-thumb{background:#566984!important;border:2px solid #0f1829;border-radius:999px}
html.modern-ui.dark-mode .notification-dropdown-item{
padding:10px 12px!important;color:#e7edf7!important;background:#0f1829!important;
border-color:#2a3a51!important
}
html.modern-ui.dark-mode .notification-dropdown-item:has(.notification-dropdown-title.is-unread){background:#2a2008!important;box-shadow:inset 3px 0 var(--ui-orange)}
html.modern-ui.dark-mode .notification-dropdown-item:hover{color:#fff!important;background:#18263c!important}
html.modern-ui.dark-mode .notification-dropdown-title{color:#f1f5f9!important;font-size:12px!important;line-height:1.3!important}
html.modern-ui.dark-mode .notification-dropdown-title.is-unread{color:#fff!important;font-weight:700!important}
html.modern-ui.dark-mode .notification-dropdown-message{margin-top:3px!important;color:#b8c4d6!important;font-size:11.5px!important;line-height:1.4!important}
html.modern-ui.dark-mode .notification-dropdown-time{color:#91a0b7!important;font-size:10px!important}
html.modern-ui.dark-mode .notification-dropdown-list .text-muted{color:#91a0b7!important}
/* Create Offer: media uploads and visible branches */
html.modern-ui.dark-mode :is(.branch-checkbox-group,.buyer-branch-checkbox-group){
min-height:48px!important;padding:8px 10px!important;color:var(--ui-text)!important;
background:var(--ui-panel-2)!important;border:1px solid var(--ui-border)!important;
border-radius:7px!important;box-shadow:none!important
}
html.modern-ui.dark-mode :is(.branch-checkbox-item,.buyer-branch-checkbox-item){
min-height:30px;padding:4px 2px!important;color:var(--ui-text)!important;font-size:12px!important
}
html.modern-ui.dark-mode :is(.branch-checkbox-empty,.buyer-branch-checkbox-empty){
padding:6px 2px!important;color:#91a0b7!important;font-size:12px!important
}
html.modern-ui.dark-mode :is(.branch-checkbox-group,.buyer-branch-checkbox-group) input[type="checkbox"]{
width:15px!important;height:15px!important;margin:0 6px 0 0!important;
accent-color:var(--ui-primary)!important;background-color:var(--ui-panel)!important;border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode input[type="file"]{
color:#cbd5e1!important;background:var(--ui-panel-2)!important;
border:1px solid var(--ui-border)!important;border-radius:7px!important;padding:3px!important
}
html.modern-ui.dark-mode input[type="file"]::file-selector-button{
height:32px;margin:-1px 9px -1px -1px;padding:5px 10px;
color:#e7edf7!important;background:#223149!important;border:1px solid #34445d!important;
border-radius:5px!important;font:600 11px/1.2 Inter,system-ui,sans-serif;cursor:pointer
}
html.modern-ui.dark-mode input[type="file"]::file-selector-button:hover{
color:#fff!important;background:#2c4161!important;border-color:#60a5fa!important
}
html.modern-ui.dark-mode input[type="file"]::-webkit-file-upload-button{
height:32px;margin:-1px 9px -1px -1px;padding:5px 10px;
color:#e7edf7!important;background:#223149!important;border:1px solid #34445d!important;border-radius:5px!important
}
/* RFQ details and Bootstrap list groups */
html.modern-ui.dark-mode :is(.list-group,.list-group-flush){
color:var(--ui-text)!important;background:transparent!important;border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .list-group-item{
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .list-group-item :is(.fw-bold,strong){color:#f1f5f9!important}
html.modern-ui.dark-mode :is(.text-dark,.list-group-item .text-dark){color:var(--ui-text)!important}
html.modern-ui.dark-mode .list-group-item .text-secondary{color:var(--ui-muted)!important}
html.modern-ui.dark-mode .list-group-item .bg-light{
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .card>.card-body>.list-group:first-child{margin:-2px 0 0!important}
html.modern-ui.dark-mode .card>.card-body>.list-group .list-group-item{min-height:42px;padding:8px 0!important}
/* KYC dashboard text contrast */
html.modern-ui.dark-mode .kyc-table .kyc-user-name{
color:#f1f5f9!important;font-size:13px!important;font-weight:650!important
}
html.modern-ui.dark-mode .kyc-table .kyc-user-sub{
color:#91a0b7!important;font-size:11px!important
}
html.modern-ui.dark-mode .kyc-table .kyc-time-label{
color:#a9b6c9!important;font-size:10.5px!important;font-weight:650!important
}
html.modern-ui.dark-mode .kyc-table .kyc-time-value{
color:#e2e8f0!important;font-size:11.5px!important;font-weight:500!important
}
html.modern-ui.dark-mode .kyc-table tbody tr:hover .kyc-user-name,
html.modern-ui.dark-mode .kyc-table tbody tr:hover .kyc-time-value{color:#fff!important}
html.modern-ui.dark-mode :is(.view-value,.kyc-card .view-value){color:var(--ui-text)!important}
html.modern-ui.dark-mode :is(.view-label,.kyc-card .view-label){color:var(--ui-muted)!important}
html.modern-ui.dark-mode .view-row{border-color:var(--ui-border)!important}
/* Category Master tree contrast and alignment */
html.modern-ui.dark-mode .category-panel{
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .category-panel-header{
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;
border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .category-panel-title{color:#f1f5f9!important}
html.modern-ui .category-search input{padding-left:36px!important}
html.modern-ui .category-search>i{
left:12px!important;top:50%!important;margin:0!important;color:var(--ui-muted)!important;
transform:translateY(-50%)!important;pointer-events:none;z-index:2
}
html.modern-ui.dark-mode .category-tree{color:var(--ui-text)!important;background:var(--ui-panel)!important}
html.modern-ui.dark-mode .category-item{
color:#dce5f2!important;background:transparent!important;border-color:transparent!important
}
html.modern-ui.dark-mode .category-item:hover{
color:#fff!important;background:var(--ui-primary-soft)!important
}
html.modern-ui.dark-mode .category-item.active{
color:#f7bd76!important;background:rgba(234,124,28,.18)!important
}
html.modern-ui.dark-mode .category-label{color:inherit!important;font-size:12px!important;font-weight:600!important}
html.modern-ui.dark-mode .category-expander{color:#8ea0b8!important}
html.modern-ui.dark-mode .category-level{
color:#cbd5e1!important;background:#223149!important;border:1px solid #34445d!important
}
html.modern-ui.dark-mode .category-children{border-color:#40516a!important}
html.modern-ui.dark-mode .category-stat{
color:var(--ui-text)!important;background:var(--ui-panel-2)!important;
border-color:var(--ui-border)!important
}
html.modern-ui.dark-mode .category-stat strong{color:#f5a94e!important}
html.modern-ui.dark-mode .category-stat span{color:var(--ui-muted)!important}
html.modern-ui.dark-mode .category-empty{color:var(--ui-muted)!important}
/* User details password field */
html.modern-ui.dark-mode .password-field{
min-width:76px;min-height:32px;display:inline-flex;align-items:center;
padding:5px 9px!important;color:#e7edf7!important;background:#0b1220!important;
border:1px solid #34445d!important;border-radius:6px!important;
font:600 12px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace!important;
letter-spacing:1.5px!important
}
html.modern-ui.dark-mode .toggle-view-password{
width:32px!important;min-width:32px!important;height:32px!important;min-height:32px!important;
padding:0!important;color:#f7bd76!important;background:#162135!important;
border-color:#34445d!important;border-radius:6px!important
}
html.modern-ui.dark-mode .toggle-view-password:hover{
color:#fff!important;background:#223149!important;border-color:#f5a94e!important
}
html.dark-mode #view_char_password,
body.dark-mode #view_char_password,
html.modern-ui #view_char_password{
color:#f8fafc!important;
-webkit-text-fill-color:#f8fafc!important;
background-color:#050a12!important;
background-image:none!important;
border:1px solid #334155!important;
box-shadow:none!important;
}
/* Buyer Offers search and filter controls */
html.modern-ui .filter-form{
padding:10px 12px!important;margin-bottom:10px!important;
background:var(--ui-panel)!important;border-color:var(--ui-border)!important
}
html.modern-ui .filter-form>.row{--bs-gutter-y:8px}
html.modern-ui .filter-form .search-input-group{
width:100%;height:40px;min-height:40px;padding:0 10px!important;
display:flex;align-items:center;gap:8px;overflow:hidden;
color:var(--ui-text);background:var(--ui-panel-2)!important;
border:1px solid var(--ui-border)!important;border-radius:7px!important;
box-shadow:none!important;transition:border-color 120ms ease,box-shadow 120ms ease
}
html.modern-ui .filter-form .search-input-group:focus-within{
border-color:var(--ui-primary)!important;
box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-primary) 18%,transparent)!important
}
html.modern-ui .filter-form .search-input-group .input-group-text{
flex:0 0 16px;width:16px;min-width:16px;height:40px;margin:0!important;padding:0!important;
display:inline-flex;align-items:center;justify-content:center;
color:var(--ui-muted)!important;background:transparent!important;border:0!important
}
html.modern-ui .filter-form .search-input-group .input-group-text :is(i,svg){width:14px;height:14px;font-size:13px}
html.modern-ui .filter-form .search-input-group .form-control{
flex:1 1 auto;width:100%;height:38px!important;min-height:38px!important;margin:0!important;padding:6px 0!important;
color:var(--ui-text)!important;background:transparent!important;border:0!important;border-radius:0!important;
box-shadow:none!important;font-size:12px!important;line-height:1.2!important
}
html.modern-ui .filter-form .search-input-group .form-control:focus{outline:0!important;box-shadow:none!important}
html.modern-ui .filter-form>.row .form-select{height:40px!important;min-height:40px!important;padding-block:6px!important}
html.modern-ui .filter-form>.row>.col-12.d-flex{margin-top:0!important}
html.modern-ui .filter-form>.row>.col-12.d-flex :is(.btn,a.btn){min-width:88px!important;min-height:34px!important;padding:5px 12px!important}
@media(max-width:767.98px){html.modern-ui .filter-form .row.g-2>div{margin-bottom:6px}.modern-ui .filter-form>.row>.col-12.d-flex{justify-content:flex-start!important}}
/* Permissions role selector */
html.modern-ui .permission-toolbar .perm-select{
min-width:180px!important;width:auto!important;height:38px!important;min-height:38px!important;
padding:6px 34px 6px 10px!important;color:var(--ui-text)!important;
background-color:var(--ui-panel-2)!important;border:1px solid var(--ui-border)!important;
border-radius:7px!important;box-shadow:none!important;font:650 12px/1.2 Inter,system-ui,sans-serif!important;
color-scheme:inherit;cursor:pointer
}
html.modern-ui.dark-mode .permission-toolbar .perm-select{color-scheme:dark}
html.modern-ui .permission-toolbar .perm-select:focus{
border-color:var(--ui-primary)!important;outline:0!important;
box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-primary) 18%,transparent)!important
}
html.modern-ui .permission-toolbar .perm-select option{
padding:7px 10px;color:var(--ui-text)!important;background:var(--ui-panel-2)!important;font-size:12px
}
html.modern-ui .permission-toolbar .perm-select option:checked{
color:#fff!important;background:#ea7c1c!important
}
html.modern-ui .permission-toolbar-left{gap:7px!important}
html.modern-ui .permission-toolbar .perm-role-label{color:var(--ui-muted)!important;font-size:11px!important}
@media(max-width:575.98px){html.modern-ui .permission-toolbar .perm-select{min-width:150px!important;flex:1 1 auto}}
/* Delivery Challans list */
html.modern-ui .challan-page{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
html.modern-ui .challan-shell{
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border)!important;border-radius:9px!important;box-shadow:none!important
}
html.modern-ui .challan-shell-header{
min-height:54px;padding:9px 12px!important;background:var(--ui-panel-2)!important;
border-color:var(--ui-border)!important
}
html.modern-ui .challan-page-title{color:var(--ui-text)!important;font-size:20px!important;line-height:1.25!important}
html.modern-ui .challan-shell-body{padding:10px 12px 12px!important}
html.modern-ui .challan-filter-grid{grid-template-columns:minmax(260px,2fr) minmax(180px,1fr) auto auto!important;gap:8px!important;margin-bottom:10px!important}
html.modern-ui .challan-filter-grid :is(.form-control,.form-select){height:40px!important;min-height:40px!important}
html.modern-ui .challan-table-wrap{border-color:var(--ui-border)!important;border-radius:8px!important}
html.modern-ui .challan-table thead th{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important}
html.modern-ui .challan-table tbody td{color:var(--ui-text)!important;background:var(--ui-panel)!important}
html.modern-ui .challan-table tbody tr:hover td{background:var(--ui-primary-soft)!important}
@media(max-width:1199.98px){html.modern-ui .challan-filter-grid{grid-template-columns:1fr 1fr auto auto!important}}
@media(max-width:767.98px){html.modern-ui .challan-filter-grid{grid-template-columns:1fr!important}.modern-ui .challan-filter-grid :is(.btn,a.btn){width:100%!important}}
/* Role Management */
html.modern-ui .rm-page{padding:8px 0!important;color:var(--ui-text)!important}
html.modern-ui .rm-page-title{margin-bottom:10px!important;color:var(--ui-text)!important;font-size:22px!important}
html.modern-ui .rm-grid{gap:10px!important}
html.modern-ui .rm-card{
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border)!important;border-radius:8px!important;box-shadow:none!important
}
html.modern-ui .rm-card-header{min-height:42px;padding:8px 10px!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .rm-card-title{color:var(--ui-text)!important;font-size:13px!important}
html.modern-ui .rm-card-body{padding:10px!important}
html.modern-ui :is(.rm-label,.perm-label-row){color:var(--ui-muted)!important}
html.modern-ui :is(.rm-input,.rm-textarea,.perm-category-select){
width:100%;color:var(--ui-text)!important;background:var(--ui-panel-2)!important;
border:1px solid var(--ui-border)!important;border-radius:7px!important;box-shadow:none!important
}
html.modern-ui :is(.rm-input,.perm-category-select){height:38px!important;min-height:38px!important;padding:6px 9px!important}
html.modern-ui .rm-textarea{min-height:64px!important;padding:8px 9px!important}
html.modern-ui :is(.rm-input,.rm-textarea,.perm-category-select):focus{border-color:var(--ui-primary)!important;outline:0!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-primary) 18%,transparent)!important}
html.modern-ui .perm-scroll-box{max-height:380px!important;color:var(--ui-text)!important;background:var(--ui-bg)!important;border-color:var(--ui-border)!important;border-radius:7px!important}
html.modern-ui .perm-module{border-color:var(--ui-border)!important}
html.modern-ui .perm-module-header{padding:7px 9px!important;color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .perm-module-name{color:#dce5f2!important}
html.modern-ui .perm-module-count{color:var(--ui-muted)!important;background:var(--ui-panel)!important}
html.modern-ui .perm-module-body{padding:7px!important;gap:6px!important;background:var(--ui-panel)!important}
html.modern-ui .perm-item{min-height:38px;padding:6px 8px!important;color:var(--ui-text)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;border-radius:6px!important}
html.modern-ui .perm-name{color:var(--ui-text)!important}
html.modern-ui .perm-toggle{border-color:color-mix(in srgb,var(--ui-danger) 55%,var(--ui-border))!important;background:color-mix(in srgb,var(--ui-danger) 10%,var(--ui-panel-2))!important}
html.modern-ui .perm-toggle-pill{background:var(--ui-panel)!important}
html.modern-ui .rm-table th{color:var(--ui-muted)!important;background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important}
html.modern-ui .rm-table td{color:var(--ui-text)!important;background:var(--ui-panel)!important;border-color:var(--ui-border)!important}
html.modern-ui .rm-table tbody tr:hover td{background:var(--ui-primary-soft)!important}
/* Registered Company modals */
html.modern-ui :is(#companyFormModal,#companyAddressModal) .modal-content{
color:var(--ui-text)!important;background:var(--ui-panel)!important;
border:1px solid var(--ui-border)!important;border-radius:10px!important;
box-shadow:0 24px 64px rgba(0,0,0,.4)!important;overflow:hidden
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .modal-header{
min-height:54px;padding:10px 14px!important;color:#fff!important;
background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;border-color:transparent!important
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .modal-title{color:#fff!important;font-size:15px!important}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .btn-close{filter:brightness(0) invert(1);opacity:.9}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .modal-body{
padding:12px 14px!important;color:var(--ui-text)!important;background:var(--ui-bg)!important
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .modal-footer{
min-height:54px;padding:9px 14px!important;color:var(--ui-text)!important;
background:var(--ui-panel)!important;border-color:var(--ui-border)!important
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) :is(.form-label,.form-check-label,label){
color:var(--ui-muted)!important;font-size:11px!important;font-weight:600!important
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) :is(.form-control,.form-select){
height:40px!important;min-height:40px!important;color:var(--ui-text)!important;
background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) :is(h5,h6,strong){color:var(--ui-text)!important}
html.modern-ui #companyAddressModal .card{
padding:12px!important;color:var(--ui-text)!important;background:var(--ui-panel)!important;
border-color:var(--ui-border)!important;border-radius:8px!important
}
html.modern-ui #companyAddressModal .card>.border.rounded{
padding:10px!important;margin-bottom:10px!important;color:var(--ui-text)!important;
background:var(--ui-panel-2)!important;border-color:var(--ui-border)!important;border-radius:7px!important
}
html.modern-ui #companyAddressModal hr{border-color:var(--ui-border)!important;opacity:1}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .form-check-input{
width:15px!important;height:15px!important;margin-top:2px!important;
background-color:var(--ui-panel-2);border-color:var(--ui-border);accent-color:var(--ui-primary)
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .form-check-input:checked{
background-color:var(--ui-primary)!important;border-color:var(--ui-primary)!important
}
html.modern-ui :is(#companyFormModal,#companyAddressModal) .invalid-feedback{font-size:10.5px!important}
@media(max-width:767.98px){html.modern-ui :is(#companyFormModal,#companyAddressModal) .modal-body{padding:10px!important}.modern-ui #companyAddressModal .company-address-actions{width:100%;justify-content:flex-start!important}}
/* ====================================================
BADGES (Brand Redesign)
==================================================== */
html.modern-ui .badge-buyer {
background: #FFF3DD !important;
color: #D99A00 !important;
}
html.modern-ui .badge-seller {
background: #FFE8D8 !important;
color: #F05A28 !important;
}
html.modern-ui .badge-transport {
background: #EDFBEF !important;
color: #2E7D32 !important;
}
html.modern-ui .badge-admin {
background: #FFF5DA !important;
color: #8A5A00 !important;
}
/* ====================================================
CHARTS (Brand Redesign)
==================================================== */
html.modern-ui {
--chart-gold: #F4B400;
--chart-orange: #F05A28;
--chart-deep-orange: #D9481A;
--chart-green: #3BAA4A;
--chart-amber: #FFC107;
--chart-grid-cream: #FFF4DE;
}
/* ====================================================
SCROLLBAR (Brand Redesign)
==================================================== */
html.modern-ui ::-webkit-scrollbar {
width: 6px;
height: 6px;
}
html.modern-ui ::-webkit-scrollbar-track {
background: transparent;
}
html.modern-ui ::-webkit-scrollbar-thumb {
background: var(--ui-gold);
border-radius: 10px;
}
html.modern-ui ::-webkit-scrollbar-thumb:hover {
background: var(--ui-orange);
}
/* Keep this block last: it wins over legacy page-level Bootstrap color rules. */
html.modern-ui :is(a,.link-primary,.text-primary,.text-info){color:var(--ui-orange)!important}
html.modern-ui :is(.bg-primary,.bg-info){background-color:var(--ui-orange)!important}
html.modern-ui :is(.border-primary,.border-info){border-color:var(--ui-gold)!important}
html.modern-ui :is(.btn-primary,.btn-info,.action-primary,.filter-apply,.apply-btn){
color:#fff!important;background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;
border-color:transparent!important
}
html.modern-ui :is(.btn-outline-primary,.btn-outline-info){
color:var(--ui-orange)!important;background:#fffaf1!important;border-color:var(--ui-gold)!important
}
html.modern-ui :is(.nav-pills .nav-link.active,.nav-pills .show>.nav-link,.list-group-item.active,.dropdown-item.active,.dropdown-item:active){
color:#fff!important;background:linear-gradient(135deg,var(--ui-gold),var(--ui-orange))!important;
border-color:var(--ui-orange)!important
}
html.modern-ui .nav-tabs .nav-link.active{color:var(--ui-orange-dark)!important;border-color:var(--ui-gold)!important}
html.modern-ui .form-check-input:checked{background-color:var(--ui-orange)!important;border-color:var(--ui-orange)!important}
html.modern-ui :is(.page-item.active .page-link,.progress-bar){color:#fff!important;background-color:var(--ui-orange)!important;border-color:var(--ui-orange)!important}
html.modern-ui :is(.alert-primary,.alert-info){color:#6f4300!important;background:#fff2cf!important;border-color:#f2cf82!important}
/* Final contrast guard for orange actions and RBAC section headings. */
html.modern-ui :is(a,button).btn-dal,
html.modern-ui :is(a,button).rm-btn-primary,
html.modern-ui :is(a,button).action-btn-primary{
color:#fff!important;background:linear-gradient(135deg,#d9481a,#b9360d)!important;
border-color:#b9360d!important;text-shadow:0 1px 1px rgba(73,25,3,.25)
}
html.modern-ui :is(a,button).btn-dal:hover,
html.modern-ui :is(a,button).rm-btn-primary:hover,
html.modern-ui :is(a,button).action-btn-primary:hover{
color:#fff!important;background:linear-gradient(135deg,#c43f14,#972d08)!important;border-color:#972d08!important
}
html.modern-ui .perm-module-name{color:#5f3b08!important;text-shadow:none!important}
html.modern-ui.dark-mode .perm-module-name{color:#ffd978!important}
html.modern-ui .login-card a.action-link-btn.register-btn{
color:#fff!important;background:linear-gradient(135deg,#d9481a,#b9360d)!important;
border:1px solid #b9360d!important;text-shadow:0 1px 1px rgba(73,25,3,.25)
}
html.modern-ui .login-card a.action-link-btn.register-btn:hover{color:#fff!important;background:#972d08!important}
/* Filled actions must retain white labels even when legacy link/text-fill rules run later. */
html.modern-ui :is(
.btn-dal,
.btn-primary,
.btn-info,
.rm-btn-primary,
.perm-btn-primary,
.action-btn-primary,
.btn-login,
.login-btn,
.register-btn,
.btn-submit,
.btn-primary-custom,
.filter-apply,
.apply-btn,
.page-item.active .page-link
),
html.modern-ui :is(
.btn-dal,
.btn-primary,
.btn-info,
.rm-btn-primary,
.perm-btn-primary,
.action-btn-primary,
.btn-login,
.login-btn,
.register-btn,
.btn-submit,
.btn-primary-custom,
.filter-apply,
.apply-btn,
.page-item.active .page-link
) * {
color:#fff!important;
-webkit-text-fill-color:#fff!important;
text-decoration-color:#fff!important;
}