, no JS needed. */
.gst-others-advanced[b-bzwnqhqljm] {
margin: 14px 0;
border: 1px solid #e5e8ec;
border-radius: 5px;
background: #fafbfb;
padding: 2px 10px;
}
.gst-others-advanced summary[b-bzwnqhqljm] {
cursor: pointer;
font-size: 11px;
font-weight: 700;
letter-spacing: .3px;
color: #8a93a3;
padding: 8px 0;
list-style: none;
}
.gst-others-advanced summary[b-bzwnqhqljm]::-webkit-details-marker {
display: none;
}
.gst-others-advanced summary[b-bzwnqhqljm]::before {
content: "▸ ";
}
.gst-others-advanced[open] summary[b-bzwnqhqljm]::before {
content: "▾ ";
}
.gst-others-advanced[open][b-bzwnqhqljm] {
padding-bottom: 10px;
}
.gst-others-btn-exc[b-bzwnqhqljm] {
background: #fdf3f3;
border-color: #e7c6c6;
color: #c0392b;
text-align: left;
}
.gst-others-btn-exc:hover[b-bzwnqhqljm] {
background: #fbe4e4;
border-color: #c0392b;
}
.gst-others-btn-exc.active[b-bzwnqhqljm] {
background: #c0392b;
border-color: #c0392b;
color: #fff;
}
/* ── Badge + "Back to Invoices" row above the grid, when showing Exceptions/OTHERS-section
data — badge left, back button pushed to the far right. ── */
.gst-grid-toolbar[b-bzwnqhqljm] {
justify-content: space-between;
}
.gst-back-btn[b-bzwnqhqljm] {
margin-left: auto;
}
.gst-exc-badge[b-bzwnqhqljm] {
font-size: 11.5px;
font-weight: 700;
color: #c0392b;
text-transform: uppercase;
letter-spacing: .3px;
}
/* ── Footer left side (Total Records + Excel button, invoice mode) — same bspl-foot-btn "xls"
class TB/TDS use, just laid out inline with the count text here since GST's bspl-footer-left
didn't previously hold anything besides the count span. ── */
.bspl-footer-left[b-bzwnqhqljm] {
display: flex;
align-items: center;
gap: 10px;
}
/* ── Mobile ── */
@media (max-width: 767px) {
.gst-page .mu-card[b-bzwnqhqljm] {
margin: 0 10px;
}
.gst-sitecard[b-bzwnqhqljm] {
margin: 0 10px 12px;
}
.gst-toolbar[b-bzwnqhqljm] {
flex-wrap: wrap;
}
.gst-others-btn-grid[b-bzwnqhqljm] {
grid-template-columns: 1fr;
}
}
/* Click-to-sort grid headers — replaces the old drawer "Sort By"/"Sort Order" fields.
Plain clickable text only: no hover-highlight, no icon, no header cell divider — those
came from the shared mu-table th border/hover rule (meant for light-background tables)
fighting with this table's dark header, so they're killed off explicitly, scoped to just
this table via CSS isolation (only .gst-dyn-table on THIS page is affected). */
.gst-dyn-table thead th[b-bzwnqhqljm] {
border-right: none;
border-left: none;
}
.gst-th-sort[b-bzwnqhqljm] {
cursor: pointer;
user-select: none;
white-space: nowrap;
}
/* ── Ledger / Items columns (Invoice grid) — same fixed width so both line up, long values
truncate with an ellipsis instead of stretching the row. Full text still available via the
native title="" tooltip set on each | in the markup.
BUG FIX: max-width/overflow on the | itself did nothing — this table has NO
table-layout:fixed, so under the default "auto" layout the browser sizes each column to fit
its longest content first and only THEN applies overflow rules to the (now-already-widened)
cell box; a plain | max-width is not part of that column-width calculation at all. Fixing
it needs the width cap on something the auto-layout algorithm DOES measure as the cell's
content — an inline-block span with its own fixed width — so wrap the cell text in
(done in the markup) instead of styling the | directly. ── */
.gst-dyn-table td.gst-col-clip[b-bzwnqhqljm] {
max-width: 160px;
}
.gst-clip-inner[b-bzwnqhqljm] {
display: inline-block;
max-width: 160px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: bottom;
}
/*.gst-dyn-table thead th:hover,
.gst-dyn-table thead th.gst-th-sort:hover {
background-color: inherit;
}*/
/* ===== Append at END of FrmGST.razor.css (later rules override earlier ones) ===== */
/* 1) Dash tab — gray back colour */
.gst-dash-card[b-bzwnqhqljm] {
background: #eef0f3;
}
/* 2) Ledger "L" search button — copied from QLedger.razor.css (.ql-led-row / .ql-led-btn).
LedgerAutofill is a child component → ::deep to size its root so the button sits beside it. */
.ql-led-row[b-bzwnqhqljm] {
display: flex;
gap: 6px;
}
.ql-led-row[b-bzwnqhqljm] > *:first-child {
flex: 1;
min-width: 0;
}
.ql-led-btn[b-bzwnqhqljm] {
flex: 0 0 36px;
border-radius: 8px;
border: 1px solid #1a56a7;
background: #1a56a7;
color: #fff;
font-weight: 700;
font-size: 13px;
cursor: pointer;
font-family: inherit;
transition: background 0.12s;
}
.ql-led-btn:hover[b-bzwnqhqljm] {
background: #0f3d82;
}
/* /Components/Pages/Others/MBillsPending.razor.rz.scp.css */
/* =====================================================================
GAINS — MBillsPending.razor.css (Transactions → Bills Pending, page-scoped)
Shared "mu-"/"bspl-" chrome lives in wwwroot/CSS/masters-forms.css; .t-page
on the root wrapper gives this the transaction blue header treatment.
The db-table/ch-* classes below are redeclared verbatim from
ChallanGrid.razor.css — Blazor CSS isolation means that file's rules
can't reach this page, so every transaction-grid page keeps its own
copy (same convention already established there).
===================================================================== */
.bp-page[b-8vo7um1myz] {
display: flex;
flex-direction: column;
height: 100%;
}
.bp-page .mu-card[b-8vo7um1myz] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.bp-page .mu-toolbar[b-8vo7um1myz] {
flex-shrink: 0;
}
.bp-page .mu-table-wrap[b-8vo7um1myz] {
flex: 1;
overflow: auto;
min-height: 0;
}
.mu-foot[b-8vo7um1myz] {
flex-shrink: 0;
}
/* ── Toolbar: search + totals chips ── */
.bp-toolbar[b-8vo7um1myz] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
flex-wrap: wrap;
}
.bp-totals[b-8vo7um1myz] {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.bp-total-chip[b-8vo7um1myz] {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 5px 12px;
border-radius: 999px;
background: #f1f5f9;
color: #475569;
font-size: 11.5px;
font-weight: 600;
}
.bp-total-chip strong[b-8vo7um1myz] {
color: #0f172a;
font-weight: 700;
}
.bp-total-net[b-8vo7um1myz] {
background: #e8f8f4;
color: #0f766e;
}
.bp-total-net strong[b-8vo7um1myz] {
color: #0f766e;
}
/* ── Table density/striping — copied verbatim from ChallanGrid.razor.css's .db-table ── */
.db-table[b-8vo7um1myz] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
}
.db-table th[b-8vo7um1myz] {
text-align: left;
padding: 8px 10px;
border-bottom: 1px solid #ddd;
position: sticky;
top: 0;
z-index: 3;
/* background: #fff;*/
}
.db-table td[b-8vo7um1myz] {
padding: 6px 10px;
border-bottom: 1px solid #f2f2f2;
}
.db-table tfoot td[b-8vo7um1myz] {
position: sticky;
bottom: 0;
z-index: 3;
background: #e8e8e8;
}
.db-row-even[b-8vo7um1myz] {
background: #ffffff;
}
.db-row-odd[b-8vo7um1myz] {
background: #f5fafa;
}
.db-table tbody tr:hover[b-8vo7um1myz] {
background: #e8f5f0;
}
/* ── Numeric columns — right-aligned, tabular figures. The .db-table-th
override matches ChallanGrid's own specificity fix (".db-table th" beats
plain ".ch-num" otherwise, silently left-aligning header cells). ── */
.ch-num[b-8vo7um1myz] {
text-align: right;
font-variant-numeric: tabular-nums;
}
.db-table th.ch-num[b-8vo7um1myz] {
text-align: right;
}
/* ── Type badge (wType/wTypeAlias, colored via wColor from the API) ── */
.ch-type-badge[b-8vo7um1myz] {
display: inline-block;
padding: 3px 9px;
border-radius: 999px;
font-size: 11px;
font-weight: 700;
color: #fff;
letter-spacing: 0.02em;
white-space: nowrap;
}
.ch-party[b-8vo7um1myz] {
max-width: 220px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* ── Grand/page total row — sticky to the bottom of the scroll area ── */
.ch-total-row[b-8vo7um1myz] {
position: sticky;
bottom: 0;
z-index: 3;
background: #eef4fb;
font-weight: 700;
color: #1a2537;
}
.ch-total-row td[b-8vo7um1myz] {
border-top: 2px solid #306B9C;
}
@media (max-width: 767px) {
.bp-page .mu-toolbar[b-8vo7um1myz] {
flex-wrap: wrap;
}
.ch-party[b-8vo7um1myz] {
max-width: 120px;
}
}
.ql-lp-search-row[b-8vo7um1myz] {
display: flex;
align-items: center;
gap: 12px;
}
.ql-lp-search-row .uf-input[b-8vo7um1myz] {
flex: 1;
min-width: 0;
}
.ql-lp-search-row .mu-btn[b-8vo7um1myz] {
flex: 0 0 auto;
white-space: nowrap;
}
.theadebg[b-8vo7um1myz] {
background-color: #306B9C;
color: #fff;
}
.ql-led-btn[b-8vo7um1myz] {
flex: 0 0 36px;
border-radius: 8px;
border: 1px solid #1a56a7;
background: #1a56a7;
color: #fff;
font-weight: 700;
font-size: 13px;
cursor: pointer;
font-family: inherit;
transition: background 0.12s;
}
/* =====================================================================
View tabs — Details + Summary (Item / Ledger / Ledger-Item / VType)
===================================================================== */
.bp-tabbar[b-8vo7um1myz] {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 6px;
padding: 8px 16px;
background: #fff;
border-bottom: 1px solid #e7eaec;
flex-shrink: 0;
}
.bp-tab[b-8vo7um1myz] {
padding: 5px 14px;
border: 1px solid #dde3ed;
border-radius: 3px;
background: #fff;
color: #1a2537;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.03em;
font-family: inherit;
cursor: pointer;
transition: background 0.12s, border-color 0.12s;
}
.bp-tab:hover:not(:disabled)[b-8vo7um1myz] {
background: #f1f5f9;
}
.bp-tab.active[b-8vo7um1myz],
.bp-tab.active:hover[b-8vo7um1myz] {
background: #1ab99a;
border-color: #1ab99a;
color: #fff;
}
.bp-tab:disabled[b-8vo7um1myz] {
cursor: default;
}
.bp-tab-sep[b-8vo7um1myz] {
margin: 0 2px 0 10px;
padding-left: 12px;
border-left: 1px solid #dde3ed;
color: #94a3b8;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
}
/* ── Grid cells ── */
.bp-nowrap[b-8vo7um1myz] {
white-space: nowrap;
}
.bp-vnum[b-8vo7um1myz] {
color: #1a56a7;
font-weight: 600;
cursor: pointer;
}
.bp-vnum:hover[b-8vo7um1myz] {
text-decoration: underline;
}
/* Party / Ledger → QLedger */
.bp-led[b-8vo7um1myz] {
color: #2f8fd1;
cursor: pointer;
}
.bp-led:hover[b-8vo7um1myz] {
text-decoration: underline;
}
.bp-muted[b-8vo7um1myz] {
color: #64748b;
font-size: 11.5px;
}
.bp-vt-badge[b-8vo7um1myz] {
background: #306B9C;
}
/* =====================================================================
Filter drawer — master look (uf-input 32px boxes)
===================================================================== */
.bp-drawer .mu-drawer-section:first-child[b-8vo7um1myz] {
margin-top: -18px;
}
/* GlobalDatepicker → uf-input look (::deep — child renders .gdp-wrap) */
.bp-date-fld .gdp-field-row[b-8vo7um1myz] {
align-items: center;
}
.bp-date-fld[b-8vo7um1myz] .gdp-wrap {
height: 32px;
padding: 0 8px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
font-size: 13px;
color: #1a2537;
}
.bp-date-fld[b-8vo7um1myz] .gdp-wrap:hover {
border-color: #1a56a7;
}
.bp-date-fld[b-8vo7um1myz] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
}
.bp-date-fld[b-8vo7um1myz] .gdp-wrap.gdp-invalid {
border-color: #c0392b;
}
.bp-date-fld[b-8vo7um1myz] .gdp-value {
font-weight: 400;
}
/* Calendar + "C" reset — 32px boxes lined up with the date box */
.bp-date-fld .gcp-trigger[b-8vo7um1myz],
.bp-date-fld[b-8vo7um1myz] .gcp-trigger {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex: 0 0 32px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
cursor: pointer;
}
.bp-date-fld .gcp-trigger:hover[b-8vo7um1myz],
.bp-date-fld[b-8vo7um1myz] .gcp-trigger:hover {
border-color: #1a56a7;
background: #f8fafc;
}
.bp-date-fld .gcp-icon[b-8vo7um1myz] {
width: 16px;
height: 16px;
object-fit: contain;
display: block;
}
/* Sales / Purchase checkboxes stacked */
.bp-chk-col[b-8vo7um1myz] {
gap: 8px;
}
/* --VType-- dropdown: slim chevron */
.bp-sel-fld select[b-8vo7um1myz] {
-webkit-appearance: none;
appearance: none;
padding-right: 28px;
background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center;
cursor: pointer;
}
/* Ledger / Item autofill → full width uf-input look (child markup) */
.bp-ac[b-8vo7um1myz] .lga-wrap,
.bp-ac[b-8vo7um1myz] .ia-wrap {
width: 100%;
max-width: 100%;
}
.bp-ac[b-8vo7um1myz] input {
width: 100%;
height: 32px;
box-sizing: border-box;
padding: 6px 8px;
border: 1px solid #cbd5e1;
border-radius: 5px;
font-size: 13px;
font-family: inherit;
color: #1a2537;
}
.bp-ac[b-8vo7um1myz] input:focus {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
outline: none;
}
/* Ledger box + "L" search button on one row */
.bp-led-row[b-8vo7um1myz] {
display: flex;
align-items: center;
gap: 6px;
}
.bp-led-row[b-8vo7um1myz] .lga-wrap {
flex: 1;
min-width: 0;
}
.ql-led-btn[b-8vo7um1myz] {
height: 32px;
}
/* /Components/Pages/Others/MCostCenterGrid.razor.rz.scp.css */
/* =====================================================================
GAINS — MCostCenterGrid.razor.css (Transactions → Cost Center Grid, page-scoped)
Shared "mu-"/"bspl-" chrome lives in wwwroot/CSS/masters-forms.css; .t-page
on the root wrapper gives this the transaction blue header treatment.
The db-table/ch-* classes below are redeclared verbatim from
ChallanGrid.razor.css / MBillsPending.razor.css — Blazor CSS isolation
means those files' rules can't reach this page.
Pager = global standard.css db-pagination (GAINS_TB look).
===================================================================== */
.cc-page[b-3mjh8tw3lh] {
display: flex;
flex-direction: column;
height: 100%;
}
.cc-page .mu-card[b-3mjh8tw3lh] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.cc-page .mu-toolbar[b-3mjh8tw3lh] {
flex-shrink: 0;
}
.cc-page .mu-table-wrap[b-3mjh8tw3lh] {
flex: 1;
overflow: auto;
min-height: 0;
}
.mu-foot[b-3mjh8tw3lh] {
flex-shrink: 0;
}
/* ── Table density/striping — copied verbatim from MBillsPending.razor.css's .db-table ── */
.db-table[b-3mjh8tw3lh] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
}
.db-table th[b-3mjh8tw3lh] {
text-align: left;
padding: 8px 10px;
border-bottom: 1px solid #ddd;
position: sticky;
top: 0;
z-index: 3;
/*background: #fff;*/
}
.db-table td[b-3mjh8tw3lh] {
padding: 6px 10px;
border-bottom: 1px solid #f2f2f2;
}
.db-table tfoot td[b-3mjh8tw3lh] {
position: sticky;
bottom: 0;
z-index: 3;
background: #e8e8e8;
}
.db-row-even[b-3mjh8tw3lh] {
background: #ffffff;
}
.db-row-odd[b-3mjh8tw3lh] {
background: #f5fafa;
}
.db-table tbody tr:hover[b-3mjh8tw3lh] {
background: #e8f5f0;
}
.ch-num[b-3mjh8tw3lh] {
text-align: right;
font-variant-numeric: tabular-nums;
}
.db-table th.ch-num[b-3mjh8tw3lh] {
text-align: right;
}
.ch-type-badge[b-3mjh8tw3lh] {
display: inline-block;
padding: 3px 9px;
border-radius: 999px;
font-size: 11px;
font-weight: 700;
color: #fff;
letter-spacing: 0.02em;
white-space: nowrap;
}
.ch-party[b-3mjh8tw3lh] {
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ch-total-row[b-3mjh8tw3lh] {
position: sticky;
bottom: 0;
z-index: 3;
background: #eef4fb;
font-weight: 700;
color: #1a2537;
}
.ch-total-row td[b-3mjh8tw3lh] {
border-top: 2px solid #306B9C;
}
@media (max-width: 767px) {
.cc-page .mu-toolbar[b-3mjh8tw3lh] {
flex-wrap: wrap;
}
.ch-party[b-3mjh8tw3lh] {
max-width: 120px;
}
}
/* =====================================================================
Tabs — Drill Down / Pivot / Details (MAUI CostCenterGrid)
===================================================================== */
.cc-tabbar[b-3mjh8tw3lh] {
display: flex;
align-items: center;
gap: 6px;
padding: 8px 16px;
background: #fff;
border-bottom: 1px solid #e7eaec;
flex-shrink: 0;
}
.cc-tab[b-3mjh8tw3lh] {
padding: 5px 14px;
border: 1px solid #dde3ed;
border-radius: 3px;
background: #fff;
color: #1a2537;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.03em;
text-transform: uppercase;
font-family: inherit;
cursor: pointer;
transition: background 0.12s, border-color 0.12s;
}
.cc-tab:hover:not(:disabled)[b-3mjh8tw3lh] {
background: #f1f5f9;
}
.cc-tab.active[b-3mjh8tw3lh],
.cc-tab.active:hover[b-3mjh8tw3lh] {
background: #1ab99a;
border-color: #1ab99a;
color: #fff;
}
.cc-tab:disabled[b-3mjh8tw3lh] {
cursor: default;
}
/* ── Common cells ── */
.cc-nowrap[b-3mjh8tw3lh] {
white-space: nowrap;
}
.cc-vnum[b-3mjh8tw3lh] {
color: #1a56a7;
font-weight: 600;
cursor: pointer;
}
.cc-vnum:hover[b-3mjh8tw3lh] {
text-decoration: underline;
}
.cc-dr[b-3mjh8tw3lh] {
color: #306B9C;
}
.cc-cr[b-3mjh8tw3lh] {
color: #800000;
}
/* =====================================================================
Drill Down — CC Group → Cost Center → Ledger → voucher line
===================================================================== */
.cc-drill td[b-3mjh8tw3lh] {
white-space: nowrap;
}
.cc-exp-all[b-3mjh8tw3lh] {
margin-left: 12px;
}
.cc-exp-all button[b-3mjh8tw3lh] {
padding: 1px 8px;
border: 1px solid rgba(255, 255, 255, 0.6);
border-radius: 3px;
background: transparent;
color: inherit;
font-size: 11px;
font-weight: 600;
font-family: inherit;
cursor: pointer;
}
.cc-exp-all button + button[b-3mjh8tw3lh] {
margin-left: 4px;
}
.cc-exp-all button:hover[b-3mjh8tw3lh] {
background: rgba(255, 255, 255, 0.15);
}
.cc-indent[b-3mjh8tw3lh] {
display: inline-flex;
align-items: center;
gap: 6px;
}
.cc-caret[b-3mjh8tw3lh] {
width: 10px;
color: #64748b;
}
.cc-lv[b-3mjh8tw3lh] {
cursor: pointer;
}
.cc-table tbody tr.cc-lv0[b-3mjh8tw3lh] {
background: #dbe9f6;
font-weight: 700;
color: #1a2537;
}
.cc-table tbody tr.cc-lv1[b-3mjh8tw3lh] {
background: #eef4fb;
font-weight: 600;
}
.cc-table tbody tr.cc-lv2[b-3mjh8tw3lh] {
background: #f6f7f9;
}
.cc-table tbody tr.cc-line[b-3mjh8tw3lh] {
background: #fff;
}
.cc-table tbody tr.cc-lv:hover[b-3mjh8tw3lh] {
background: #e8f5f0;
}
/* =====================================================================
Pivot / Details
===================================================================== */
.cc-pivot td[b-3mjh8tw3lh],
.cc-pivot th[b-3mjh8tw3lh] {
white-space: nowrap;
}
.cc-ytd[b-3mjh8tw3lh] {
font-weight: 700;
}
.cc-drcr[b-3mjh8tw3lh] {
display: inline-block;
min-width: 24px;
margin-right: 6px;
padding: 1px 5px;
border-radius: 3px;
color: #fff;
font-size: 10px;
font-weight: 700;
text-align: center;
}
.cc-drcr.dr[b-3mjh8tw3lh] {
background: #306B9C;
}
.cc-drcr.cr[b-3mjh8tw3lh] {
background: #800000;
}
.cc-led[b-3mjh8tw3lh] {
cursor: pointer;
}
.cc-led.dr[b-3mjh8tw3lh] {
color: #306B9C;
}
.cc-led.cr[b-3mjh8tw3lh] {
color: #800000;
}
.cc-led:hover[b-3mjh8tw3lh] {
text-decoration: underline;
}
.cc-bal[b-3mjh8tw3lh] {
color: #475569;
white-space: nowrap;
}
.cc-narr[b-3mjh8tw3lh] {
max-width: 260px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #64748b;
}
/* Footer total next to the record count */
.cc-foot-total[b-3mjh8tw3lh] {
margin-left: 16px;
font-size: 12px;
color: #475569;
}
.cc-foot-total strong[b-3mjh8tw3lh] {
color: #1a2537;
}
/* =====================================================================
Filter drawer — master look (uf-input 32px boxes)
===================================================================== */
.cc-drawer .mu-drawer-section:first-child[b-3mjh8tw3lh] {
margin-top: -18px;
}
.cc-date-fld .gdp-field-row[b-3mjh8tw3lh] {
align-items: center;
}
.cc-date-fld[b-3mjh8tw3lh] .gdp-wrap {
height: 32px;
padding: 0 8px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
font-size: 13px;
color: #1a2537;
}
.cc-date-fld[b-3mjh8tw3lh] .gdp-wrap:hover {
border-color: #1a56a7;
}
.cc-date-fld[b-3mjh8tw3lh] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
}
.cc-date-fld[b-3mjh8tw3lh] .gdp-wrap.gdp-invalid {
border-color: #c0392b;
}
.cc-date-fld[b-3mjh8tw3lh] .gdp-value {
font-weight: 400;
}
.cc-date-fld .gcp-trigger[b-3mjh8tw3lh],
.cc-date-fld[b-3mjh8tw3lh] .gcp-trigger {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex: 0 0 32px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
cursor: pointer;
}
.cc-date-fld .gcp-trigger:hover[b-3mjh8tw3lh],
.cc-date-fld[b-3mjh8tw3lh] .gcp-trigger:hover {
border-color: #1a56a7;
background: #f8fafc;
}
.cc-date-fld .gcp-icon[b-3mjh8tw3lh] {
width: 16px;
height: 16px;
object-fit: contain;
display: block;
}
/* Dropdowns: slim chevron */
.cc-sel-fld select[b-3mjh8tw3lh] {
-webkit-appearance: none;
appearance: none;
padding-right: 28px;
background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center;
text-overflow: ellipsis;
cursor: pointer;
}
/* /Components/Pages/Others/MCustomerEntry.razor.rz.scp.css */
/* =====================================================================
MCustomerEntry.razor.css — Customer Profile entry page
Master CSS does the look:
masters-forms.css : mu-page/ms-page (card fill), uf-section / uf-sec-body
(green section strip + body), ms-form rows (140px label
+ uf-input box), uf-input, uf-chk, uf-err, uf-invalid,
uf-footer / uf-btn*, mu-confirm*, mu-toast
Only layout (columns, address/photo blocks) lives here.
===================================================================== */
.cust-page[b-1jlxszipsx] {
background: #f3f3f4;
}
.cust-card[b-1jlxszipsx] {
overflow: hidden;
}
.cust-body[b-1jlxszipsx] {
flex: 1;
min-height: 0;
overflow-y: auto;
padding: 16px 20px;
}
/* ── Sections (master uf-section) ── */
.cust-sec[b-1jlxszipsx] {
margin-top: 16px;
}
.cust-sec-first[b-1jlxszipsx] {
margin-top: 0;
}
.cust-sec-note[b-1jlxszipsx] {
margin-left: auto;
font-weight: 600;
letter-spacing: 0.02em;
text-transform: none;
}
/* Dispatch header: "Same as above" on the right */
.cust-dispatch-hdr[b-1jlxszipsx] {
justify-content: space-between;
}
.cust-same-as[b-1jlxszipsx] {
display: inline-flex;
align-items: center;
gap: 6px;
font-weight: 600;
text-transform: none;
letter-spacing: 0;
cursor: pointer;
}
.cust-same-as input[type="checkbox"][b-1jlxszipsx] {
margin: 0;
}
/* ── Top: Customer Type / GSTIN / Date, Is Active / Grade / Rating ── */
.cust-top-row[b-1jlxszipsx] {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px 24px;
}
.cust-top-row + .cust-top-row[b-1jlxszipsx] {
margin-top: 12px;
}
/* ── Two-column field grid (Personal / Marital) ── */
.cust-2col[b-1jlxszipsx] {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px 28px;
}
.cust-top-row .uf-field[b-1jlxszipsx],
.cust-2col .uf-field[b-1jlxszipsx],
.cust-addr-fields .uf-field[b-1jlxszipsx] {
margin-bottom: 0;
}
/* Input + inline validation message (PAN / GSTIN) */
.cust-inp-wrap[b-1jlxszipsx] {
display: flex;
flex-direction: column;
min-width: 0;
}
/* Mobile number: ISD code + number side by side */
.cust-mobile-wrap[b-1jlxszipsx] {
display: flex;
gap: 8px;
max-width: 320px;
}
.cust-mobile-wrap .cust-isd[b-1jlxszipsx] {
width: 56px !important;
flex: 0 0 56px;
text-align: center;
}
.cust-mobile-wrap input:not(.cust-isd)[b-1jlxszipsx] {
flex: 1;
min-width: 0;
}
/* ── Address / Dispatch Address: textarea left, stacked fields right ── */
.cust-addr-row[b-1jlxszipsx] {
display: grid;
grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
gap: 24px;
}
.cust-addr-textarea[b-1jlxszipsx] {
align-items: start;
}
.cust-addr-textarea textarea.uf-input[b-1jlxszipsx] {
max-width: none !important;
min-height: 140px;
resize: vertical;
}
.cust-addr-fields[b-1jlxszipsx] {
display: flex;
flex-direction: column;
gap: 10px;
}
/* ── Upload Photo ── */
.cust-photo-row[b-1jlxszipsx] {
display: flex;
align-items: center;
gap: 20px;
}
.cust-photo-input[b-1jlxszipsx] {
flex: 1;
}
.cust-photo-preview[b-1jlxszipsx] {
width: 120px;
height: 120px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
border: 1px dashed #cbd5e1;
border-radius: 8px;
background: #f8fafc;
color: #94a3b8;
font-size: 12px;
}
.cust-photo-preview img[b-1jlxszipsx] {
width: 100%;
height: 100%;
object-fit: cover;
}
/* Footer pinned under the scrolling body */
.cust-card .uf-footer[b-1jlxszipsx] {
flex-shrink: 0;
}
/* ── Narrow screens: one column ── */
@media (max-width: 1100px) {
.cust-top-row[b-1jlxszipsx] {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 767px) {
.cust-top-row[b-1jlxszipsx],
.cust-2col[b-1jlxszipsx],
.cust-addr-row[b-1jlxszipsx] {
grid-template-columns: minmax(0, 1fr);
}
.bspl-title-actions .mu-btn-label[b-1jlxszipsx] {
display: none;
}
}
/* /Components/Pages/Others/MCustomerGrid.razor.rz.scp.css */
/* =====================================================================
MCustomerGrid.razor.css — Others → Customer (grid)
Master CSS does the look; only page bits live here.
common-page-chrome.css : bspl-title-block, bspl-filter-toggle, bspl-footer
standard.css : db-pagination / db-page-btn (GAINS_TB pager)
masters-forms.css : mu-page/ms-page (card fill), mu-card, mu-toolbar,
mu-search, mu-count, mu-table (+ .t-page #306B9C
header), mu-row-click, mu-del, mu-drawer*, mu-fld,
uf-input, mu-btn, mu-confirm*, mu-toast
===================================================================== */
.cust-grid-page[b-lj3ii0ahrf] {
background: #f3f3f4;
}
/* 13 columns — scroll sideways inside the card on narrow screens */
.mu-table[b-lj3ii0ahrf] {
min-width: 1100px;
}
/* =====================================================================
Filter drawer — master look (uf-input 32px boxes, no labels)
===================================================================== */
.cust-drawer .mu-drawer-section:first-child[b-lj3ii0ahrf] {
margin-top: -18px;
}
/* GlobalDatepicker → uf-input look (::deep — child renders .gdp-wrap) */
.cust-date-fld .gdp-field-row[b-lj3ii0ahrf] {
align-items: center;
}
.cust-date-fld[b-lj3ii0ahrf] .gdp-wrap {
height: 32px;
padding: 0 8px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
font-size: 13px;
color: #1a2537;
}
.cust-date-fld[b-lj3ii0ahrf] .gdp-wrap:hover {
border-color: #1a56a7;
}
.cust-date-fld[b-lj3ii0ahrf] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
}
.cust-date-fld[b-lj3ii0ahrf] .gdp-wrap.gdp-invalid {
border-color: #c0392b;
}
.cust-date-fld[b-lj3ii0ahrf] .gdp-value {
font-weight: 400;
}
.cust-date-fld .gcp-trigger[b-lj3ii0ahrf],
.cust-date-fld[b-lj3ii0ahrf] .gcp-trigger {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex: 0 0 32px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
cursor: pointer;
}
.cust-date-fld .gcp-trigger:hover[b-lj3ii0ahrf],
.cust-date-fld[b-lj3ii0ahrf] .gcp-trigger:hover {
border-color: #1a56a7;
background: #f8fafc;
}
.cust-date-fld .gcp-icon[b-lj3ii0ahrf] {
width: 16px;
height: 16px;
object-fit: contain;
display: block;
}
/* Several boxes on one row (Active/Grade/Rating, Mobile/Phone, PAN/Zip) */
.cust-row2[b-lj3ii0ahrf],
.cust-row3[b-lj3ii0ahrf] {
flex-direction: row;
gap: 8px;
}
.cust-row2 > *[b-lj3ii0ahrf],
.cust-row3 > *[b-lj3ii0ahrf] {
flex: 1;
min-width: 0;
}
/* Dropdowns: slim chevron instead of the native arrow */
.cust-sel-fld select[b-lj3ii0ahrf] {
-webkit-appearance: none;
appearance: none;
padding-right: 26px;
background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 9px center;
text-overflow: ellipsis;
cursor: pointer;
}
/* ── Mobile: icon-only title buttons ── */
@media (max-width: 767px) {
.bspl-title-actions[b-lj3ii0ahrf] {
margin-left: auto;
display: flex;
gap: 8px;
}
.bspl-title-actions .mu-btn-label[b-lj3ii0ahrf],
.bspl-title-actions .bspl-filter-label[b-lj3ii0ahrf] {
display: none;
}
.bspl-title-actions .mu-btn[b-lj3ii0ahrf] {
padding: 8px 10px;
gap: 0;
}
}
/* /Components/Pages/Others/MPhysicalStock.razor.rz.scp.css */
/* =====================================================================
MPhysicalStock.razor.css — Others → Physical Stock
Master CSS does the look; only page bits live here.
common-page-chrome.css : bspl-title-block, bspl-filter-toggle, bspl-footer
standard.css : db-pagination / db-page-btn (GAINS_TB pager)
masters-forms.css : mu-page/ms-page (card fill), mu-card, mu-toolbar,
mu-search, mu-count, mu-table (+ .t-page #306B9C
header), mu-btn, mu-drawer*, mu-fld, uf-input /
uf-cell / uf-nospin, uf-chk, uf-modal*, mu-toast
===================================================================== */
.ps-page[b-yb05wosydk] {
background: #f3f3f4;
}
/* ── Toolbar: search left, actions right ── */
.ps-toolbar[b-yb05wosydk] {
flex-wrap: wrap;
}
.ps-tools[b-yb05wosydk] {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.ps-tools .mu-count[b-yb05wosydk] {
margin-right: 4px;
}
.ps-genvoucher-btn:disabled[b-yb05wosydk] {
opacity: 0.55;
cursor: not-allowed;
}
/* ── Grid ── */
.ps-table thead th[b-yb05wosydk] {
white-space: nowrap;
}
.ps-table tbody td[b-yb05wosydk] {
padding-top: 6px;
padding-bottom: 6px;
}
.ps-item[b-yb05wosydk] {
white-space: normal;
min-width: 220px;
}
.ps-code[b-yb05wosydk] {
color: #64748b;
font-size: 11.5px;
}
.ps-num-col[b-yb05wosydk] {
width: 110px;
text-align: right;
}
td.ps-num-col[b-yb05wosydk] {
font-variant-numeric: tabular-nums;
}
.ps-neg[b-yb05wosydk] {
color: #800000;
}
.ps-chk-col[b-yb05wosydk] {
width: 40px;
text-align: center;
}
.ps-chk-col input[b-yb05wosydk] {
margin: 0;
}
.ps-qty-col[b-yb05wosydk] {
width: 130px;
}
.ps-qty-inp[b-yb05wosydk] {
min-width: 90px;
text-align: right;
}
.ps-comment-inp[b-yb05wosydk] {
min-width: 180px;
}
/* Rows with unsaved edits */
.ps-table tbody tr.ps-dirty td[b-yb05wosydk] {
background: #fff8e1;
}
.ps-table tbody tr.ps-dirty td:first-child[b-yb05wosydk] {
box-shadow: inset 3px 0 0 #f59e0b;
}
/* Footer: selected count beside total */
.ps-foot-sel[b-yb05wosydk] {
margin-left: 14px;
}
/* =====================================================================
Filter drawer — master look (uf-input 32px boxes, no labels)
===================================================================== */
.ps-drawer .mu-drawer-section:first-child[b-yb05wosydk] {
margin-top: -18px;
}
.ps-date-fld .gdp-field-row[b-yb05wosydk] {
align-items: center;
}
.ps-date-fld[b-yb05wosydk] .gdp-wrap {
height: 32px;
padding: 0 8px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
font-size: 13px;
color: #1a2537;
}
.ps-date-fld[b-yb05wosydk] .gdp-wrap:hover {
border-color: #1a56a7;
}
.ps-date-fld[b-yb05wosydk] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
}
.ps-date-fld[b-yb05wosydk] .gdp-value {
font-weight: 400;
}
.ps-date-fld .gcp-trigger[b-yb05wosydk] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex: 0 0 32px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
cursor: pointer;
}
.ps-date-fld .gcp-trigger:hover[b-yb05wosydk] {
border-color: #1a56a7;
background: #f8fafc;
}
.ps-date-fld .gcp-icon[b-yb05wosydk] {
width: 16px;
height: 16px;
object-fit: contain;
display: block;
}
.ps-sel-fld select[b-yb05wosydk] {
-webkit-appearance: none;
appearance: none;
padding-right: 28px;
background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center;
text-overflow: ellipsis;
cursor: pointer;
}
/* =====================================================================
Compare / Summary popups — master uf-modal, widened
===================================================================== */
.ps-cmp-modal[b-yb05wosydk] {
max-width: 680px;
}
.ps-summary-modal[b-yb05wosydk] {
width: 95vw;
max-width: 1200px;
}
.ps-cmp-body[b-yb05wosydk] {
padding: 0;
max-height: calc(100vh - 240px);
overflow: auto;
}
.ps-cmp-table[b-yb05wosydk] {
font-size: 12.5px;
}
.ps-cmp-table thead th[b-yb05wosydk] {
position: sticky;
top: 0;
}
.ps-summary-wrap table[b-yb05wosydk] {
min-width: 1400px; /* 31 day columns — real horizontal scroll instead of squeezing */
}
.ps-summary-wrap th[b-yb05wosydk],
.ps-summary-wrap td[b-yb05wosydk] {
white-space: nowrap;
}
.ps-strong[b-yb05wosydk] {
font-weight: 700;
}
.ps-diff-neg[b-yb05wosydk] {
color: #b91c1c;
font-weight: 700;
}
.ps-diff-pos[b-yb05wosydk] {
color: #15803d;
font-weight: 700;
}
/* ── Narrow screens ── */
@media (max-width: 767px) {
.ps-tools .mu-btn-label[b-yb05wosydk],
.bspl-title-actions .mu-btn-label[b-yb05wosydk] {
display: none;
}
.ps-tools .mu-btn[b-yb05wosydk] {
padding: 8px 10px;
gap: 0;
}
.ps-comment-inp[b-yb05wosydk] {
min-width: 120px;
}
}
/* /Components/Pages/Others/Sr_collection.razor.rz.scp.css */
/* =====================================================================
SR_Collection.razor.css
Same structure as ITB.razor.css: page is a flex column, .mu-card grows to
fill the screen, Total row is sticky at the bottom of the grid, footer
(bspl-footer / db-pagination) comes from shared standard.css.
===================================================================== */
.src-page[b-8imz113g9b] {
display: flex;
flex-direction: column;
height: 100%;
}
/* Grid card fills ALL remaining height (was content-height => half screen) */
.src-page .mu-card[b-8imz113g9b] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
margin: 6px 16px 10px;
}
/* Scroll area is pinned to the card with position:absolute, so it ALWAYS fills the
card height (flex:1 on the wrapper was not growing). Table is 100% tall and a
filler row soaks up the spare space, so the Total row sits at the very bottom. */
.src-page .mu-card[b-8imz113g9b] {
position: relative;
min-height: 200px;
}
.src-page .mu-card > .src-table-wrap[b-8imz113g9b] {
position: absolute;
inset: 0;
min-height: 0;
height: auto !important;
max-height: none !important; /* shared .mu-table-wrap max-height was cutting the area short */
overflow: auto;
}
.src-page .src-grid-table[b-8imz113g9b] {
height: 100%;
}
.src-page .src-grid-table tbody tr.src-fill-row[b-8imz113g9b],
.src-page .src-grid-table tbody tr.src-fill-row:hover[b-8imz113g9b] {
background: transparent;
}
.src-page .src-grid-table tbody tr.src-fill-row td[b-8imz113g9b] {
height: 100%;
padding: 0;
border-bottom: 0;
}
.src-page .bspl-footer-right[b-8imz113g9b] {
display: flex;
align-items: center;
flex-wrap: nowrap;
gap: 16px;
}
.src-page .bspl-footer-left[b-8imz113g9b] {
display: flex;
align-items: center;
gap: 10px;
}
.src-error[b-8imz113g9b] {
margin: 8px 16px 0;
padding: 10px 14px;
background: #fdf3f3;
border-left: 4px solid #c0392b;
color: #c0392b;
font-size: 13px;
flex-shrink: 0;
}
/* ── Top block: section label + toolbar, pulled up like ITB's .db-tabbar so the
gap under the page title is tight. ── */
.src-topbar[b-8imz113g9b] {
flex-shrink: 0;
margin-top: -12px;
}
.src-section-hdr[b-8imz113g9b] {
padding: 0 16px;
font-size: 13px;
font-weight: 700;
letter-spacing: .3px;
text-transform: uppercase;
color: #306b9c;
}
.src-toolbar[b-8imz113g9b] {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 12px;
padding: 6px 16px 0;
font-size: 12.5px;
color: #555;
}
.src-toolbar .mu-fld[b-8imz113g9b] {
margin: 0;
}
/* Party/Ledger — fixed width (was flex-grow: stretched across the whole bar) */
.src-fld-ledger[b-8imz113g9b] {
flex: 0 0 300px;
width: 300px;
max-width: 100%;
}
.src-fld-sr[b-8imz113g9b] {
flex: 0 0 200px;
width: 200px;
}
.src-fld-sr select[b-8imz113g9b] {
width: 100%;
}
.src-fld-date[b-8imz113g9b] {
flex: 0 0 150px;
}
.src-toolbar-actions[b-8imz113g9b] {
display: flex;
gap: 8px;
margin-left: auto;
}
/* ── Date box — same master text-box look as ITB / BSPL (GlobalDatepicker) ── */
.bspl-date-fld[b-8imz113g9b] .gdp-wrap {
height: 32px;
padding: 0 8px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
font-size: 13px;
color: #1a2537;
}
.bspl-date-fld[b-8imz113g9b] .gdp-wrap:hover {
border-color: #1a56a7;
}
.bspl-date-fld[b-8imz113g9b] .gdp-wrap:focus,
.bspl-date-fld[b-8imz113g9b] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
outline: none;
}
.bspl-date-fld[b-8imz113g9b] .gdp-wrap.gdp-invalid {
border-color: #c0392b;
}
.bspl-date-fld[b-8imz113g9b] .gdp-icon {
color: #1a56a7;
}
.bspl-date-fld[b-8imz113g9b] .gdp-value {
font-weight: 400;
}
/* ── Grid ── */
.src-table-wrap[b-8imz113g9b] {
flex: 1;
overflow: auto;
min-height: 200px;
}
.src-grid-table[b-8imz113g9b] {
width: 100%;
border-collapse: separate;
border-spacing: 0;
}
.src-grid-table thead th[b-8imz113g9b] {
position: sticky;
top: 0;
z-index: 10;
background: #306b9c;
text-align: left;
font-size: 11.5px;
font-weight: 700;
line-height: 1.15;
padding: 4px 8px;
border: none !important;
box-shadow: none !important;
outline: none !important;
}
.src-grid-table tbody td[b-8imz113g9b],
.src-grid-table tfoot td[b-8imz113g9b] {
border-left: 1px solid #eef0f2;
border-right: 1px solid #eef0f2;
border-bottom: 1px solid #eef0f2;
border-top: 0;
}
.src-grid-table tbody td[b-8imz113g9b] {
padding: 6px 8px;
vertical-align: top;
font-size: 12.5px;
}
.src-grid-table tbody tr:hover[b-8imz113g9b] {
background: #f8fafc;
}
.src-row-collected[b-8imz113g9b] {
background: whitesmoke;
font-weight: 600;
}
.src-th-sort[b-8imz113g9b] {
cursor: pointer;
user-select: none;
}
.src-chk[b-8imz113g9b] {
width: 28px;
text-align: center;
}
.src-del-col[b-8imz113g9b] {
width: 32px;
text-align: center;
}
.src-vid[b-8imz113g9b] {
color: #2f8fd1;
font-weight: 600;
cursor: pointer;
}
.src-sub[b-8imz113g9b] {
color: #64748b;
font-size: 11px;
}
.src-party[b-8imz113g9b] {
max-width: 160px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.src-remarks[b-8imz113g9b] {
max-width: 150px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 11.5px;
color: #64748b;
}
.src-grid-table td.num[b-8imz113g9b],
.src-grid-table th.num[b-8imz113g9b] {
text-align: right;
font-variant-numeric: tabular-nums;
}
.src-del-btn[b-8imz113g9b] {
background: none;
border: none;
color: #c0392b;
cursor: pointer;
padding: 2px 6px;
font-size: 13px;
}
.src-del-btn:disabled[b-8imz113g9b] {
color: #cbd5e1;
cursor: not-allowed;
}
/* Total row — sticky at the bottom of the scrolling grid, always visible
(same treatment as ITB's tfoot). */
.src-total-row td[b-8imz113g9b] {
position: sticky;
bottom: 0;
z-index: 15;
background: #E1EAF1;
height: 40px;
min-height: 30px;
max-height: 30px;
padding: 4px 8px;
box-sizing: border-box;
font-size: 12px;
font-weight: 700;
}
.src-total-label[b-8imz113g9b] {
color: #64748b;
text-align: right;
}
.src-total-amounts[b-8imz113g9b] {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 2px;
font-variant-numeric: tabular-nums;
}
/* ── Footer buttons (Total Records / pagination come from shared CSS) ── */
.src-add-btn[b-8imz113g9b] {
background: #2f8f4e;
color: #fff;
border: none;
border-radius: 3px;
padding: 5px 12px;
font-size: 12px;
font-weight: 700;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 6px;
}
.src-reconcile-btn[b-8imz113g9b] {
background: #0B648E;
color: #fff;
border: none;
border-radius: 3px;
padding: 5px 12px;
font-size: 12px;
font-weight: 700;
cursor: pointer;
}
.src-reconcile-btn:disabled[b-8imz113g9b] {
opacity: .6;
cursor: not-allowed;
}
/* ── Add-voucher dialog ── */
.src-modal-pager[b-8imz113g9b] {
flex-shrink: 0;
display: flex;
justify-content: flex-end;
padding: 8px 0 0;
border-top: 1px solid #e3e6ea;
margin-top: 8px;
}
.src-modal-overlay[b-8imz113g9b] {
position: fixed;
inset: 0;
background: rgba(0,0,0,.45);
z-index: 1000;
}
.src-modal[b-8imz113g9b] {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: min(900px, 92vw);
max-height: 85vh;
display: flex;
flex-direction: column;
background: #fff;
border-radius: 6px;
box-shadow: 0 10px 40px rgba(0,0,0,.25);
z-index: 1001;
overflow: hidden;
}
.src-modal-hdr[b-8imz113g9b] {
flex-shrink: 0;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 14px;
background: #306b9c;
color: #fff;
font-size: 13px;
font-weight: 700;
letter-spacing: .3px;
text-transform: uppercase;
}
.src-modal-close[b-8imz113g9b] {
background: none;
border: none;
color: #fff;
font-size: 20px;
line-height: 1;
cursor: pointer;
}
.src-modal-body[b-8imz113g9b] {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
padding: 10px 14px;
overflow: auto;
}
.src-modal-body .src-table-wrap[b-8imz113g9b] {
max-height: 55vh;
}
.src-modal-foot[b-8imz113g9b] {
flex-shrink: 0;
padding: 10px 14px;
border-top: 1px solid #e3e6ea;
display: flex;
justify-content: flex-end;
}
.src-move-btn-wide[b-8imz113g9b] {
background: #5c6d20;
color: #fff;
border: none;
padding: 8px 20px;
border-radius: 4px;
font-weight: 700;
font-size: 13px;
cursor: pointer;
}
.src-move-btn-wide:disabled[b-8imz113g9b] {
opacity: .6;
cursor: not-allowed;
}
/* ── Mobile ── */
@media (max-width: 900px) {
.src-toolbar[b-8imz113g9b] {
flex-direction: column;
align-items: stretch;
}
.src-fld-ledger[b-8imz113g9b],
.src-fld-sr[b-8imz113g9b],
.src-fld-date[b-8imz113g9b] {
flex: 1 1 auto;
width: 100%;
}
.src-page .mu-card[b-8imz113g9b] {
margin: 6px 10px 10px;
}
.bspl-footer[b-8imz113g9b] {
flex-wrap: wrap;
gap: 8px;
}
}
.mu-card[b-8imz113g9b] {
border-radius : 3px;
}
/* /Components/Pages/Others/Sr_dispatch.razor.rz.scp.css */
/* =====================================================================
Sr_dispatch.razor.css — mirrors Sr_collection.razor.css (srd- prefix).
Shared chrome (bspl-title-block, bspl-footer, mu-card, mu-table-wrap)
comes from common-page-chrome.css / masters-forms.css.
===================================================================== */
.srd-page[b-m31l3jjh5v] {
display: flex;
flex-direction: column;
height: 100%;
}
.srd-section-hdr[b-m31l3jjh5v] {
flex-shrink: 0;
padding: 8px 16px 0;
font-size: 13px;
font-weight: 700;
letter-spacing: .3px;
text-transform: uppercase;
color: #306b9c;
}
.srd-toolbar[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
align-items: flex-end;
flex-wrap: wrap;
gap: 16px;
padding: 8px 16px;
font-size: 12.5px;
color: #555;
}
.srd-toolbar-actions[b-m31l3jjh5v] {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px 12px;
margin-left: auto;
}
.srd-chk-lbl[b-m31l3jjh5v] {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 12px;
cursor: pointer;
}
.srd-fld-ledger[b-m31l3jjh5v] {
flex: 1 1 320px;
min-width: 260px;
}
/* Uniform 32px control height (matches .uf-input): inputs, selects, date boxes, buttons. */
.srd-date-fld[b-m31l3jjh5v] {
min-width: 150px;
}
.srd-date-fld[b-m31l3jjh5v] .gdp-wrap {
height: 32px;
padding: 0 8px;
box-sizing: border-box;
border: 1px solid #cbd5e1;
border-radius: 5px;
font-size: 13px;
color: #1a2537;
}
.srd-date-fld[b-m31l3jjh5v] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
}
.srd-toolbar .mu-btn[b-m31l3jjh5v],
.srd-modal-filters .mu-btn[b-m31l3jjh5v] {
height: 32px;
box-sizing: border-box;
padding-top: 0;
padding-bottom: 0;
}
/* ── Grid ── */
.mu-table-wrap[b-m31l3jjh5v] {
min-height: 200px;
}
.srd-table-wrap[b-m31l3jjh5v] {
flex: 1;
overflow: auto;
min-height: 200px;
}
.srd-grid-table[b-m31l3jjh5v] {
width: 100%;
border-collapse: separate;
border-spacing: 0;
}
.srd-grid-table thead th[b-m31l3jjh5v] {
position: sticky;
top: 0;
z-index: 10;
background: #306b9c;
text-align: left;
font-size: 11.5px;
font-weight: 700;
line-height: 1.15;
padding: 4px 8px;
border: none !important;
box-shadow: none !important;
outline: none !important;
}
.srd-grid-table tbody td[b-m31l3jjh5v] {
padding: 6px 8px;
vertical-align: top;
font-size: 12.5px;
border-left: 1px solid #eef0f2;
border-right: 1px solid #eef0f2;
border-bottom: 1px solid #eef0f2;
border-top: 0;
}
.srd-grid-table tbody tr:hover[b-m31l3jjh5v] {
background: #f8fafc;
}
.srd-grid-table td.num[b-m31l3jjh5v],
.srd-grid-table th.num[b-m31l3jjh5v] {
text-align: right;
font-variant-numeric: tabular-nums;
}
.srd-row-disp[b-m31l3jjh5v] {
background: whitesmoke;
font-weight: 600;
}
.srd-chk[b-m31l3jjh5v] {
width: 28px;
text-align: center;
}
.srd-del-col[b-m31l3jjh5v] {
width: 32px;
text-align: center;
}
.srd-vid[b-m31l3jjh5v] {
color: #2f8fd1;
font-weight: 600;
cursor: pointer;
}
.srd-sub[b-m31l3jjh5v] {
color: #64748b;
font-size: 11px;
}
.srd-party[b-m31l3jjh5v] {
max-width: 180px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* Row delete uses the global .mu-del; only the disabled (reconciled) state is page-specific. */
.srd-del-col .mu-del:disabled[b-m31l3jjh5v] {
opacity: .4;
cursor: not-allowed;
}
/* ── Assigned / Dispatched / Balance strip (legacy grey bar) ── */
.srd-summary[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
justify-content: space-around;
padding: 8px 16px;
background: #E1EAF1;
font-size: 12px;
color: #333;
}
/* ── Footer buttons ── */
.srd-add-btn[b-m31l3jjh5v] {
background: #2f8f4e;
color: #fff;
border: none;
border-radius: 3px;
padding: 5px 12px;
font-size: 12px;
font-weight: 700;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 6px;
}
.srd-reconcile-btn[b-m31l3jjh5v] {
background: #0B648E;
color: #fff;
border: none;
border-radius: 3px;
padding: 5px 12px;
font-size: 12px;
font-weight: 700;
cursor: pointer;
}
.srd-reconcile-btn:disabled[b-m31l3jjh5v] {
opacity: .6;
cursor: not-allowed;
}
/* ── Add dialog ── */
.srd-modal-overlay[b-m31l3jjh5v] {
position: fixed;
inset: 0;
background: rgba(0,0,0,.45);
z-index: 1000;
}
.srd-modal[b-m31l3jjh5v] {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: min(1000px, 94vw);
max-height: 85vh;
display: flex;
flex-direction: column;
background: #fff;
border-radius: 6px;
box-shadow: 0 10px 40px rgba(0,0,0,.25);
z-index: 1001;
overflow: hidden;
}
.srd-modal-hdr[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 14px;
background: #306b9c;
color: #fff;
font-size: 13px;
font-weight: 700;
letter-spacing: .3px;
text-transform: uppercase;
}
.srd-modal-close[b-m31l3jjh5v] {
background: none;
border: none;
color: #fff;
font-size: 20px;
line-height: 1;
cursor: pointer;
}
.srd-modal-body[b-m31l3jjh5v] {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
padding: 10px 14px;
overflow: auto;
}
.srd-modal-body .srd-table-wrap[b-m31l3jjh5v] {
max-height: 55vh;
}
.srd-modal-filters[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
align-items: flex-end;
flex-wrap: wrap;
gap: 12px;
padding-bottom: 8px;
}
.srd-vid-search[b-m31l3jjh5v] {
width: 110px;
}
.srd-modal-foot[b-m31l3jjh5v] {
flex-shrink: 0;
padding: 10px 14px;
border-top: 1px solid #e3e6ea;
display: flex;
justify-content: flex-end;
}
.srd-move-btn-wide[b-m31l3jjh5v] {
background: #5c6d20;
color: #fff;
border: none;
padding: 8px 20px;
border-radius: 4px;
font-weight: 700;
font-size: 13px;
cursor: pointer;
}
.srd-move-btn-wide:disabled[b-m31l3jjh5v] {
opacity: .6;
cursor: not-allowed;
}
@media (max-width: 900px) {
.srd-toolbar[b-m31l3jjh5v] {
flex-direction: column;
align-items: stretch;
}
.bspl-footer[b-m31l3jjh5v] {
flex-wrap: wrap;
gap: 8px;
}
}
/* ── Reconcile dialog ── */
.srd-modal-wide[b-m31l3jjh5v] {
width: min(1150px, 96vw);
}
.srd-recon-info[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
gap: 40px;
padding-bottom: 8px;
font-size: 12.5px;
color: #334155;
}
.srd-modal-foot-left[b-m31l3jjh5v] {
justify-content: flex-start;
}
.srd-qty-inp[b-m31l3jjh5v] {
width: 90px;
text-align: right;
}
/* ── Interactivity ── */
.srd-row[b-m31l3jjh5v] {
cursor: pointer;
transition: background .12s;
}
.srd-row:hover[b-m31l3jjh5v] {
background: #eef4fa;
}
.srd-grid-table tbody tr.srd-row-sel[b-m31l3jjh5v],
.srd-grid-table tbody tr.srd-row-sel:hover[b-m31l3jjh5v] {
background: #dbeafe;
}
.srd-grid-table input[type=checkbox][b-m31l3jjh5v] {
cursor: pointer;
width: 15px;
height: 15px;
}
.srd-add-btn[b-m31l3jjh5v], .srd-reconcile-btn[b-m31l3jjh5v], .srd-move-btn-wide[b-m31l3jjh5v] {
transition: filter .12s, transform .06s;
}
.srd-add-btn:hover:not(:disabled)[b-m31l3jjh5v], .srd-reconcile-btn:hover:not(:disabled)[b-m31l3jjh5v], .srd-move-btn-wide:hover:not(:disabled)[b-m31l3jjh5v] {
filter: brightness(1.12);
}
.srd-add-btn:active:not(:disabled)[b-m31l3jjh5v], .srd-reconcile-btn:active:not(:disabled)[b-m31l3jjh5v], .srd-move-btn-wide:active:not(:disabled)[b-m31l3jjh5v] {
transform: translateY(1px);
}
.srd-add-btn:focus-visible[b-m31l3jjh5v], .srd-reconcile-btn:focus-visible[b-m31l3jjh5v], .srd-move-btn-wide:focus-visible[b-m31l3jjh5v], .srd-modal-close:focus-visible[b-m31l3jjh5v] {
outline: 2px solid #1a56a7;
outline-offset: 2px;
}
.srd-modal-close:hover[b-m31l3jjh5v] {
opacity: .75;
}
.srd-modal[b-m31l3jjh5v] {
animation: srd-pop-b-m31l3jjh5v .14s ease-out;
}
@keyframes srd-pop-b-m31l3jjh5v {
from { opacity: 0; transform: translate(-50%, -48%); }
to { opacity: 1; transform: translate(-50%, -50%); }
}
/* ── Responsive ── */
.srd-grid-table[b-m31l3jjh5v] {
min-width: 560px;
}
.srd-table-wrap[b-m31l3jjh5v] {
overflow-x: auto;
}
@media (max-width: 1100px) {
.srd-toolbar-actions[b-m31l3jjh5v] {
margin-left: 0;
width: 100%;
}
}
@media (max-width: 900px) {
.srd-summary[b-m31l3jjh5v] {
flex-wrap: wrap;
justify-content: flex-start;
gap: 6px 20px;
}
.srd-date-fld[b-m31l3jjh5v] {
min-width: 0;
width: 100%;
}
.srd-recon-info[b-m31l3jjh5v] {
flex-direction: column;
gap: 4px;
}
.srd-modal-filters > *[b-m31l3jjh5v] {
flex: 1 1 100%;
}
.srd-vid-search[b-m31l3jjh5v] {
width: 100%;
}
}
@media (max-width: 640px) {
.srd-modal[b-m31l3jjh5v] {
width: 100vw;
max-height: 100vh;
height: 100vh;
border-radius: 0;
}
.srd-modal-body .srd-table-wrap[b-m31l3jjh5v] {
max-height: none;
}
.srd-toolbar[b-m31l3jjh5v] {
padding: 8px 10px;
gap: 10px;
}
.srd-toolbar-actions .mu-btn[b-m31l3jjh5v] {
flex: 1 1 auto;
justify-content: center;
}
.srd-modal-foot .srd-move-btn-wide[b-m31l3jjh5v],
.srd-modal-foot .srd-reconcile-btn[b-m31l3jjh5v] {
width: 100%;
}
}
/* ── Reconcile dialog polish ── */
.srd-recon-info i[b-m31l3jjh5v] {
color: #306b9c;
margin-right: 4px;
}
.srd-modal:focus[b-m31l3jjh5v] {
outline: none;
}
.srd-recon-chips[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
padding-bottom: 10px;
}
.srd-chip[b-m31l3jjh5v] {
background: #eef3f8;
border: 1px solid #d9e2ec;
border-radius: 999px;
padding: 3px 12px;
font-size: 12px;
color: #475569;
}
.srd-chip b[b-m31l3jjh5v] {
color: #1a2537;
margin-left: 4px;
font-variant-numeric: tabular-nums;
}
.srd-chip-warn[b-m31l3jjh5v] { background: #fff7e6; border-color: #fde0a8; }
.srd-chip-sel[b-m31l3jjh5v] { background: #dbeafe; border-color: #bcd3f5; }
.srd-recon-quick[b-m31l3jjh5v] {
margin-left: auto;
display: inline-flex;
gap: 6px;
}
.srd-link-btn[b-m31l3jjh5v] {
background: none;
border: 1px solid #cbd5e1;
border-radius: 4px;
padding: 3px 10px;
font-size: 12px;
color: #306b9c;
cursor: pointer;
transition: background .12s;
}
.srd-link-btn:hover:not(:disabled)[b-m31l3jjh5v] { background: #eef4fa; }
.srd-link-btn:disabled[b-m31l3jjh5v] { opacity: .5; cursor: not-allowed; }
.srd-recon-table[b-m31l3jjh5v] {
table-layout: fixed;
}
.srd-recon-table thead th[b-m31l3jjh5v] {
vertical-align: middle;
white-space: nowrap;
}
.srd-recon-table tbody td[b-m31l3jjh5v] {
vertical-align: middle;
}
.srd-th-sm[b-m31l3jjh5v] {
font-size: 11px;
font-weight: 700;
}
.srd-qty-wrap[b-m31l3jjh5v] {
display: inline-flex;
align-items: center;
gap: 4px;
}
.srd-qty-inp[b-m31l3jjh5v] {
width: 90px;
height: 28px;
text-align: right;
}
.srd-full-btn[b-m31l3jjh5v] {
background: #fff;
border: 1px solid #306b9c;
color: #306b9c;
border-radius: 4px;
padding: 2px 8px;
font-size: 11px;
font-weight: 700;
cursor: pointer;
transition: background .12s, color .12s;
}
.srd-full-btn:hover[b-m31l3jjh5v] {
background: #306b9c;
color: #fff;
}
.srd-badge[b-m31l3jjh5v] {
display: inline-block;
min-width: 48px;
text-align: center;
padding: 2px 8px;
border-radius: 999px;
font-size: 11.5px;
font-weight: 700;
font-variant-numeric: tabular-nums;
}
.srd-badge-ok[b-m31l3jjh5v] { background: #dcfce7; color: #166534; }
.srd-badge-warn[b-m31l3jjh5v] { background: #fff1d6; color: #92580a; }
.srd-empty[b-m31l3jjh5v] {
text-align: center;
padding: 36px 12px !important;
color: #64748b;
font-size: 13px;
}
.srd-empty i[b-m31l3jjh5v] {
font-size: 28px;
color: #cbd5e1;
margin-bottom: 8px;
display: block;
}
.srd-modal-foot-split[b-m31l3jjh5v] {
justify-content: space-between;
gap: 8px;
}
.srd-modal-foot-split .srd-reconcile-btn:disabled[b-m31l3jjh5v] {
opacity: .5;
}
@media (max-width: 900px) {
.srd-recon-quick[b-m31l3jjh5v] { margin-left: 0; }
.srd-recon-table[b-m31l3jjh5v] { table-layout: auto; min-width: 760px; }
}
/* ── Two-row toolbar (old form layout) ── */
.srd-toolbar[b-m31l3jjh5v] {
flex-direction: column;
align-items: stretch;
gap: 8px;
}
.srd-row-flds[b-m31l3jjh5v] {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px 12px;
}
.srd-fld-sp[b-m31l3jjh5v] { width: 190px; }
.srd-fld-vid[b-m31l3jjh5v] { width: 120px; }
.srd-fld-tr[b-m31l3jjh5v] { width: 220px; }
.srd-fld-veh[b-m31l3jjh5v] { width: 150px; }
.srd-row-flds .srd-fld-ledger[b-m31l3jjh5v] {
flex: 1 1 260px;
min-width: 220px;
max-width: 380px;
}
.srd-go-btn[b-m31l3jjh5v] {
height: 32px;
width: 40px;
border: none;
border-radius: 4px;
background: #2f8f4e;
color: #fff;
cursor: pointer;
transition: filter .12s, transform .06s;
}
.srd-go-btn:hover:not(:disabled)[b-m31l3jjh5v] { filter: brightness(1.12); }
.srd-go-btn:active:not(:disabled)[b-m31l3jjh5v] { transform: translateY(1px); }
.srd-go-btn:disabled[b-m31l3jjh5v] { opacity: .6; cursor: not-allowed; }
@media (max-width: 900px) {
.srd-fld-sp[b-m31l3jjh5v], .srd-fld-vid[b-m31l3jjh5v], .srd-fld-tr[b-m31l3jjh5v], .srd-fld-veh[b-m31l3jjh5v] {
width: 100%;
}
.srd-row-flds .srd-fld-ledger[b-m31l3jjh5v] {
max-width: none;
}
}
/* ── Tighter vertical spacing (.mu-page default gap is 16px) ── */
.srd-page[b-m31l3jjh5v] {
gap: 10px;
}
.srd-toolbar[b-m31l3jjh5v] {
padding: 2px 10px;
gap: 6px;
}
/* Grid card takes all spare height so the Assigned/Dispatched/Balance strip
sits at the bottom, directly above the Total Records footer. */
.srd-page > .mu-card[b-m31l3jjh5v] {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
}
.srd-page > .mu-card > .srd-table-wrap[b-m31l3jjh5v] {
flex: 1 1 auto;
}
/* ── Split view: Unassigned | >> | Assigned ── */
.srd-split[b-m31l3jjh5v] {
flex: 1 1 auto;
min-height: 0;
display: flex;
align-items: stretch;
gap: 0;
padding: 0 10px;
}
.srd-pane[b-m31l3jjh5v] {
flex: 1 1 0;
min-width: 0;
display: flex;
flex-direction: column;
}
.srd-pane > .mu-card[b-m31l3jjh5v] {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
}
.srd-pane-hdr[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
justify-content: space-between;
align-items: baseline;
padding: 2px 2px 4px;
font-size: 12.5px;
font-weight: 700;
letter-spacing: .3px;
text-transform: uppercase;
color: #306b9c;
}
.srd-pane-count[b-m31l3jjh5v] {
font-size: 11px;
font-weight: 400;
text-transform: none;
color: #64748b;
}
.srd-mid[b-m31l3jjh5v] {
flex: 0 0 34px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 8px;
background: #1e8e3e;
border-radius: 3px;
}
.srd-move-btn[b-m31l3jjh5v] {
width: 32px;
height: 56px;
border: 1px solid #cbd5e1;
border-radius: 3px;
background: #f1f5f9;
color: #1a2537;
font-size: 13px;
font-weight: 700;
cursor: pointer;
transition: background .12s, transform .06s;
}
.srd-move-btn:hover:not(:disabled)[b-m31l3jjh5v] { background: #fff; }
.srd-move-btn:active:not(:disabled)[b-m31l3jjh5v] { transform: translateY(1px); }
.srd-move-btn:disabled[b-m31l3jjh5v] { opacity: .55; cursor: not-allowed; }
.srd-split .srd-summary[b-m31l3jjh5v] {
margin-top: 4px;
padding: 6px 8px;
gap: 6px 14px;
}
@media (max-width: 900px) {
.srd-split[b-m31l3jjh5v] {
flex-direction: column;
padding: 0 10px;
}
.srd-pane[b-m31l3jjh5v] {
flex: none;
}
.srd-mid[b-m31l3jjh5v] {
flex: 0 0 auto;
margin: 8px 0;
height: 40px;
}
.srd-move-btn[b-m31l3jjh5v] {
width: 100%;
height: 32px;
}
.srd-move-txt[b-m31l3jjh5v] {
display: inline-block;
transform: rotate(90deg);
}
}
/* ── Unassigned grid is the only pane on the page now ── */
.srd-split[b-m31l3jjh5v] {
display: block;
}
.srd-split > .srd-pane[b-m31l3jjh5v] {
height: 100%;
}
.srd-assigned-bar[b-m31l3jjh5v] {
flex-shrink: 0;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px 16px;
padding-bottom: 8px;
}
.srd-assigned-actions[b-m31l3jjh5v] {
display: contents;
}
.srd-modal .srd-summary[b-m31l3jjh5v] {
margin-top: 6px;
}
.srd-modal .mu-card[b-m31l3jjh5v] {
display: flex;
flex-direction: column;
min-height: 0;
}
.srd-move-foot[b-m31l3jjh5v] {
background: #5c6d20;
color: #fff;
border: none;
border-radius: 3px;
padding: 5px 16px;
font-size: 12px;
font-weight: 700;
cursor: pointer;
transition: filter .12s, transform .06s;
}
.srd-move-foot:hover:not(:disabled)[b-m31l3jjh5v] { filter: brightness(1.12); }
.srd-move-foot:active:not(:disabled)[b-m31l3jjh5v] { transform: translateY(1px); }
.srd-move-foot:disabled[b-m31l3jjh5v] { opacity: .55; cursor: not-allowed; }
/* Assigned popup: grid area 30px taller than the default 200px minimum */
.srd-modal-assigned .srd-table-wrap[b-m31l3jjh5v] {
min-height: 230px;
}
/* Assigned popup: tall — grid area grows to fill (≈ down to the marked line) */
.srd-modal-assigned[b-m31l3jjh5v] {
height: min(80vh, 600px);
}
.srd-modal-assigned .srd-modal-body > .mu-card[b-m31l3jjh5v] {
flex: 1 1 auto;
min-height: 0;
}
.srd-modal-assigned .srd-modal-body .srd-table-wrap[b-m31l3jjh5v] {
max-height: none;
height: 100%;
}
/* Reconcile popup: same tall size as the Assigned popup */
.srd-modal-recon[b-m31l3jjh5v] {
height: min(80vh, 600px);
}
.srd-modal-recon .srd-modal-body > .srd-table-wrap[b-m31l3jjh5v] {
flex: 1 1 auto;
min-height: 230px;
max-height: none;
}
/* Reconcile popup: grid frame fills the whole popup body (no blank gap under the grid) */
.srd-modal-recon .srd-modal-body > .srd-table-wrap[b-m31l3jjh5v] {
border: 1px solid #e3e6ea;
border-radius: 6px;
background: #fff;
}
/* ── voucher grouping (old form: VID/date/party once, then one line per item) ── */
.srd-grid-table tbody tr.srd-vgrp td[b-m31l3jjh5v] {
border-top: 1px solid #dbe3ec;
}
.srd-grid-table tbody tr:not(.srd-vgrp) td[b-m31l3jjh5v] {
padding-top: 2px;
}
.srd-qtytotal[b-m31l3jjh5v] {
flex-shrink: 0;
text-align: right;
padding: 4px 8px 0;
font-size: 12px;
color: #334155;
}
.srd-modal-item[b-m31l3jjh5v] {
width: min(620px, 94vw);
height: min(60vh, 460px);
z-index: 1101;
}
.srd-overlay-top[b-m31l3jjh5v] {
z-index: 1100;
}
/* Required-field errors sit under the field (global .uf-invalid / .uf-err) — keep row aligned to the top */
.srd-row-flds[b-m31l3jjh5v] {
align-items: flex-start;
}
.srd-date-fld.uf-invalid[b-m31l3jjh5v] .gdp-wrap {
border-color: #e11d48 !important;
background: #fff5f6;
}
/* ── Fix toolbar row spacing: every field is exactly 32px tall; validation text is
laid over the gap (absolute) so it never stretches the row. ── */
.srd-toolbar[b-m31l3jjh5v] {
gap: 20px;
}
.srd-row-flds > .mu-fld[b-m31l3jjh5v] {
position: relative;
height: 32px;
}
.srd-date-fld[b-m31l3jjh5v] .gdp-error-msg {
display: none;
}
/* Desktop: each filter row is exactly one field tall, whatever the children render
(LedgerAutofill / date pickers were stretching row 1). Wraps naturally on small screens. */
@media (min-width: 901px) {
.srd-row-flds[b-m31l3jjh5v] {
height: 32px;
flex-wrap: nowrap;
align-content: flex-start;
}
.srd-toolbar[b-m31l3jjh5v] {
gap: 24px;
}
}
/* /Components/Pages/Others/TransporterDetails.razor.rz.scp.css */
/* =====================================================================
TransporterDetails.razor.css
Master CSS does the look — this file only adds what master lacks.
common-page-chrome.css : bspl-title-block, bspl-filter-toggle, bspl-footer
standard.css : db-pagination / db-page-btn (GAINS_TB pager)
masters-forms.css : mu-card, mu-table (+ .t-page #306B9C header,
sticky), mu-drawer*, mu-fld, uf-input, uf-chk,
mu-btn, mu-toast,
gdp-* (GlobalDatepicker), ms-page (card fill)
===================================================================== */
/* Page = flex column: header fixed, content flexes, footer pinned bottom
(common-page-chrome NOTE). ms-page on root handles card/table-wrap fill. */
.td-page[b-c9xewzsgyc] {
display: flex;
flex-direction: column;
height: 100%;
background: #f3f3f4;
}
/* Middle region — ms-page's .mu-card { flex:1 } needs a flex-column parent. */
.td-content[b-c9xewzsgyc] {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
}
/* 15 columns → scroll sideways inside mu-table-wrap, never the page. */
.td-table[b-c9xewzsgyc] {
min-width: 1500px;
}
.td-table td.td-wrap[b-c9xewzsgyc] {
white-space: normal;
min-width: 160px;
max-width: 260px;
}
.td-table .text-end[b-c9xewzsgyc] {
text-align: right;
}
/* ── Drawer: green section bar flush under the dark header.
Master: body padding 18px + section margin 0 -18px → 18px white gap on top. ── */
.td-page .mu-drawer-section:first-child[b-c9xewzsgyc] {
margin-top: -18px;
}
/* ── Drawer: GlobalDatepicker box → same 32px look as .uf-input
(master .gdp-wrap is 5px pad / #dde3ed / 6px radius). ::deep — rendered by child. ── */
.td-date-fld[b-c9xewzsgyc] .gdp-wrap {
height: 32px;
padding: 0 8px;
border-color: #cbd5e1;
border-radius: 5px;
}
.td-date-fld[b-c9xewzsgyc] .gdp-wrap:focus-within {
border-color: #1a56a7;
box-shadow: 0 0 0 3px rgba(26, 86, 167, 0.12);
}
.td-date-fld[b-c9xewzsgyc] .gdp-value {
font-weight: 400;
}
/* Calendar (GreenCalendarPicker) + "C" reset — not in master; 32px square,
lined up with the date box. Plain ![]() reuses .gcp-* names. */
.td-date-fld .gdp-field-row[b-c9xewzsgyc] {
align-items: center;
}
.td-date-fld .gcp-trigger[b-c9xewzsgyc],
.td-date-fld[b-c9xewzsgyc] .gcp-trigger {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex: 0 0 32px;
border: 1px solid #cbd5e1;
border-radius: 5px;
background: #fff;
cursor: pointer;
}
.td-date-fld .gcp-trigger:hover[b-c9xewzsgyc],
.td-date-fld[b-c9xewzsgyc] .gcp-trigger:hover {
border-color: #1a56a7;
background: #f8fafc;
}
.td-date-fld .gcp-icon[b-c9xewzsgyc] {
width: 16px;
height: 16px;
object-fit: contain;
display: block;
}
/* ── Drawer: PUR / SLS / Link status in one row.
mu-fld is a column → switch to row; checkbox look = master uf-chk. ── */
.td-chk-row[b-c9xewzsgyc] {
flex-direction: row;
align-items: center;
gap: 14px;
}
.td-chk-row .uf-chk[b-c9xewzsgyc] {
flex: 0 0 auto;
}
.td-chk-row .td-pending[b-c9xewzsgyc] {
flex: 1;
min-width: 0;
width: auto;
}
/* ── VNum cell: master .mu-vnum-dot rect + clickable VNum ── */
.td-table td.td-nowrap[b-c9xewzsgyc] {
white-space: nowrap;
}
.td-vnum[b-c9xewzsgyc] {
cursor: pointer;
font-weight: 600;
}
.td-vnum:hover[b-c9xewzsgyc] {
text-decoration: underline;
}
/* Sortable header icon on right-aligned (numeric) columns stays beside label */
.td-table thead th.mu-th-sort.text-end[b-c9xewzsgyc] {
text-align: right;
}
/* ── Drawer dropdowns (TransporterDropdown + Link status): native arrow
replaced with a chevron, same as master .mu-pagesize look.
::deep — TransporterDropdown's |