/* order.printnac.com: one stylesheet for every order page. Same look as the printnac.com
   home page (C:\tdcj_badges\site\index.html): Montserrat headings and buttons, Inter
   body, royal blue + yellow, 3D drop-shadow buttons. */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap");
:root{--blue:#2C3E94;--navy:#1B2668;--yellow:#FBEF11;--yshadow:#A99E08;--ink:#1A1A1A;--gray:#5b6477;--lgray:#E5E2D8;--light:#FAF9F5;--white:#fff;--red:#b91c1c;
  --display:Montserrat,system-ui,sans-serif;}
*{box-sizing:border-box;}
body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--light);color:var(--ink);line-height:1.5;font-size:18px;}
::selection{background:var(--yellow);color:var(--ink);}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;}

header{position:sticky;top:0;z-index:30;background:var(--blue);color:#FAF9F5;padding:12px 16px;border-bottom:4px solid var(--yellow);}
header .in{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:14px;}
header img{width:52px;height:52px;border-radius:50%;box-shadow:0 0 0 3px var(--yellow);display:block;object-fit:cover;background:#fff;}
header h1{font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:.5px;margin:0;flex:1;line-height:1.05;text-transform:uppercase;}
header small{display:block;font-family:Inter,sans-serif;font-size:14px;color:var(--yellow);letter-spacing:.9px;font-weight:600;margin-top:5px;text-transform:uppercase;}
header a{color:inherit;}
.cart-link{font-family:var(--display);font-size:16px;font-weight:600;letter-spacing:.4px;color:var(--ink)!important;background:var(--yellow);padding:12px 18px;border-radius:6px;white-space:nowrap;text-decoration:none;box-shadow:0 5px 0 var(--yshadow);transition:transform .12s,box-shadow .12s;}
.cart-link:hover{transform:translateY(2px);box-shadow:0 3px 0 var(--yshadow);}

/* "← Available Today": every service page leads back to the hub, top and bottom. */
.back{display:inline-block;font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:.4px;text-transform:uppercase;color:var(--blue);text-decoration:none;border:2px solid var(--blue);border-radius:8px;padding:9px 16px;margin-bottom:16px;background:#fff;}
.back:hover{background:rgba(44,62,148,.08);color:var(--blue);}
.pending-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;background:var(--yellow);color:var(--ink);border-radius:10px;padding:14px 18px;margin-bottom:16px;text-decoration:none;box-shadow:0 5px 0 var(--yshadow);font-size:18px;}
.pending-bar b{font-family:var(--display);font-weight:600;letter-spacing:.4px;text-transform:uppercase;white-space:nowrap;}
.pending-bar:hover{color:var(--ink);transform:translateY(2px);box-shadow:0 3px 0 var(--yshadow);}
/* Available Today service cards: same card, heading and text sizes as a Copy/Print section
   card (David: /copies is the style guide). printnac.com's cards mirror these values. */
.today{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.svc{background:var(--white);border:1px solid var(--lgray);border-top:5px solid var(--blue);border-radius:10px;padding:22px;display:flex;flex-direction:column;gap:8px;color:var(--ink);text-decoration:none;transition:transform .2s,box-shadow .2s;}
.svc:nth-child(even){border-top-color:var(--yellow);}
a.svc:hover{color:var(--ink);transform:translateY(-4px);box-shadow:0 16px 32px rgba(44,62,148,.16);}
.svc .ico{font-size:32px;line-height:1;}
.svc h3{font-family:var(--display);font-weight:600;font-size:23px;line-height:1.2;margin:4px 0 0;}
.svc p{margin:0;font-size:18px;color:var(--gray);}
.svc .when{margin-top:auto;padding-top:8px;font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:.4px;text-transform:uppercase;color:var(--blue);}
.svc.soon{opacity:.6;}
.svc.soon .when{color:var(--gray);}
@media (max-width:760px){.today{grid-template-columns:repeat(2,1fr);gap:12px;}.svc{padding:16px;}}
main{max-width:900px;margin:0 auto;padding:24px 16px 48px;}
.card{background:var(--white);border:1px solid var(--lgray);border-top:5px solid var(--blue);border-radius:10px;padding:22px;margin-bottom:18px;}
.card h2{font-family:var(--display);font-weight:600;font-size:23px;line-height:1.2;margin:0 0 8px;color:var(--ink);}
.step{display:inline-flex;align-items:center;justify-content:center;background:var(--blue);color:var(--yellow);font-family:var(--display);font-weight:700;border-radius:50%;width:34px;height:34px;margin-right:10px;font-size:17px;vertical-align:middle;}
.sub{color:var(--gray);margin:0 0 12px;font-size:18px;}
.ready{background:radial-gradient(600px 300px at 80% 0%,#3B51C0 0%,var(--blue) 55%,var(--navy) 100%);color:#FAF9F5;border-radius:10px;padding:18px 20px;margin-bottom:18px;}
.ready b{font-family:var(--display);font-weight:600;font-size:22px;letter-spacing:.3px;display:block;color:var(--yellow);}
.ready .note{font-size:18px;opacity:.95;margin-top:6px;}

/* Buttons: the home page's chunky Montserrat buttons with a solid drop shadow that sinks on hover. */
.btn{display:inline-block;border:0;border-radius:8px;padding:14px 22px;font-family:var(--display);font-size:18px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;cursor:pointer;text-decoration:none;text-align:center;transition:transform .12s,box-shadow .12s;}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important;}
.btn-yellow{background:var(--yellow);color:var(--ink);box-shadow:0 6px 0 var(--yshadow);}
.btn-yellow:hover:not(:disabled){transform:translateY(3px);box-shadow:0 3px 0 var(--yshadow);color:var(--ink);}
.btn-primary{background:var(--blue);color:#FAF9F5;box-shadow:0 6px 0 var(--navy);}
.btn-primary:hover:not(:disabled){transform:translateY(3px);box-shadow:0 3px 0 var(--navy);color:#FAF9F5;}
.btn-secondary{background:transparent;color:var(--blue);border:2px solid var(--blue);padding:12px 20px;}
.btn-secondary:hover{background:rgba(44,62,148,.08);color:var(--blue);}
.btn-lg{font-size:20px;padding:17px 30px;}
.btn-bar{display:flex;gap:14px;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-top:18px;}

.alert{border-radius:8px;padding:12px 14px;margin:12px 0;font-size:17px;}
.alert-error{background:#fef2f2;color:var(--red);border:1px solid #fecaca;}
.alert-info{background:#eef1fb;color:var(--blue);border:1px solid #c7cfee;border-left:5px solid var(--blue);}
.alert-ok{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0;}
.alert a{color:inherit;}
.drop{display:block;border:2px dashed var(--blue);border-radius:10px;padding:26px 14px;text-align:center;cursor:pointer;background:#f5f7fd;color:var(--blue);font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:.4px;text-transform:uppercase;}
.drop:hover{background:#eef1fb;}
.drop input{display:block;margin:12px auto 0;max-width:100%;font-family:Inter,sans-serif;font-size:17px;font-weight:400;text-transform:none;letter-spacing:0;}
label.f{display:block;font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:.4px;text-transform:uppercase;margin:14px 0 6px;color:var(--ink);}
label.f span{font-family:Inter,sans-serif;font-weight:400;color:var(--gray);text-transform:none;letter-spacing:0;}
input.t,select.t{width:100%;padding:12px 13px;font-size:18px;border:2px solid var(--lgray);border-radius:8px;font-family:inherit;background:#fff;}
input.t:focus,select.t:focus{border-color:var(--blue);outline:none;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
@media (max-width:560px){.grid2{grid-template-columns:1fr;}header h1{font-size:18px;}header img{width:44px;height:44px;}.cart-link{padding:10px 12px;}}

/* Option pickers: chunky toggles, selected = solid blue with the yellow shadow. */
.option-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:6px;}
.option-btn{flex:1;min-width:120px;border:2px solid var(--blue);border-radius:8px;padding:12px 10px;text-align:center;font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:.4px;cursor:pointer;background:#fff;color:var(--blue);box-shadow:0 4px 0 #c7cfee;transition:transform .12s,box-shadow .12s;}
.option-btn:hover{transform:translateY(2px);box-shadow:0 2px 0 #c7cfee;}
.option-btn.selected{background:var(--blue);color:#FAF9F5;box-shadow:0 4px 0 var(--yellow);}

.check{display:flex;gap:12px;align-items:flex-start;border:2px solid var(--lgray);border-radius:8px;padding:14px;margin-top:12px;cursor:pointer;background:#fff;}
.check input{width:22px;height:22px;flex:none;margin:0;accent-color:var(--blue);}
.prio{background:#fffbd6;border-color:var(--yellow);font-weight:700;}
.ack{background:#fffbd6;border:2px solid var(--yellow);border-left:6px solid var(--yellow);border-radius:8px;padding:16px;margin-top:16px;font-size:18px;}
.ack p{margin:0 0 8px;}
.ack .when{font-family:var(--display);font-size:22px;font-weight:600;color:var(--blue);}
.ack label{display:flex;gap:10px;align-items:center;font-weight:700;cursor:pointer;margin-top:6px;}
.ack input{width:22px;height:22px;flex:none;margin:0;accent-color:var(--blue);}
.fin{border:1px solid var(--lgray);border-radius:8px;padding:12px 14px;margin-top:8px;background:#fff;}
.fin input[type=checkbox]{accent-color:var(--blue);width:20px;height:20px;}
.fin .opts{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;}
.fin .opts select,.fin .opts input{flex:1;min-width:140px;}
.line{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--lgray);}
.line .d{font-size:17px;color:var(--gray);}
.line .x{background:none;border:0;color:var(--red);cursor:pointer;font-size:16px;padding:4px 0;font-family:inherit;font-weight:600;}
.total{display:flex;justify-content:space-between;font-family:var(--display);font-size:24px;font-weight:700;color:var(--blue);border-top:3px solid var(--blue);margin-top:14px;padding-top:12px;}
.pay-total{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--blue);color:#FAF9F5;border-radius:10px;padding:16px 20px;margin-top:18px;box-shadow:0 6px 0 var(--navy);}
.pay-total .k{display:block;font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:.4px;text-transform:uppercase;color:var(--yellow);}
.pay-total .d{display:block;font-size:16px;opacity:.9;}
.pay-total .amt{font-family:var(--display);font-weight:700;font-size:34px;line-height:1;}
.sum{display:flex;justify-content:space-between;font-size:18px;padding:3px 0;}
.big-ok{text-align:center;}
.big-ok .tick{font-size:58px;color:#047857;line-height:1;}
.big-ok h2{font-size:30px;}
.muted{color:var(--gray);font-size:16px;}
footer{text-align:center;color:#DDE1F2;background:var(--blue);border-top:4px solid var(--yellow);font-size:16px;padding:22px 16px;}
[hidden]{display:none!important;}