/* Ultra Dewan — list + table styles as plain CSS classes (React-free equivalents of components/lists/List and components/tables/Table). */

/* Lists — <ul class="ud-list ud-list--dot"> */
.ud-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;font:var(--t-body);color:var(--text-body)}
.ud-list>li{display:flex;gap:14px;align-items:flex-start}
.ud-list>li::before{flex:none}
.ud-list--dash>li::before{content:"—";color:var(--steel)}
.ud-list--arrow>li::before{content:"→";color:var(--steel)}
.ud-list--dot>li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--list-marker,var(--dewan-red));margin-top:0.55em}
.ud-list--circle>li::before{content:"";width:5px;height:5px;border-radius:50%;border:1px solid var(--graphite);box-sizing:border-box;margin-top:0.55em}
.ud-list--cut>li::before{content:"";width:12px;height:2px;background:var(--list-marker,var(--dewan-red));margin-top:0.6em}
.ud-list--numbered{counter-reset:udli}
.ud-list--numbered>li::before{counter-increment:udli;content:"0" counter(udli);font:var(--t-label-sm);letter-spacing:var(--t-label-sm-tracking);color:var(--text-caption);font-variant-numeric:tabular-nums;width:24px;margin-top:0.25em}
.ud-list--ruled{gap:0}
.ud-list--ruled>li{justify-content:space-between;align-items:baseline;gap:20px;padding:10px 0;border-bottom:1px solid var(--border-hairline)}
.ud-list--ruled>li:last-child{border-bottom:none}
.ud-list--ruled>li::before{content:none}
.ud-list .meta{font:var(--t-label-sm);letter-spacing:var(--t-label-sm-tracking);text-transform:uppercase;color:var(--text-caption)}

/* Tables — <table class="ud-table ud-table--banded"> */
.ud-table{border-collapse:collapse;width:100%}
.ud-table th{font:var(--t-label-sm);letter-spacing:var(--t-label-sm-tracking);text-transform:uppercase;color:var(--steel);font-weight:500;text-align:left;padding:10px 18px 10px 0;border-bottom:1px solid var(--table-rule,var(--ink))}
.ud-table td{font:var(--t-table);padding:11px 18px 11px 0;border-bottom:1px solid var(--border-hairline);font-variant-numeric:tabular-nums;vertical-align:top;color:var(--text-body)}
.ud-table .num{text-align:right}
.ud-table tr.total td{border-bottom:none;border-top:1px solid var(--table-rule,var(--ink));font-weight:500;padding-top:14px;background:none}
.ud-table--dense th{padding:6px 14px 6px 0}
.ud-table--dense td{font:var(--t-body-sm);padding:7px 14px 7px 0}
.ud-table--grid th:not(:first-child),.ud-table--grid td:not(:first-child){border-left:1px solid var(--border-hairline);padding-left:18px}
.ud-table--banded th{background:var(--table-band,var(--ink));color:var(--paper);border-bottom:none;padding-left:12px}
.ud-table--banded td{padding-left:12px}
.ud-table--tinted th{padding-left:12px}
.ud-table--tinted td{border-bottom:none;padding-left:12px}
.ud-table--tinted tbody tr:nth-child(odd) td{background:color-mix(in oklab,var(--paper),var(--sand) 45%)}
/* Minimal financial formats — fee breakdowns, commercial proposals */
.ud-table--ledger th{border-bottom:none;padding-bottom:14px}
.ud-table--ledger td{padding:14px 18px 14px 0}
.ud-table--ledger tr.total td{border-top:1px solid var(--ink);border-bottom:3px double var(--ink);padding:14px 18px 14px 0}
.ud-table--open th{border-bottom:none}
.ud-table--open td{border-bottom:none;padding:8px 18px 8px 0}
.ud-table--open tr.total td{border-top:1px solid var(--table-rule,var(--ink));padding-top:14px}
/* Fee summary block — label/amount rows closing on a large light total */
.ud-fee{display:grid;margin:0}
.ud-fee>div{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:10px 0;border-bottom:1px solid var(--border-hairline)}
.ud-fee .lbl{font:var(--t-body-sm);color:var(--text-body)}
.ud-fee .amt{font:var(--t-table);font-variant-numeric:tabular-nums;color:var(--text-body)}
.ud-fee>div.total{border-bottom:none;padding-top:18px;align-items:baseline}
.ud-fee>div.total .lbl{font:var(--t-label-sm);letter-spacing:var(--t-label-sm-tracking);text-transform:uppercase;color:var(--text-caption)}
.ud-fee>div.total .amt{font:200 40px/1 var(--font-sans);letter-spacing:-0.02em;color:var(--ink)}
.ud-fee>div.total .amt small{font:var(--t-label-sm);letter-spacing:var(--t-label-sm-tracking);color:var(--text-caption);margin-left:8px}
/* inverse — dark ground, paper text */
.ud-table--inverse{background:var(--table-band,var(--ink))}
.ud-table--inverse th{color:color-mix(in oklab,var(--paper),transparent 40%);border-bottom:1px solid var(--paper);padding-left:12px}
.ud-table--inverse td{color:var(--paper);border-bottom:1px solid color-mix(in oklab,var(--paper),transparent 75%);padding-left:12px}
.ud-table--inverse tr:last-child td{border-bottom:none}
/* spec — label column + vertical divider, project fact sheets */
.ud-table--spec th{border-bottom:none;padding:0}
.ud-table--spec td:first-child{font:var(--t-label-sm);letter-spacing:var(--t-label-sm-tracking);text-transform:uppercase;color:var(--text-caption);width:110px}
.ud-table--spec td:not(:first-child){border-left:1px solid var(--border-hairline);padding-left:18px}
/* ranked — large light numerals, league tables */
.ud-table--ranked td:first-child{font:200 26px/1 var(--font-sans);letter-spacing:-0.02em;color:var(--steel);vertical-align:middle;width:60px}
/* keyline — Dewan Red rules + red lead column */
.ud-table--keyline th{border-bottom:1px solid var(--dewan-red)}
.ud-table--keyline td:first-child{color:var(--dewan-red);font-weight:500}
.ud-table--keyline tr.total td{border-top:1px solid var(--dewan-red);color:var(--dewan-red)}
/* marker — red cut opening each row */
.ud-table--marker td:first-child::before{content:"";display:inline-block;width:12px;height:2px;background:var(--table-rule,var(--dewan-red));vertical-align:0.28em;margin-right:12px}
/* shaded — light grey filled header, ink text */
.ud-table--shaded th{background:color-mix(in oklab,var(--concrete),var(--white) 40%);color:var(--graphite);border-bottom:none;padding-left:12px}
.ud-table--shaded td{padding-left:12px}
/* panel — whole table on a light grey ground */
.ud-table--panel{background:color-mix(in oklab,var(--concrete),var(--white) 55%)}
.ud-table--panel th,.ud-table--panel td{padding-left:12px}
.ud-table--panel th:first-child,.ud-table--panel td:first-child{padding-left:18px}
.ud-table--panel th:last-child,.ud-table--panel td:last-child{padding-right:18px}
/* highlight — emphasized rows: <tr class="hl"> */
.ud-table tr.hl td{background:color-mix(in oklab,var(--concrete),var(--white) 40%);padding-left:12px}
