/* ============================================================================
   Page-specific presentation
   Loaded after site.css. Business selectors and JavaScript hooks are preserved.
   ============================================================================ */

/* Dashboard and legacy interactive summary tables */
.dashboard-page tbody > tr,
.dashboard-page .card-header,
.dashboard-row-action { cursor: pointer; }
.dashboard-page td.active { background: var(--surface-selected) !important; color: var(--text-primary); }

/* Tracking pages */
.tracking-page .value {
    display: block; width: 100%; min-height: var(--control-height-sm); margin: 0;
    padding: 6px 9px; border-top: 1px solid var(--border-color);
    background: var(--surface-1); color: var(--text-secondary); font-size: var(--fs-sm);
    transition: background-color var(--t-fast), color var(--t-fast);
}
.tracking-page .data-group {
    margin: 4px; padding: 6px 8px; border: 1px solid var(--border-color);
    border-radius: var(--radius-sm); background: var(--surface-1);
}
.tracking-page .info-div {
    position: relative; margin: 24px 0 8px; padding-top: 8px;
    border: 1px solid rgba(var(--brand-primary-rgb), .42);
    border-radius: var(--radius-md); box-shadow: var(--shadow-sm); background: var(--surface-1);
}
.tracking-page .div-info-text {
    position: absolute; top: -14px; left: 10px; padding: 2px 8px;
    border: 1px solid rgba(var(--brand-primary-rgb), .42); border-radius: var(--radius-sm);
    background: var(--surface-1); color: var(--color-primary-700); font-weight: 700;
}
.tracking-page .cursor { cursor: pointer; color: var(--brand-primary); }
.tracking-page .tdblue { background: var(--surface-selected) !important; }
.tracking-page .tdbrown { background: rgba(217, 119, 6, .14) !important; }
[data-theme="dark"] .tracking-page .tdbrown { background: rgba(217, 119, 6, .22) !important; }

/* Maintenance / diagnostic pages */
.table-cleanup-page .hover-bg-light:hover { background: var(--surface-hover); border-color: var(--border-strong) !important; }
.table-cleanup-page .bg-light-danger { background: rgba(220, 38, 38, .08); }
.table-cleanup-page .section-select-label,
.table-cleanup-page .table-select-label { cursor: pointer; }
.table-cleanup-page .table-select-label { color: var(--text-primary) !important; }

/* Workflow document widths and compound freight fields */
.document-card { width: 100%; max-width: 900px; }
.document-card--wide { width: 100%; max-width: 1100px; }
.document-card--adaptive { width: 100%; max-width: var(--document-card-width, 900px); }
.compound-weight > .form-control { flex: 0 0 55%; width: 55%; }
.compound-weight > .form-select { flex: 0 0 45%; width: 45%; }
.compound-rate > .form-control { flex: 1 1 60%; min-width: 0; }
.validation-message-hidden { display: none; }

/* Report and data administration sizing */
.filter-account { min-width: 260px; }
.table-picker { min-width: 220px; }
.row-limit { width: 90px; }
.table-filter { width: min(100%, 250px); }
.start-index { width: 80px; }
.content-narrow { width: 100%; max-width: 1000px; }
.col-account { width: 55%; }
.col-entry-type, .col-entry-amount { width: 20%; }
.col-date { width: 140px; }
.col-pending-count { width: 110px; }
.col-amount { width: 150px; }
.col-document { width: 120px; }
.col-payment-type { width: 140px; }
.col-action { width: 70px; }

/* Authentication */
.auth-wrap { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(380px, 1fr); background: var(--page-bg); }
.auth-brand { position: relative; overflow: hidden; color: #fff; padding: clamp(32px, 5vw, 56px); display: flex; flex-direction: column; justify-content: space-between; background: var(--gradient-brand); }
.auth-brand::after { content: ""; position: absolute; inset: 0; opacity: .5; background: radial-gradient(circle at 80% 80%, rgba(255,255,255,.14), transparent 40%); }
.auth-brand > * { position: relative; z-index: 1; }
.auth-logo { display: flex; align-items: center; gap: 14px; }
.auth-logo .mark { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; background: rgba(255,255,255,.15); font-family: var(--font-display); font-weight: 800; font-size: 1.3rem; }
.auth-logo strong { font-family: var(--font-display); font-size: 1.15rem; }
.auth-hero h1 { color: #fff; font-size: clamp(2rem, 4vw, 2.6rem); line-height: 1.1; margin: 0 0 16px; }
.auth-hero p { color: rgba(255,255,255,.82); font-size: 1.02rem; max-width: 30rem; }
.auth-features { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
.auth-feature { display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.92); font-weight: 500; }
.auth-feature .tick { width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.16); display: grid; place-items: center; flex-shrink: 0; }
.auth-feature svg { width: 15px; height: 15px; }
.auth-foot { color: rgba(255,255,255,.68); font-size: .8rem; }
.auth-panel { display: flex; align-items: center; justify-content: center; padding: 40px 24px; background: var(--page-bg); position: relative; }
.auth-card { width: 100%; max-width: 400px; padding: 4px; }
.auth-card h2 { font-size: 1.65rem; margin-bottom: 6px; }
.auth-card .lead { color: var(--text-muted); font-size: var(--fs-md); margin-bottom: 28px; }
.field { margin-bottom: 18px; }
.field label { display: block; font-size: var(--fs-sm); font-weight: 600; color: var(--text-secondary); margin-bottom: 7px; }
.field .affix { position: relative; }
.field .affix svg { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--text-muted); }
.field input { width: 100%; height: var(--control-height-lg); padding: 0 44px 0 42px; background: var(--surface-1); border: 1px solid var(--border-color); border-radius: var(--radius-sm); color: var(--text-primary); font-size: var(--fs-md); transition: var(--t-fast); }
.field input:focus { outline: none; border-color: var(--brand-primary); box-shadow: 0 0 0 3px var(--focus-ring); }
.toggle-pass { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: .72rem; font-weight: 700; color: var(--brand-primary); cursor: pointer; user-select: none; }
.btn-signin { width: 100%; height: var(--control-height-lg); border: 0; border-radius: var(--radius-sm); font-weight: 700; font-size: var(--fs-md); color: #fff; cursor: pointer; background: var(--gradient-primary); box-shadow: 0 6px 18px rgba(var(--brand-primary-rgb),.28); transition: var(--t-fast); }
.btn-signin:hover { filter: brightness(1.06); box-shadow: 0 10px 24px rgba(var(--brand-primary-rgb),.36); }
.btn-signin:active { transform: translateY(1px); }
.auth-error { background: rgba(220,38,38,.10); border: 1px solid rgba(220,38,38,.25); color: var(--brand-danger); font-size: var(--fs-sm); font-weight: 500; padding: 11px 14px; border-radius: var(--radius-sm); margin-bottom: 20px; }
.theme-fab { position: absolute; top: 20px; right: 20px; width: 40px; height: 40px; border-radius: var(--radius-sm); border: 1px solid var(--border-color); background: var(--surface-1); color: var(--text-secondary); display: grid; place-items: center; cursor: pointer; }
.theme-fab:hover { background: var(--surface-hover); color: var(--text-primary); }
.theme-fab svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 900px) {
    .auth-wrap { grid-template-columns: 1fr; }
    .auth-brand { display: none; }
}
@media (max-width: 575.98px) {
    .auth-panel { padding: 28px 18px; align-items: flex-start; padding-top: max(72px, 12vh); }
    .field input { font-size: 1rem; }
    .document-card, .document-card--wide, .document-card--adaptive { max-width: 100%; }
    .filter-account, .table-picker { min-width: 100%; width: 100%; }
}

@media print {
    .tracking-page .info-div { box-shadow: none; border-color: #777; }
    .tracking-page .div-info-text { background: #fff; color: #000; border-color: #777; }
}

/* ============================================================================
   Rich dashboard — inspired by dense enterprise analytics layouts while using
   transport-specific data and the application's blue/indigo identity.
   ============================================================================ */
.dashboard-pro { display: grid; gap: 18px; }
.dashboard-welcome {
    position: relative; min-height: 224px; overflow: hidden;
    display: flex; align-items: stretch; justify-content: space-between;
    padding: clamp(24px, 4vw, 42px); border-radius: 22px;
    color: #fff; background: var(--gradient-brand); box-shadow: 0 20px 45px rgba(30,58,138,.22);
}
.dashboard-welcome::before { content: ""; position: absolute; width: 360px; height: 360px; right: -110px; top: -180px; border-radius: 50%; border: 1px solid rgba(255,255,255,.16); box-shadow: 0 0 0 45px rgba(255,255,255,.035), 0 0 0 90px rgba(255,255,255,.025); }
.dashboard-welcome__content { position: relative; z-index: 2; max-width: 650px; }
.dashboard-eyebrow, .workflow-hero__eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 12px; font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.dashboard-eyebrow { padding: 6px 10px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.17); border-radius: var(--radius-pill); }
.dashboard-welcome h1 { color: #fff; margin: 0 0 8px; font-size: clamp(1.9rem, 4vw, 2.8rem); letter-spacing: -.035em; }
.dashboard-welcome p { color: rgba(255,255,255,.78); max-width: 560px; margin: 0; font-size: var(--fs-md); }
.dashboard-welcome__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.dashboard-welcome .btn-light { color: var(--color-primary-900); background: #fff; border-color: #fff; box-shadow: 0 8px 18px rgba(15,23,42,.14); }
.btn-hero-ghost { color: #fff; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.08); }
.btn-hero-ghost:hover { color: #fff; background: rgba(255,255,255,.16); }
.dashboard-welcome__visual { position: relative; z-index: 1; flex: 0 0 32%; min-width: 260px; }
.route-orbit { position: absolute; border: 2px dashed rgba(255,255,255,.26); border-radius: 50%; transform: rotate(-14deg); }
.route-orbit--one { width: 330px; height: 130px; right: -20px; top: 30px; }
.route-orbit--two { width: 230px; height: 84px; right: 28px; top: 54px; opacity: .65; }
.dashboard-truck { position: absolute; right: 118px; top: 68px; width: 74px; height: 74px; display: grid; place-items: center; border-radius: 22px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.22); box-shadow: 0 15px 35px rgba(15,23,42,.18); transform: rotate(5deg); font-size: 2rem; }
.route-pin { position: absolute; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: var(--color-primary-900); background: #fff; box-shadow: 0 8px 18px rgba(15,23,42,.2); }
.route-pin--start { left: 8px; top: 102px; }.route-pin--end { right: 0; top: 72px; }

.dashboard-kpis { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.metric-card { position: relative; min-height: 160px; overflow: hidden; padding: 17px 18px 14px; border: 1px solid var(--border-color); border-radius: var(--radius-lg); background: var(--surface-1); box-shadow: var(--shadow-xs); transition: transform var(--t), box-shadow var(--t), border-color var(--t); }
.metric-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: color-mix(in srgb, var(--metric-color) 36%, var(--border-color)); }
.metric-card::after { content: ""; position: absolute; width: 100px; height: 100px; right: -52px; top: -54px; border-radius: 50%; background: color-mix(in srgb, var(--metric-color) 10%, transparent); }
.metric-card--primary { --metric-color: var(--brand-primary); }.metric-card--indigo { --metric-color: var(--color-indigo-600); }.metric-card--warning { --metric-color: var(--brand-warning); }.metric-card--success { --metric-color: var(--brand-success); }
.metric-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 13px; }
.metric-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: var(--metric-color); background: color-mix(in srgb, var(--metric-color) 12%, transparent); }
.metric-trend { color: var(--metric-color); font-size: .68rem; font-weight: 750; }
.metric-card > strong { display: block; font-family: var(--font-display); color: var(--text-primary); font-size: 1.65rem; line-height: 1; font-variant-numeric: tabular-nums; }
.metric-card > span:not(.metric-trend) { display: block; margin-top: 6px; color: var(--text-muted); font-size: var(--fs-xs); }
.metric-spark { height: 30px; margin-top: 10px; color: var(--metric-color); }
.metric-spark--bars { display: flex; align-items: end; gap: 5px; }.metric-spark--bars i { width: 6px; border-radius: 4px 4px 1px 1px; background: currentColor; opacity: .45; }.metric-spark--bars i:nth-child(1){height:9px}.metric-spark--bars i:nth-child(2){height:17px}.metric-spark--bars i:nth-child(3){height:12px}.metric-spark--bars i:nth-child(4){height:24px;opacity:1}.metric-spark--bars i:nth-child(5){height:15px}.metric-spark--bars i:nth-child(6){height:27px}.metric-spark--bars i:nth-child(7){height:20px}
.metric-spark svg { width: 100%; height: 100%; overflow: visible; }.metric-spark path { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.metric-dots { display: flex; align-items: center; gap: 7px; height: 30px; margin-top: 10px; }.metric-dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--metric-color); opacity: .24; }.metric-dots i:nth-child(2),.metric-dots i:nth-child(4){transform:scale(1.45);opacity:.55}.metric-dots i:nth-child(3){transform:scale(1.8);opacity:1}
.metric-progress { height: 5px; margin-top: 20px; border-radius: 10px; background: color-mix(in srgb, var(--metric-color) 12%, transparent); overflow: hidden; }.metric-progress i { display: block; width: var(--progress); height: 100%; min-width: 4px; background: var(--metric-color); border-radius: inherit; }

.dashboard-main-grid { display: grid; grid-template-columns: minmax(0,1.75fr) minmax(290px,.85fr); gap: 16px; }
.dashboard-lower-grid { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(300px,.8fr); gap: 16px; }
.dashboard-panel { min-width: 0; overflow: hidden; border: 1px solid var(--border-color); border-radius: var(--radius-lg); background: var(--surface-1); box-shadow: var(--shadow-xs); }
.dashboard-panel__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 19px; border-bottom: 1px solid var(--border-subtle); }
.dashboard-panel__header h2 { margin: 2px 0 0; font-size: 1rem; }
.panel-kicker { color: var(--text-muted); font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.panel-period { padding: 6px 9px; border: 1px solid var(--border-color); border-radius: var(--radius-sm); color: var(--text-muted); background: var(--surface-2); font-size: .7rem; }
.panel-link { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 700; white-space: nowrap; }

.volume-chart { position: relative; height: 245px; display: flex; align-items: stretch; justify-content: space-around; gap: 12px; padding: 34px 24px 28px; }
.chart-gridlines { position: absolute; inset: 26px 20px 44px; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none; }.chart-gridlines i { display: block; border-top: 1px dashed var(--border-subtle); }
.volume-bar { position: relative; z-index: 1; flex: 1; max-width: 58px; display: flex; flex-direction: column; justify-content: end; align-items: center; height: 100%; gap: 7px; }
.volume-bar > i { width: clamp(18px, 50%, 34px); height: var(--bar-height); min-height: 5px; border-radius: 8px 8px 3px 3px; background: linear-gradient(180deg, var(--color-indigo-500), var(--brand-primary)); box-shadow: 0 7px 16px rgba(var(--brand-primary-rgb),.18); transition: height .45s var(--ease), filter var(--t-fast); }.volume-bar:hover > i { filter: brightness(1.12); }
.volume-bar__value { color: var(--text-secondary); font-size: .68rem; font-weight: 800; }.volume-bar small { color: var(--text-muted); font-size: .68rem; }
.volume-summary { display: grid; grid-template-columns: repeat(3,1fr); margin: 0 18px 18px; padding: 14px 0; border: 1px dashed var(--border-color); border-radius: var(--radius-md); background: var(--surface-2); }
.volume-summary div { padding: 0 18px; border-right: 1px solid var(--border-color); }.volume-summary div:last-child { border: 0; }.volume-summary span { display: block; color: var(--text-muted); font-size: .68rem; }.volume-summary strong { display: block; margin-top: 3px; color: var(--text-primary); font-size: 1rem; }

.pending-list { padding: 6px 14px 13px; }.pending-item { display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 10px; padding: 11px 6px; border-bottom: 1px solid var(--border-subtle); color: inherit; transition: transform var(--t-fast), background var(--t-fast); }.pending-item:last-child { border: 0; }.pending-item:hover { color: inherit; transform: translateX(3px); }.pending-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; }.pending-icon--amber{color:#D97706;background:rgba(217,119,6,.12)}.pending-icon--blue{color:var(--brand-primary);background:rgba(var(--brand-primary-rgb),.12)}.pending-icon--indigo{color:var(--color-indigo-600);background:rgba(79,70,229,.12)}.pending-icon--green{color:var(--brand-success);background:rgba(22,163,74,.12)}.pending-icon--red{color:var(--brand-danger);background:rgba(220,38,38,.1)}
.pending-item span:nth-child(2) { min-width: 0; }.pending-item strong,.pending-item small { display: block; }.pending-item strong { color: var(--text-primary); font-size: var(--fs-sm); }.pending-item small { color: var(--text-muted); font-size: .68rem; }.pending-item b { min-width: 30px; padding: 4px 7px; border-radius: var(--radius-pill); text-align: center; color: var(--brand-primary); background: rgba(var(--brand-primary-rgb),.09); font-size: .72rem; }

.cash-strip { display: grid; grid-template-columns: 1.1fr 1fr 1fr auto; align-items: center; gap: 28px; padding: 18px 20px; border: 1px solid var(--border-color); border-radius: var(--radius-lg); background: linear-gradient(100deg, rgba(var(--brand-primary-rgb),.06), var(--surface-1) 35%); box-shadow: var(--shadow-xs); }
.cash-strip__lead { display: flex; align-items: center; gap: 12px; }.cash-strip__lead > span { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; color: var(--brand-primary); background: rgba(var(--brand-primary-rgb),.12); }.cash-strip small { display: block; color: var(--text-muted); font-size: .68rem; }.cash-strip strong { color: var(--text-primary); font-variant-numeric: tabular-nums; }.cash-stat > strong { display: block; margin: 2px 0 7px; font-size: 1rem; }.cash-stat__bar { display: block; width: 100%; height: 4px; border-radius: 10px; background: var(--surface-3); overflow: hidden; }.cash-stat__bar i { display:block;height:100%;border-radius:inherit}.cash-stat__bar--in i{width:72%;background:var(--brand-success)}.cash-stat__bar--out i{width:48%;background:var(--brand-warning)}

.dashboard-table-wrap { border: 0; border-radius: 0; }.dashboard-table thead th { background: var(--surface-2) !important; }.dashboard-table td strong,.dashboard-table td small { display: block; }.dashboard-table td small { color: var(--text-muted); font-size: .68rem; }.memo-number { font-family: var(--font-display); font-weight: 800; }.stage-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: var(--radius-pill); font-size: .67rem; font-weight: 700; white-space: nowrap; }.stage-badge i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }.stage-badge--success{color:#15803D;background:rgba(22,163,74,.1)}.stage-badge--info{color:#0369A1;background:rgba(2,132,199,.1)}.stage-badge--primary{color:var(--brand-primary);background:rgba(var(--brand-primary-rgb),.1)}.stage-badge--warning{color:#B45309;background:rgba(217,119,6,.1)}
.icon-action { width: 32px; height: 32px; display: inline-grid; place-items: center; border: 1px solid var(--border-color); border-radius: 9px; color: var(--text-secondary); background: var(--surface-1); }.icon-action:hover { color: #fff; border-color: transparent; background: var(--gradient-primary); transform: translateY(-1px); }
.quick-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding: 14px; }.quick-action { padding: 13px; border: 1px solid var(--border-color); border-radius: var(--radius-md); color: inherit; background: var(--surface-2); transition: transform var(--t), border-color var(--t), background var(--t); }.quick-action:hover { color: inherit; transform: translateY(-2px); border-color: rgba(var(--brand-primary-rgb),.35); background: var(--surface-hover); }.quick-action > span { width: 32px; height: 32px; display:grid;place-items:center;margin-bottom:10px;border-radius:9px;color:var(--brand-primary);background:rgba(var(--brand-primary-rgb),.1)}.quick-action strong,.quick-action small{display:block}.quick-action strong{font-size:.76rem;color:var(--text-primary)}.quick-action small{margin-top:2px;font-size:.65rem;color:var(--text-muted)}
.master-snapshot { display: grid; grid-template-columns: repeat(4,1fr); margin: 0 14px 14px; padding: 12px 0; border-top: 1px solid var(--border-subtle); }.master-snapshot div{text-align:center;border-right:1px solid var(--border-subtle)}.master-snapshot div:last-child{border:0}.master-snapshot strong,.master-snapshot span{display:block}.master-snapshot strong{color:var(--text-primary);font-size:.92rem}.master-snapshot span{color:var(--text-muted);font-size:.6rem}

/* Document workflow — pipeline table and summary */
.workflow-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 24px 26px; border: 1px solid rgba(var(--brand-primary-rgb),.18); border-radius: var(--radius-lg); background: linear-gradient(110deg, rgba(var(--brand-primary-rgb),.10), rgba(79,70,229,.05) 58%, var(--surface-1)); }
.workflow-hero::after { content:""; position:absolute; width:190px;height:190px;right:-70px;top:-100px;border-radius:50%;background:radial-gradient(circle,rgba(79,70,229,.15),transparent 68%);pointer-events:none }.workflow-hero__eyebrow{color:var(--brand-primary);margin-bottom:7px}.workflow-hero h1{margin:0;font-size:clamp(1.5rem,3vw,2rem)}.workflow-hero p{margin:5px 0 0;color:var(--text-muted)}.workflow-hero__actions{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:9px}.workflow-hero .btn-outline-dark{--bs-btn-color:var(--text-secondary);--bs-btn-border-color:var(--border-color);--bs-btn-hover-color:var(--text-primary);--bs-btn-hover-bg:var(--surface-hover);--bs-btn-hover-border-color:var(--border-strong)}
.workflow-stat-card { position:relative;overflow:hidden;height:100%;border:1px solid var(--border-color);box-shadow:var(--shadow-xs)!important;--stat-color:var(--brand-primary) }.workflow-stat-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--stat-color)}.workflow-stat-card::after{content:"";position:absolute;width:72px;height:72px;right:-36px;top:-37px;border-radius:50%;background:color-mix(in srgb,var(--stat-color) 10%,transparent)}.workflow-stat-card--primary{--stat-color:var(--brand-primary)}.workflow-stat-card--warning{--stat-color:var(--brand-warning)}.workflow-stat-card--info{--stat-color:var(--brand-info)}.workflow-stat-card--indigo{--stat-color:var(--color-indigo-600)}.workflow-stat-card--success{--stat-color:var(--brand-success)}.workflow-stat-card--danger{--stat-color:var(--brand-danger)}.workflow-stat-card .card-body{padding:14px 15px!important}.workflow-stat-card .text-xs{color:var(--text-muted)!important;font-size:.62rem;font-weight:800!important;letter-spacing:.05em}.workflow-stat-card .h5{font-size:1.35rem}.workflow-stat-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;color:var(--stat-color);background:color-mix(in srgb,var(--stat-color) 11%,transparent);font-size:.95rem}
.workflow-matrix{border:1px solid var(--border-color);box-shadow:var(--shadow-sm)!important}.workflow-matrix__header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;background:var(--surface-1)}.workflow-matrix__header h2{margin:2px 0 0;font-size:1rem}.workflow-matrix__hint{color:var(--text-muted);font-size:.68rem}.workflow-matrix .card-body{padding:14px}.workflow-matrix .dataTables_wrapper{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.workflow-matrix .dt-buttons{order:1;margin:0 auto 0 0}.workflow-matrix .dataTables_filter{order:2;margin-left:auto}.workflow-matrix .table-responsive{order:3;flex:0 0 100%;border-radius:var(--radius-md)}.workflow-matrix .dataTables_info{order:4}.workflow-matrix .dataTables_paginate{order:5;margin-left:auto}.workflow-matrix .dt-buttons .btn{min-height:34px;padding:6px 10px;border-color:var(--border-color);color:var(--text-secondary);background:var(--surface-1)}
.workflow-table{min-width:1050px}.workflow-table thead th{padding:13px 14px!important;border-bottom:0!important;color:var(--text-secondary)!important;background:var(--surface-2)!important;font-size:.68rem!important}.workflow-table thead th:first-child{border-radius:10px 0 0 0}.workflow-table thead th:last-child{border-radius:0 10px 0 0}.workflow-table tbody tr{background:var(--surface-1);transition:transform var(--t-fast),box-shadow var(--t-fast)}.workflow-table tbody tr:hover>*{background:var(--surface-hover)!important}.workflow-table td{position:relative;min-width:185px;padding:16px 14px!important;vertical-align:top!important;border-right:1px solid var(--border-subtle);border-bottom:10px solid var(--page-bg)!important;background:var(--surface-1)!important}.workflow-table td:last-child{border-right:0;min-width:220px}.workflow-stage::before{content:"";position:absolute;left:0;top:0;right:0;height:2px;background:var(--stage-color);opacity:.8}.workflow-stage--memo{--stage-color:var(--brand-primary)}.workflow-stage--challan{--stage-color:var(--brand-warning)}.workflow-stage--bill{--stage-color:var(--brand-info)}.workflow-stage--pod{--stage-color:var(--color-indigo-600)}.workflow-stage--pending{--stage-color:var(--brand-danger)}.workflow-stage .border-top{border-color:var(--border-subtle)!important}.workflow-stage .btn-group{gap:5px}.workflow-stage .btn-group>.btn,.workflow-stage .btn-group>form>.btn{border-radius:8px!important}.workflow-stage .btn.w-100{justify-content:flex-start;border-style:dashed;background:var(--surface-2)}.workflow-stage .badge{width:100%;justify-content:flex-start;white-space:normal;text-align:left;border-radius:8px}
.workflow-matrix #workflowTable_wrapper > table { order: 3; flex: 0 0 100%; }

/* A calmer, card-based workflow report */
.workflow-table{min-width:1280px;border-collapse:separate!important;border-spacing:0 10px!important;background:transparent!important}
.workflow-table thead th{padding:10px 8px!important;background:transparent!important}
.workflow-table thead th:first-child,.workflow-table thead th:last-child{border-radius:0}
.stage-column-title{display:flex;align-items:center;gap:8px;color:var(--text-secondary);font-size:.69rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
.stage-column-title>i{width:23px;height:23px;display:grid;place-items:center;border-radius:7px;color:var(--brand-primary);background:rgba(var(--brand-primary-rgb),.1);font-size:.64rem;font-style:normal}
.stage-column-title--attention>i{color:var(--brand-danger);background:rgba(220,38,38,.09)}
.workflow-table tbody tr,.workflow-table tbody tr:hover{background:transparent!important;box-shadow:none!important;transform:none!important}
.workflow-table tbody tr:hover>*{background:transparent!important}
.workflow-table td{min-width:0;padding:0 5px!important;border:0!important;background:transparent!important}
.workflow-table td:first-child{width:280px}.workflow-table td:nth-child(2){width:235px}.workflow-table td:nth-child(3){width:215px}.workflow-table td:nth-child(4){width:215px}.workflow-table td:last-child{width:265px;min-width:265px}
.workflow-stage::before,.workflow-table tbody tr:hover td:first-child::before{display:none!important}
.workflow-record,.workflow-empty-stage,.workflow-attention{position:relative;display:flex;flex-direction:column;min-height:250px;padding:14px;border:1px solid var(--border-color);border-top:3px solid var(--stage-color);border-radius:13px;background:var(--surface-1);box-shadow:0 3px 12px rgba(15,23,42,.035);transition:border-color var(--t-fast),box-shadow var(--t-fast),transform var(--t-fast)}
.workflow-record:hover,.workflow-empty-stage:hover,.workflow-attention:hover{border-color:color-mix(in srgb,var(--stage-color) 35%,var(--border-color));box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.workflow-record__head{display:grid;grid-template-columns:38px minmax(0,1fr) 22px;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--border-subtle)}
.workflow-record__icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;color:var(--stage-color);background:color-mix(in srgb,var(--stage-color) 11%,transparent);font-size:.9rem}
.workflow-record__head>div{min-width:0}.workflow-record__head>div span,.workflow-record__head>div strong{display:block}.workflow-record__head>div span{margin-bottom:1px;color:var(--text-muted);font-size:.61rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.workflow-record__head>div strong{overflow:hidden;color:var(--text-primary);font-size:.84rem;text-overflow:ellipsis;white-space:nowrap}
.workflow-record__done{width:21px;height:21px;display:grid;place-items:center;border-radius:50%;color:var(--brand-success);background:rgba(22,163,74,.11);font-size:.58rem}
.workflow-record__meta{display:grid;gap:7px;padding:12px 1px}.workflow-record__meta>span{display:flex;align-items:center;gap:7px;min-width:0;overflow:hidden;color:var(--text-secondary);font-size:.68rem;text-overflow:ellipsis;white-space:nowrap}.workflow-record__meta i{width:14px;color:var(--text-muted);text-align:center}
.workflow-money-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:9px}.workflow-money-grid>div{min-width:0;padding:8px 6px;border-radius:8px;background:var(--surface-2)}.workflow-money-grid small,.workflow-money-grid strong{display:block}.workflow-money-grid small{color:var(--text-muted);font-size:.55rem}.workflow-money-grid strong{margin-top:2px;overflow:hidden;color:var(--text-primary);font-size:.69rem;font-variant-numeric:tabular-nums;text-overflow:ellipsis}.workflow-money-grid .is-balance{background:rgba(var(--brand-primary-rgb),.08)}.workflow-money-grid .is-balance strong{color:var(--brand-primary)}
.workflow-single-value{margin-top:1px;padding:11px 12px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--surface-2)}.workflow-single-value small,.workflow-single-value strong{display:block}.workflow-single-value small{color:var(--text-muted);font-size:.6rem}.workflow-single-value strong{margin-top:2px;color:var(--text-primary);font-size:.88rem;font-variant-numeric:tabular-nums}
.workflow-details{margin-bottom:8px;border:1px solid var(--border-subtle);border-radius:8px;background:var(--surface-2)}.workflow-details summary{display:flex;align-items:center;justify-content:space-between;padding:7px 9px;color:var(--text-secondary);font-size:.62rem;font-weight:700;cursor:pointer;list-style:none}.workflow-details summary::-webkit-details-marker{display:none}.workflow-details summary i{font-size:.5rem;transition:transform var(--t-fast)}.workflow-details[open] summary i{transform:rotate(180deg)}.workflow-details__body{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 9px;border-top:1px solid var(--border-subtle)}.workflow-details__body span,.workflow-details__body b{display:block}.workflow-details__body span{color:var(--text-primary);font-size:.62rem}.workflow-details__body b{margin-bottom:1px;color:var(--text-muted);font-size:.54rem;font-weight:600}
.workflow-record__actions{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:11px}.workflow-record__actions form{display:flex!important}.workflow-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:29px;padding:5px 9px;border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);background:var(--surface-1);font-size:.63rem;font-weight:700;line-height:1;transition:all var(--t-fast)}button.workflow-action{font-family:inherit}.workflow-action:hover{color:var(--brand-primary);border-color:rgba(var(--brand-primary-rgb),.35);background:rgba(var(--brand-primary-rgb),.07);transform:translateY(-1px)}.workflow-action--danger:hover{color:var(--brand-danger);border-color:rgba(220,38,38,.28);background:rgba(220,38,38,.07)}
.workflow-empty-stage{align-items:center;justify-content:center;text-align:center}.workflow-empty-stage>span{width:44px;height:44px;display:grid;place-items:center;margin-bottom:11px;border-radius:12px;color:var(--stage-color);background:color-mix(in srgb,var(--stage-color) 10%,transparent)}.workflow-empty-stage>strong{color:var(--text-primary);font-size:.77rem}.workflow-empty-stage>small{max-width:155px;margin:3px auto 14px;color:var(--text-muted);font-size:.63rem;line-height:1.45}.workflow-empty-stage>.btn{width:auto!important;justify-content:center!important;gap:6px;padding:6px 10px!important;border-style:solid!important;border-color:color-mix(in srgb,var(--stage-color) 45%,var(--border-color))!important;color:var(--stage-color)!important;background:transparent!important;font-size:.62rem}.workflow-empty-stage>.btn:hover{color:#fff!important;background:var(--stage-color)!important}.workflow-empty-stage--locked{filter:saturate(.3);opacity:.72}.workflow-empty-stage--locked>span{color:var(--text-muted);background:var(--surface-3)}
.workflow-attention{gap:11px}.workflow-attention__head{display:flex;align-items:center;gap:9px;padding-bottom:11px;border-bottom:1px solid var(--border-subtle)}.workflow-attention__head>span{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;color:var(--brand-danger);background:rgba(220,38,38,.09)}.workflow-attention.is-clear{--stage-color:var(--brand-success)}.workflow-attention.is-clear .workflow-attention__head>span{color:var(--brand-success);background:rgba(22,163,74,.1)}.workflow-attention__head small,.workflow-attention__head strong{display:block}.workflow-attention__head small{color:var(--text-muted);font-size:.57rem;text-transform:uppercase;letter-spacing:.06em}.workflow-attention__head strong{margin-top:1px;color:var(--text-primary);font-size:.76rem}
.workflow-attention__items{display:grid;gap:6px}.attention-chip{display:grid;grid-template-columns:25px 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;padding:7px 8px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--surface-2)}.attention-chip>i{grid-row:1/3;width:25px;height:25px;display:grid;place-items:center;border-radius:7px;color:var(--chip-color);background:color-mix(in srgb,var(--chip-color) 11%,transparent);font-size:.64rem}.attention-chip>b{color:var(--text-primary);font-size:.64rem}.attention-chip>small{color:var(--text-muted);font-size:.56rem}.attention-chip--warning{--chip-color:var(--brand-warning)}.attention-chip--info{--chip-color:var(--brand-info)}.attention-chip--neutral{--chip-color:var(--text-secondary)}.attention-chip--success{--chip-color:var(--brand-success)}.attention-chip--danger{--chip-color:var(--brand-danger)}.workflow-attention__clear{display:grid;place-items:center;gap:8px;min-height:130px;color:var(--text-muted);font-size:.66rem}.workflow-attention__clear i{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;color:var(--brand-success);background:rgba(22,163,74,.1)}

/* Subtle visual lift shared across otherwise-minimal CRUD/report pages */
.app-content { position: relative; background-image: radial-gradient(700px 220px at 88% -80px, rgba(var(--brand-primary-rgb),.07), transparent 70%); }
.app-content > h3, .app-content > h2 { position:relative;margin-bottom:18px;padding-bottom:12px }.app-content > h3::after,.app-content > h2::after{content:"";position:absolute;left:0;bottom:0;width:52px;height:3px;border-radius:3px;background:var(--gradient-primary)}
.app-content > form:not(.d-inline), .app-content > dl.row { padding:clamp(17px,2.5vw,24px);border:1px solid var(--border-color);border-radius:var(--radius-lg);background:var(--surface-1);box-shadow:var(--shadow-xs) }
.app-content .card:not(.workflow-stat-card):not(.metric-card):hover { border-color:color-mix(in srgb,var(--brand-primary) 16%,var(--border-color)); }
.card-header h5,.card-header h6{letter-spacing:-.005em}.card-header>h5 i,.card-header>h6 i{color:var(--brand-primary)}
.table tbody td:first-child{position:relative}.table-hover tbody tr:hover td:first-child::before{content:"";position:absolute;left:0;top:20%;bottom:20%;width:2px;border-radius:3px;background:var(--brand-primary)}

@media (max-width: 1199.98px){.dashboard-kpis{grid-template-columns:repeat(2,1fr)}.dashboard-main-grid,.dashboard-lower-grid{grid-template-columns:1fr}.cash-strip{grid-template-columns:1fr 1fr}.cash-strip__lead{grid-column:1/-1}.dashboard-welcome__visual{flex-basis:28%;min-width:220px}}
@media (max-width: 767.98px){.dashboard-welcome{min-height:auto}.dashboard-welcome__visual{display:none}.dashboard-main-grid,.dashboard-lower-grid{display:grid}.cash-strip{grid-template-columns:1fr}.cash-strip__lead{grid-column:auto}.cash-strip .btn{width:100%}.workflow-hero{align-items:flex-start;flex-direction:column}.workflow-hero__actions{width:100%}.workflow-hero__actions .btn{flex:1}.workflow-matrix__header{align-items:flex-start;flex-direction:column}.workflow-matrix__hint{display:none}.volume-chart{height:220px;padding-inline:12px}.volume-summary div{padding-inline:10px}}
@media (max-width: 575.98px){.dashboard-pro{gap:12px}.dashboard-welcome{padding:21px;border-radius:var(--radius-lg)}.dashboard-kpis{grid-template-columns:1fr}.metric-card{min-height:145px}.dashboard-panel__header{padding:14px}.volume-summary{margin:0 12px 12px}.quick-action-grid{padding:12px}.cash-strip{gap:16px;padding:16px}.workflow-stat-grid>div{width:50%}.workflow-stat-card .card-body{padding:12px!important}.workflow-hero__actions{flex-direction:column}.workflow-hero__actions .btn{width:100%}.workflow-matrix .dataTables_filter{width:100%;margin:0}.workflow-matrix .dataTables_filter label,.workflow-matrix .dataTables_filter input{width:100%;margin:0!important}.workflow-matrix .dt-buttons{width:100%}.workflow-matrix .dt-buttons .btn{flex:1}.master-snapshot{grid-template-columns:repeat(2,1fr);row-gap:10px}.master-snapshot div:nth-child(2){border-right:0}}

@media print {.dashboard-welcome,.workflow-hero{background:#fff!important;color:#000!important;box-shadow:none}.dashboard-welcome *,.workflow-hero *{color:#000!important}.dashboard-welcome__visual,.dashboard-welcome__actions,.workflow-hero__actions,.quick-panel{display:none!important}.dashboard-kpis,.dashboard-main-grid,.dashboard-lower-grid{display:block}.metric-card,.dashboard-panel,.cash-strip{margin-bottom:10px;break-inside:avoid}.volume-bar>i{background:#777!important}}

/* AI help support queue */
.service-token{color:var(--brand-primary);font-size:.7rem;font-variant-numeric:tabular-nums;white-space:nowrap}.ticket-question{min-width:250px;max-width:390px}.ticket-question strong,.ticket-question small{display:block}.ticket-question strong{overflow:hidden;color:var(--text-primary);font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.ticket-question small{margin-top:3px;color:var(--text-muted);font-size:.59rem}.ticket-detail-row:hover{box-shadow:none!important}.ticket-detail-row>td{background:transparent!important}.ticket-review{display:grid;grid-template-columns:1.1fr 1fr;gap:18px;margin:5px 12px 14px;padding:17px;border:1px solid var(--border-color);border-radius:12px;background:var(--surface-2)}.ticket-transcript{margin-top:8px;padding:9px 11px;border-radius:9px;background:var(--surface-1)}.ticket-transcript strong{display:block;margin-bottom:3px;color:var(--text-muted);font-size:.55rem;text-transform:uppercase}.ticket-transcript p{margin:0;color:var(--text-secondary);font-size:.66rem;line-height:1.5;white-space:pre-line}.ticket-transcript--user{border-left:3px solid var(--brand-primary)}.ticket-transcript--assistant{border-left:3px solid var(--brand-success)}.ticket-review__resolution textarea{margin-top:8px;font-size:.7rem}.ticket-review__resolution .alert{margin-top:8px;font-size:.68rem;white-space:pre-line}@media(max-width:767.98px){.ticket-review{grid-template-columns:1fr}}
