/* StarBio - Track My Order. Direction "StarBio Deep Field".
   #07080B ground, #101219 panel, #5CC0FF the only accent, hairlines not
   shadows. Kept inside the theme's 860px page column on purpose: a two-field
   form does not want to be 1240px wide. */

.sb-tr{font-family:var(--body,'Archivo',sans-serif);color:var(--txt,#F4F6F9)}
.sb-tr-lead{font-size:16px;line-height:1.65;color:var(--muted,#98A2AE);max-width:60ch;margin:0 0 26px}

.sb-tr-panel{background:var(--panel,#101219);border:1px solid var(--line,rgba(255,255,255,.07));border-radius:16px;padding:28px}
.sb-tr-panel > p:first-child{display:none}
.sb-tr-form{display:flex;flex-direction:column;gap:20px;margin:0}

.sb-tr-field{display:flex;flex-direction:column;gap:7px}
.sb-tr-field label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted,#98A2AE);font-weight:600;float:none;width:auto;display:block}
.sb-tr-field input.input-text{width:100%;box-sizing:border-box;background:var(--bg2,#0B0D11);border:1px solid var(--line2,rgba(255,255,255,.14));border-radius:12px;color:var(--txt,#F4F6F9);font:inherit;font-size:16px;padding:13px 15px;transition:border-color .15s ease,box-shadow .15s ease}
.sb-tr-field input.input-text::placeholder{color:var(--dim,#646F79)}
.sb-tr-field input.input-text:focus{outline:none;border-color:var(--brand,#5CC0FF);box-shadow:0 0 0 3px color-mix(in oklab,var(--brand,#5CC0FF) 22%,transparent)}
.sb-tr-hint{font-size:12.5px;line-height:1.5;color:var(--dim,#646F79)}

.sb-tr-btn{align-self:flex-start;background:var(--brand,#5CC0FF);color:#04121C;border:none;border-radius:12px;padding:13px 26px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;text-decoration:none!important;transition:filter .15s ease}
.sb-tr-btn:hover{filter:brightness(1.08);color:#04121C}
.sb-tr-btn:focus-visible{outline:2px solid var(--brand,#5CC0FF);outline-offset:3px}

.sb-tr-help{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--line,rgba(255,255,255,.07))}
.sb-tr-help li{display:flex;flex-direction:column;gap:5px;padding:16px 0;border-bottom:1px solid var(--line,rgba(255,255,255,.07))}
.sb-tr-q{font-weight:600;font-size:15px;color:var(--txt,#F4F6F9)}
.sb-tr-a{font-size:14px;line-height:1.65;color:var(--muted,#98A2AE)}
.sb-tr-a a{color:var(--brand,#5CC0FF)}

/* the RESULT view: core renders this as a bare definition list */
.sb-tr .woocommerce-order-overview,
.sb-tr ul.order_details{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line,rgba(255,255,255,.07));border:1px solid var(--line,rgba(255,255,255,.07));border-radius:14px;overflow:hidden}
.sb-tr .woocommerce-order-overview li,
.sb-tr ul.order_details li{background:var(--panel,#101219);padding:16px 18px;margin:0;border:none;float:none;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted,#98A2AE);font-weight:600}
.sb-tr .woocommerce-order-overview li strong,
.sb-tr ul.order_details li strong{display:block;margin-top:7px;font-family:var(--display,'Sora',sans-serif);font-size:17px;font-weight:700;letter-spacing:normal;text-transform:none;color:var(--txt,#F4F6F9)}

.sb-tr .woocommerce-order-details__title,
.sb-tr h2{font-family:var(--display,'Sora',sans-serif);font-size:20px;font-weight:700;margin:26px 0 14px}

.sb-tr table.shop_table{width:100%;border-collapse:collapse;margin-top:18px;font-size:14.5px;border:1px solid var(--line,rgba(255,255,255,.07));border-radius:14px;overflow:hidden}
.sb-tr table.shop_table th{text-align:left;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted,#98A2AE);font-weight:600;padding:13px 16px;background:var(--panel2,#161922);border:none}
.sb-tr table.shop_table td{padding:14px 16px;border:none;border-top:1px solid var(--line,rgba(255,255,255,.07));color:var(--txt,#F4F6F9)}
.sb-tr table.shop_table td a{color:var(--brand,#5CC0FF)}
.sb-tr table.shop_table tfoot th,.sb-tr table.shop_table tfoot td{background:transparent;border-top:1px solid var(--line,rgba(255,255,255,.07));font-variant-numeric:tabular-nums}

@media(max-width:560px){
  .sb-tr-panel{padding:20px}
  .sb-tr-btn{width:100%;text-align:center}
  .sb-tr .woocommerce-order-overview,
  .sb-tr ul.order_details{grid-template-columns:1fr}
}
