/* ============================================== */
/* ProArts Dental Lab - Landscape Slip (v14)      */
/* Developed by: Martin Oliva Barajas             */
/* TruTECH Dental - Copyright (c) 2025            */
/* ============================================== */
/*
 * The printed slip: letter LANDSCAPE folded down the middle. The visible face
 * (5.5 x 8.5in) carries everything the bench needs - header, patient, work
 * table, tooth chart, instructions; the back half carries dates, stages,
 * terms and the signature block. Ported from the approved v14 mockup
 * (docs/labslip-tool/redesign/labslip-landscape-v14.html); design decisions
 * are documented there and in docs/labslip-tool/redesign/product-mapping.md.
 *
 * Every rule is scoped under .v14s (the sheet root) so nothing leaks into the
 * form UI. Print rules at the bottom flip the page to landscape.
 */

.v14s{
  --t-micro:5.6pt; --t-fine:6.8pt; --t-body:8pt; --t-strong:9.5pt;
  --t-val:11pt;    --t-lead:12.5pt; --t-name:17pt;
  --r-hair:1px solid #cfcfcf; --r-field:1.2px solid #222; --r-major:2.5px solid #1b5e7f;
  --s1:3px; --s2:5px; --s3:7px;
  --navy:#1b5e7f; --c-due:#b3291c; --c-keep:#12703f; --c-miss:#96590a;
  width:10.2in;height:7.6in;padding:.14in;background:#fff;color:#000;display:flex;overflow:hidden;
  font-family:Arial,Helvetica,sans-serif;margin:0 auto;box-sizing:border-box;}
.v14s *,.v14s *:before,.v14s *:after{box-sizing:border-box;}
.v14s .col{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;}
.v14s .gutter{border-left:1px dashed #aaa;margin:0 .12in;position:relative;flex:none;}
.v14s .gutter span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(90deg);
  background:#fff;padding:0 5px;font-size:var(--t-micro);letter-spacing:1px;text-transform:uppercase;color:#999;}

.v14s .lbl{display:block;font-size:var(--t-micro);letter-spacing:.9px;text-transform:uppercase;color:#5a5a5a;line-height:1.3;}
.v14s .fine{font-size:var(--t-fine);color:#333;line-height:1.3;}
.v14s .body{font-size:var(--t-body);line-height:1.36;}
.v14s .seeback{font-weight:bold;color:var(--navy);}
.v14s .val{font-family:Verdana,Geneva,sans-serif;font-size:var(--t-val);font-weight:bold;line-height:1.05;}
.v14s .val.lead{font-size:var(--t-lead);} .v14s .due{color:var(--c-due);}
.v14s .x{color:var(--c-due);} .v14s .k{color:var(--c-keep);} .v14s .m{color:var(--c-miss);} .v14s .w{color:var(--navy);}
.v14s .fbox{border:var(--r-field);}

.v14s .hdr{display:flex;gap:var(--s3);border-bottom:var(--r-major);padding-bottom:var(--s2);align-items:stretch;
  position:relative;justify-content:space-between;}
.v14s .boxrow{display:flex;gap:var(--s2);}
.v14s .stick{width:.66in;display:flex;flex-direction:column;}
.v14s .stick-h{font-size:var(--t-micro);text-align:center;background:#111;color:#fff;padding:1px 0;font-weight:bold;letter-spacing:.8px;}
.v14s .stick-b{flex:1;min-height:.54in;display:flex;align-items:center;justify-content:center;}
.v14s .stick-v{font-family:Verdana,Geneva,sans-serif;font-size:10.5pt;font-weight:bold;letter-spacing:-.3px;}
.v14s .rxtag{position:absolute;left:50%;bottom:1px;transform:translateX(-50%);font-size:10.5pt;
  font-weight:bold;letter-spacing:2px;text-transform:uppercase;color:#1b5e7f;white-space:nowrap;}
.v14s .mark{width:2.05in;text-align:right;}
.v14s .mark-logo{height:.36in;width:auto;margin:0 0 2px auto;display:block;}
.v14s .mark-s{font-size:var(--t-fine);color:#555;line-height:1.3;}

.v14s .ident{margin-top:var(--s2);}
.v14s .pname{font-size:var(--t-name);font-weight:bold;line-height:1.02;letter-spacing:-.4px;}
.v14s .pline{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap;}
.v14s .pmeta{font-size:var(--t-body);color:#333;}
.v14s .officeline{margin-top:var(--s2);padding-top:2px;border-top:var(--r-hair);}
.v14s .oname{font-size:var(--t-strong);}
.v14s .ophone{font-family:Verdana,Geneva,sans-serif;font-size:var(--t-strong);white-space:nowrap;margin-left:auto;}

.v14s .work{border:var(--r-field);margin-top:var(--s2);}
/* The stage value is centred on the bar (owner 2026-08-11); the STAGE label
   and RUSH chip pin to the edges so they never push it off-centre. */
.v14s .work-stage{background:var(--navy);color:#fff;padding:2px var(--s2);
  display:flex;justify-content:center;align-items:baseline;position:relative;}
.v14s .work-stage .lbl{color:#cfe6f2;position:absolute;left:var(--s2);top:50%;transform:translateY(-50%);}
.v14s .work-stage b{font-size:12pt;letter-spacing:.6px;}
.v14s .work-rush{position:absolute;right:var(--s2);top:50%;transform:translateY(-50%);
  background:var(--c-due);color:#fff;font-weight:bold;
  font-size:9pt;letter-spacing:1.5px;padding:0 6px;border-radius:2px;}
.v14s table.wt{width:100%;border-collapse:collapse;table-layout:fixed;}
.v14s table.wt th{font-size:var(--t-micro);letter-spacing:.9px;text-transform:uppercase;color:#5a5a5a;
  font-weight:bold;text-align:left;padding:1px var(--s2);border-bottom:1px solid #9a9a9a;background:#f4f6f7;}
.v14s table.wt td{padding:2px var(--s2);vertical-align:top;font-size:var(--t-body);}
.v14s tr.wt-arch td{background:#dfe9f0;color:#123c52;font-weight:bold;font-size:9pt;
  letter-spacing:1.5px;padding:1px var(--s2);border-top:1px solid #9a9a9a;}
.v14s tr.wt-main td{border-top:1px solid #c9c9c9;}
.v14s tr.wt-arch + tr.wt-main td{border-top:none;}
.v14s tr.wt-main td b{font-size:var(--t-strong);}
.v14s tr.wt-main td.c-th b{font-family:Verdana,Geneva,sans-serif;font-size:var(--t-strong);color:#123c52;}
.v14s .dimdash{color:#999;}
.v14s .pdet{font-size:var(--t-body);font-weight:normal;color:#333;}
.v14s tr.wt-teeth td{padding-top:0;padding-bottom:3px;}
.v14s .c-th{width:.62in;} .v14s .c-sh{width:.52in;text-align:center;}
.v14s th.c-sh{text-align:center;}
.v14s tr.wt-main td.c-sh b{font-family:Verdana,Geneva,sans-serif;font-size:var(--t-val);}
.v14s .tsum{font-size:var(--t-body);line-height:1.3;}
.v14s .tsum b{font-family:Verdana,Geneva,sans-serif;font-size:var(--t-strong);}

.v14s .row3{display:flex;gap:var(--s2);margin-top:var(--s2);}
.v14s .cell{flex:1;padding:2px var(--s2);text-align:center;}
.v14s .dline{display:flex;align-items:baseline;gap:4px;justify-content:center;}
.v14s .tm{font-size:var(--t-strong);color:#222;font-weight:bold;}

.v14s .sec{margin-top:var(--s3);}
.v14s .sec-h{font-size:var(--t-micro);letter-spacing:1px;text-transform:uppercase;color:#5a5a5a;font-weight:bold;
  border-bottom:var(--r-hair);padding-bottom:1px;margin-bottom:2px;}
.v14s .secgrow,.v14s .secgrow2{flex:1;display:flex;flex-direction:column;}

.v14s .addons{border:1.6px solid #111;background:#fff8e6;padding:2px var(--s2) 3px;}
.v14s .ad-h{font-size:var(--t-micro);letter-spacing:1px;text-transform:uppercase;font-weight:bold;
  color:#7a5200;border-bottom:1px solid #d9c48a;padding-bottom:1px;margin-bottom:2px;}
.v14s table.ad-t{width:100%;border-collapse:collapse;}
.v14s table.ad-t td{vertical-align:top;padding:1px 0;}
.v14s .ad-s{width:.72in;font-size:var(--t-fine);font-weight:bold;text-transform:uppercase;letter-spacing:.4px;color:#333;}
.v14s .ad-i span{display:inline-block;font-size:var(--t-body);font-weight:bold;margin-right:var(--s2);}
.v14s .ad-i span:not(:last-child):after{content:" \00b7";font-weight:normal;color:#8a6d2f;}

.v14s .arches{display:flex;gap:var(--s2);margin-top:1px;}
.v14s .arches>div{flex:1;min-width:0;text-align:center;}
/* 91%: buys the height a six-row work table needs. The charts are data-URI
   images (html2canvas renders those faithfully; inline SVG drifted and
   clipped in the PDF); the ring overhang lives inside the expanded viewBox. */
.v14s .arches svg,.v14s .arches .arch-img{width:91%;height:auto;display:block;margin:0 auto;}
/* Overflow mode: a long work table needs the chart to give height back */
.v14s.ovf .arches svg,.v14s.ovf .arches .arch-img{width:68%;}
.v14s .arches .lbl{color:var(--navy);font-weight:bold;}
.v14s .legend{display:flex;flex-wrap:wrap;justify-content:center;gap:0 var(--s3);font-size:var(--t-micro);}
.v14s .legend span{display:flex;align-items:center;gap:2px;}
.v14s .sw{width:8px;height:8px;display:inline-block;flex:none;}
.v14s .sw.wk{background:rgba(27,94,127,.13);border:2px solid #1b5e7f;}
.v14s .lg{font-family:Georgia,"Times New Roman",serif;font-weight:bold;
    font-size:calc(var(--t-micro) + 1.5pt);line-height:1;}

.v14s .mats{display:flex;flex-wrap:wrap;gap:0 var(--s3);font-size:var(--t-body);}
.v14s .mats span:before{content:"\2713\00a0";font-weight:bold;}
.v14s .wr{border-bottom:var(--r-hair);flex:1;min-height:.19in;}
.v14s table.gridt{width:100%;border-collapse:collapse;font-size:var(--t-fine);}
.v14s table.gridt td{border:1px solid #b5b5b5;padding:1px 4px;height:.185in;}
.v14s table.gridt tr:first-child td{background:#f1f4f5;font-size:var(--t-micro);letter-spacing:.8px;text-transform:uppercase;color:#555;font-weight:bold;}
/* Sent / Due / Init. headers and their dates centre in their cells; the
   Procedure column stays left-aligned (owner 2026-08-11). */
.v14s table.st td{text-align:center;}
.v14s table.st td:first-child{width:1.15in;text-align:left;} .v14s .stg{color:#333;font-weight:bold;}
.v14s table.st tr.now td{background:#eaf3f8;} .v14s table.st tr.now .stg:before{content:"\25B8\00a0";color:var(--navy);}

.v14s dl.terms{margin:0;font-size:var(--t-micro);line-height:1.35;}
.v14s dl.terms dt{font-weight:bold;text-transform:uppercase;letter-spacing:.6px;color:#333;margin-top:2px;}
.v14s dl.terms dd{margin:0;color:#444;}

.v14s .signblock{margin-top:var(--s3);padding-top:var(--s2);border-top:var(--r-major);}
.v14s .sb-h{font-size:var(--t-fine);font-style:italic;color:#333;line-height:1.3;margin-bottom:var(--s2);}
.v14s .sb-row{display:flex;gap:var(--s3);align-items:flex-end;}
.v14s .sb-f{flex:1;} .v14s .sb-lic{flex:.6;} .v14s .sb-sig{flex:1.7;} .v14s .sb-dt{flex:.9;}
.v14s .sb-val{font-size:var(--t-body);font-weight:bold;border-bottom:1.2px solid #111;height:.32in;
  display:flex;align-items:flex-end;padding-bottom:1px;}
.v14s .sb-rule{border-bottom:1.2px solid #111;height:.32in;}
.v14s .sb-iss{text-align:right;margin-top:2px;color:#777;}

/* Preview: the sheet is 10.2in wide - let the modal scroll rather than crush it */
.compact-slip{overflow:auto;}

/* ═══ print ═══ */
@media print{
  /* Overrides the portrait size in proarts-styles.css (this file loads after
     it). No margin declaration here: the base sheet's 0.4in margin stands -
     zero margins put content in the printer's non-printable border. */
  @page{size:letter landscape;}
  /* fluid: fills what the margins leave (10.2 x 7.7in printable), so it
     cannot clip; 7.65in fills the height instead of stopping short. */
  .v14s{width:100%;height:7.65in;box-shadow:none;margin:0;padding:.1in;zoom:1!important;
        page-break-inside:avoid;page-break-after:avoid;break-inside:avoid;}
  .v14s *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;}
}