/* Order tracking, complaint tickets, receipts, owner admin, legal footer strip */
.ops-sec{padding-top:48px}
.ops{max-width:880px;display:grid;gap:24px}
.ops-load{color:var(--muted);text-align:center;padding:40px 0}
.ops-card{background:var(--white);border:1px solid var(--line);padding:30px 32px;box-shadow:0 30px 60px -50px rgba(60,34,12,.6)}
.ops-card h2{font:500 28px/1.2 var(--serif);color:var(--ink);margin:0 0 6px}
.ops-card h3{font:500 12px var(--caps);letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);margin:26px 0 10px;padding-top:18px;border-top:1px solid var(--hair)}
.ops-card.ok{text-align:center}
.ops-card.ok .share-row{justify-content:center}
.ops-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.ops-head small{font:500 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.ops-head span{color:var(--muted);font-size:14px}
.ops-err{background:#fbeae7;border-left:4px solid #a3271b;padding:10px 14px;color:#7a1d14;margin:0 0 16px}
.ops-help{color:var(--muted)}
.ops-note{background:var(--cream);padding:12px 16px;border-left:3px solid var(--gold)}
.ops-msg{white-space:pre-wrap;background:var(--cream);padding:12px 16px}
.ops-list{list-style:none;padding:0;margin:0}
.ops-list li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--hair)}
.ops-facts{display:flex;flex-wrap:wrap;gap:8px 28px;margin:18px 0 0}
.ops-facts dt{font:500 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.ops-facts dd{margin:2px 0 0;font-weight:500}
.ops-promise{display:grid;gap:4px;background:var(--cream);border:1px solid var(--line);padding:14px 18px;margin:12px 0 20px;font-size:14.5px}
.ops-promise>b{font:500 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--bronze)}
.ops-courier{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;background:var(--cream);padding:14px 18px;margin-top:18px}
.ops-courier code{font-size:15px;background:#fff;padding:2px 6px}
.ops-hist{list-style:none;padding:0;margin:0}
.ops-hist li{padding:10px 0 10px 18px;border-left:2px solid var(--line);position:relative}
.ops-hist li::before{content:"";position:absolute;left:-6px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--gold)}
.ops-hist b{margin-right:10px}
.ops-hist span{color:var(--muted);font-size:13px}
.ops-hist p{margin:4px 0 0}
.ops-form{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.ops-form label{display:grid;gap:6px;font:500 13px var(--sans);color:var(--bronze)}
.ops-form label.full,.ops-form .ops-err,.ops-form button{grid-column:1/-1}
.ops-form input,.ops-form select,.ops-form textarea{font:16px var(--sans);padding:12px 14px;border:1px solid var(--line);background:#fff;color:var(--ink)}
.ops-form button{justify-self:start}
.hp{position:absolute;left:-9999px;width:1px;height:1px}
.share-row{display:flex;flex-wrap:wrap;gap:10px}
.btn-wa{background:#1f9d55;color:#fff;border-color:#1f9d55}
/* status steps */
.steps{list-style:none;display:flex;padding:0;margin:24px 0 6px;counter-reset:s}
.steps li{flex:1;text-align:center;font:500 12px var(--sans);color:var(--muted);position:relative;padding-top:26px}
.steps li span{position:absolute;top:0;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;border:2px solid var(--line);background:#fff;z-index:1}
.steps li::before{content:"";position:absolute;top:7px;left:-50%;width:100%;height:2px;background:var(--line)}
.steps li:first-child::before{display:none}
.steps li.done span,.steps li.cur span{background:var(--gold);border-color:var(--gold)}
.steps li.done::before,.steps li.cur::before{background:var(--gold)}
.steps li.cur{color:var(--ink);font-weight:600}
.steps li.cur span{box-shadow:0 0 0 5px rgba(168,116,42,.2)}
.steps.ended li{padding:0;text-align:left;color:#a3271b}
.steps.ended li::before{display:none}
.badge{font:600 11px var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;background:var(--cream);color:var(--bronze);white-space:nowrap}
.badge.s-delivered,.badge.s-resolved,.badge.s-closed{background:#e4f2e6;color:#2f6b34}
.badge.s-cancelled,.badge.s-returned,.badge.s-refunded{background:#fbeae7;color:#a3271b}
.badge.s-placed,.badge.s-open{background:#fff4dc;color:#8a5a00}
/* checkout success: tracking box */
.track-box{display:grid;gap:8px;background:var(--cream);border:1px solid var(--line);padding:16px;margin:14px 0;text-align:left}
.track-link{word-break:break-all;font-size:14px}
.track-acts{display:flex;flex-wrap:wrap;gap:8px}
/* receipt / bill */
.receipt{border:1px solid var(--line);padding:22px;margin-top:16px;background:#fff;color:#111;font-size:14px}
.receipt header{display:flex;justify-content:space-between;gap:16px;border-bottom:2px solid #111;padding-bottom:12px}
.receipt header div{display:grid;gap:2px}
.r-name{font-size:17px}
.r-meta{text-align:right}
.r-meta b{font-size:16px;text-transform:uppercase;letter-spacing:.08em}
.r-to{display:grid;gap:2px;padding:12px 0}
.receipt table{width:100%;border-collapse:collapse;margin:6px 0}
.receipt th,.receipt td{border-bottom:1px solid #ddd;padding:7px 6px;text-align:right}
.receipt th:first-child,.receipt td:first-child{text-align:left}
.receipt td small{display:block;color:#666;font-size:12px}
.r-tot{margin:8px 0 0 auto;max-width:280px}
.r-tot div{display:flex;justify-content:space-between;padding:3px 0}
.r-tot dd{margin:0}
.r-tot .grand{border-top:2px solid #111;font-weight:700;font-size:16px;padding-top:6px}
.r-pay{margin:12px 0 4px}
.r-note{color:#555;font-size:12.5px;margin:6px 0 0}
@media print{
  body.print-receipt *{visibility:hidden}
  body.print-receipt .receipt,body.print-receipt .receipt *{visibility:visible}
  body.print-receipt .receipt{position:absolute;left:0;top:0;width:100%;border:0;margin:0}
}
/* legal identity strip in the footer (E-Commerce Rules 2020, r.4) */
.legal{display:flex;flex-wrap:wrap;gap:4px 20px;justify-content:center;padding-top:16px;padding-bottom:4px;font-size:12.5px;color:#cdb895;text-align:center}
.legal b{color:#efe0c2;font-weight:500}
.legal a{color:#efe0c2}
/* owner admin */
.admin-page{background:var(--ivory)}
.adm-hd{display:flex;align-items:center;gap:18px;padding:14px 24px;border-bottom:1px solid var(--line);background:var(--white);flex-wrap:wrap}
.adm-mark{height:46px;width:auto}
.adm-hd h1{font:500 18px var(--caps);letter-spacing:.14em;margin:0;flex:1;color:var(--bronze)}
.adm{max-width:1100px;margin:24px auto;padding:0 16px;display:grid;gap:12px}
.adm-login{max-width:460px;margin:40px auto;text-align:center}
.adm-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:6px}
.adm-bar input{flex:1;min-width:200px;padding:10px 12px;border:1px solid var(--line);font:15px var(--sans)}
.adm-bar select{padding:10px;border:1px solid var(--line);font:15px var(--sans)}
.adm-tabs{display:flex;border:1px solid var(--line)}
.adm-tabs button{all:unset;cursor:pointer;padding:10px 16px;font:500 13px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.adm-tabs button.on{background:var(--bronze);color:#fff}
.adm-tabs b{margin-left:4px}
.adm-card{background:var(--white);border:1px solid var(--line)}
.adm-card summary{display:grid;grid-template-columns:150px 1fr 170px 130px 150px;gap:10px;align-items:center;padding:12px 16px;cursor:pointer;font-size:14px}
.adm-card summary small{color:var(--muted);text-align:right}
.adm-body{padding:4px 16px 18px;border-top:1px solid var(--hair)}
.adm-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.adm-cols h4{font:500 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--bronze);margin:14px 0 4px}
.adm-cols ul{margin:0;padding-left:18px}
.adm-form{display:grid;gap:10px;align-content:start;padding-top:14px}
.adm-form label{display:grid;gap:4px;font:500 12.5px var(--sans);color:var(--bronze)}
.adm-form input,.adm-form select,.adm-form textarea{font:15px var(--sans);padding:9px 11px;border:1px solid var(--line);background:#fff}
.adm-send{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--cream);padding:12px}
.adm-send p{margin:0;width:100%;font-size:13px;color:var(--bronze)}
@media (max-width:760px){
  .ops-card{padding:22px 18px}
  .ops-form{grid-template-columns:1fr}
  .steps li{font-size:10.5px}
  .adm-card summary{grid-template-columns:1fr 1fr}
  .adm-cols{grid-template-columns:1fr}
  .receipt header{flex-direction:column}
  .r-meta{text-align:left}
}

.ops-card.ok .done-ico{margin:0 auto 12px}
