/* ============================================================================
   MASAR v5 — css5/9-pages-d.css
   Page-specific layout for the PARTNERS group only:
     .p-contractors   Contractors, and the contractor record
     .p-contracts     Contracts & packages
     .p-facilities    Facilities, and the site record
     .p-weigh         Weighbridge

   Layout and small data ornaments only. Every colour is a token from
   1-tokens.css or a data colour passed inline by the page. Logical
   properties throughout, so RTL needs no second stylesheet.
   ========================================================================== */

/* ==========================================================================
   SHARED ORNAMENTS (this group)
   A flush card still needs a padded strip for a banner, a legend or a note.
   ========================================================================== */

.p-pad{padding:var(--s-3) var(--card-pad-lg)}
.p-pad-b{margin-bottom:var(--s-4)}
.p-chiprow{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-3)}

/* ==========================================================================
   CONTRACTORS
   ========================================================================== */

/* rank, and the movement against last month — always a word, never an arrow
   on its own */
.p-rank{display:flex;flex-direction:column;align-items:flex-end;gap:1px}
.p-rank > b{font:var(--ty-h2);color:var(--text);font-variant-numeric:tabular-nums}
.p-move{display:inline-flex;align-items:center;gap:3px;font:var(--ty-caption);color:var(--text-3)}
.p-move svg{width:12px;height:12px}
.p-move--up{color:var(--ok)}
.p-move--dn{color:var(--critical)}

/* score plus its letter, so the cell reads without colour */
.p-score{display:inline-flex;align-items:center;gap:6px;justify-content:flex-end}
.p-score > b{font-variant-numeric:tabular-nums}
.p-frac{display:inline-flex;align-items:baseline;gap:2px;margin-inline-end:6px;
  font-variant-numeric:tabular-nums;color:var(--text-2)}
.p-frac > b{color:var(--text)}

/* where a component's number comes from */
.p-basis{display:flex;flex-direction:column;gap:2px;min-width:0}
.p-basis > span{font:var(--ty-body-sm);color:var(--text-2)}
.p-basis > i{font:var(--ty-caption);color:var(--text-3);font-style:normal}

/* the cleanliness choropleth owns a real band of the card, never a thumbnail */
.p-conmap{position:relative;min-height:clamp(300px,36vh,460px);height:clamp(300px,36vh,460px)}

/* package → unit → work order */
.p-drill{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4)}
.p-drill__c{min-width:0;display:flex;flex-direction:column;gap:var(--s-2)}
.p-drill__c > h4{font:var(--ty-label);color:var(--text-2);text-transform:uppercase;
  letter-spacing:.06em}
.p-drill__c .m-rows{border:1px solid var(--line);border-radius:var(--r-md);overflow:auto;max-height:320px}

/* ==========================================================================
   CONTRACTS — the coverage matrix
   ========================================================================== */

.p-cov{display:inline-flex;align-items:center;gap:6px;min-width:0;
  padding:2px 0;font:var(--ty-body-sm);color:var(--text);cursor:pointer}
.p-cov + .p-cov{margin-inline-start:var(--s-2)}
.p-cov > i{width:8px;height:8px;border-radius:var(--r-full);flex:0 0 auto}
.p-cov > b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p-cov > span{font:var(--ty-caption);color:var(--text-3)}
.p-cov:hover > b{text-decoration:underline}

/* ==========================================================================
   FACILITIES — provenance is a column, so it needs to read like one
   ========================================================================== */

.p-prov{display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;
  border-radius:var(--r-full);font:var(--ty-label-sm);
  background:var(--ok-soft);color:var(--ok);border:1px solid var(--ok-line)}
.p-prov svg{width:12px;height:12px}
.p-prov__a{display:inline-flex;align-items:center;gap:4px;text-decoration:none;color:inherit}
.p-prov__a svg{color:var(--text-3)}
.p-prov__a:hover .p-prov{background:var(--ok-line)}

.p-facmap{position:relative;min-height:clamp(360px,46vh,600px);height:clamp(360px,46vh,600px)}

/* ==========================================================================
   WEIGHBRIDGE
   ========================================================================== */

/* origin → destination, in one cell */
.p-route{display:inline-flex;align-items:center;gap:6px;min-width:0}
.p-route svg{flex:0 0 auto;color:var(--text-3)}
.p-route > b{font-weight:600}
.p-route > span{color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* gross − tare = net, laid out as the sum it is */
.p-docket{display:flex;align-items:stretch;gap:var(--s-3);flex-wrap:wrap;
  padding:var(--s-4);margin-bottom:var(--s-4);
  background:var(--surface-sunken);border:1px solid var(--line);border-radius:var(--r-md)}
.p-docket > i{align-self:center;font-style:normal;font:var(--ty-h2);color:var(--text-3)}
.p-docket__n{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 120px}
.p-docket__n > span{font:var(--ty-label-sm);color:var(--text-2)}
.p-docket__n > b{font:var(--ty-metric-sm);color:var(--text);font-variant-numeric:tabular-nums}
.p-docket__n--net > b{color:var(--accent-press)}

/* one card per exception kind, each carrying its rule in words */
.p-exc .p-exc__rule{margin-bottom:var(--s-3)}
.p-exc .p-exc__rule h4{font:var(--ty-label);color:var(--text-2);text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:var(--s-1)}
.p-exc .p-exc__rule h4 + p{margin-bottom:var(--s-3)}
.p-exc .p-exc__rule p{font:var(--ty-body-sm);color:var(--text);line-height:1.6}

/* ==========================================================================
   NARROW SCREENS
   ========================================================================== */

@media (max-width:1100px){
  .p-drill{grid-template-columns:minmax(0,1fr)}
  .p-drill__c .m-rows{max-height:220px}
}
@media (max-width:760px){
  .p-conmap{min-height:280px;height:280px}
  .p-facmap{min-height:300px;height:300px}
  .p-docket{gap:var(--s-2)}
  .p-docket > i{display:none}
}

/* ================================================================== */
/* THE FACILITY RECORD (v6) — the vehicle record's grammar for a site */
/* ================================================================== */

.p-fac6__top{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:var(--s-4);align-items:stretch}
.p-fac6__side{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
.p-fac6__side > .m-card{flex:0 0 auto}
.p-fac6__side > .m-card:first-child{flex:1 1 auto}
.p-fac6__mapcard{display:flex;flex-direction:column;min-height:480px}
.p-fac6__mapcard > .m-card__body{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.p-fac6__map{position:relative;inset:auto;flex:1 1 auto;min-height:300px;border-radius:0}
.p-fac6__strip{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:9px 14px;border-top:1px solid var(--line-subtle);
  font:var(--ty-caption);color:var(--text-2);
}
.p-fac6__strip .m-coord{font:500 11px/1 var(--font-mono);color:var(--text-2)}

/* the gate card: a headline row, then live rows that go somewhere */
.p-fac6__gatehead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.p-fac6__gatehead h4{font:var(--ty-label);color:var(--text);margin:0;margin-inline-end:auto}
.p-fac6__hours{font:var(--ty-caption);color:var(--text-3)}

.p-fac6__row{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:8px 10px;margin:0 0 6px;border:1px solid var(--line-subtle);
  border-radius:var(--r-md);background:var(--surface);cursor:pointer;
  text-align:start;transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease);
}
.p-fac6__row:not(:disabled):hover{background:var(--surface-sunken);border-color:var(--line)}
.p-fac6__row:disabled{cursor:default}
.p-fac6__row:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.p-fac6__row__ic{
  flex:0 0 30px;height:30px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--r-sm);background:var(--surface-sunken);color:var(--text-2);
}
.p-fac6__row__x{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1 1 auto}
.p-fac6__row__x > b{font:650 14px/1.2 var(--font);color:var(--text);font-variant-numeric:tabular-nums}
.p-fac6__row__x > span{font:var(--ty-caption);color:var(--text-3)}
.p-fac6__row__go{flex:0 0 auto;color:var(--text-3);display:inline-flex}
[dir="rtl"] .p-fac6__row__go svg{transform:scaleX(-1)}
.p-fac6__row--warn .p-fac6__row__ic{background:var(--warn-soft);color:var(--warn-fill)}
.p-fac6__row--crit .p-fac6__row__ic{background:var(--crit-soft);color:var(--crit-fill)}
.p-fac6__row--crit{border-color:var(--crit-fill)}

.p-fac6__meter{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.p-fac6__meter > span{font:var(--ty-caption);color:var(--text-3)}
.p-fac6__note{font:var(--ty-caption);color:var(--text-3);margin:6px 0 8px}

/* an inbound unit on the record's map */
.p-fac6__dot{
  display:block;width:12px;height:12px;border-radius:50%;
  background:var(--c,var(--accent));border:2px solid #fff;
  box-shadow:0 1px 4px rgba(6,31,56,.45);cursor:pointer;
}

.p-fac6__flat{margin-top:var(--s-4)}

@media (max-width:1100px){
  .p-fac6__top{grid-template-columns:minmax(0,1fr)}
  .p-fac6__mapcard{min-height:380px}
}