@import url("./color-studio-v0630.css");
.studio-app .tee-size-guide {
  margin:12px 0 16px;
  border:1px solid #dce5e0;
  border-radius:10px;
  background:#fff;
}
.studio-app .tee-size-guide > summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:48px;
  padding:11px 14px;
  border-radius:9px;
  font-size:14px;
  font-weight:600;
  line-height:1.5;
  list-style:none;
  cursor:pointer;
}
.studio-app .tee-size-guide > summary::-webkit-details-marker {
  display:none;
}
.studio-app .tee-size-guide > summary::after {
  content:'+';
  flex:0 0 20px;
  color:var(--link,#17615e);
  text-align:center;
  font-size:22px;
  font-weight:400;
  line-height:1;
}
.studio-app .tee-size-guide[open] > summary {
  margin-bottom:12px;
  border-bottom:1px solid #e4ece7;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:#f7faf8;
}
.studio-app .tee-size-guide[open] > summary::after {
  content:'−';
}
.studio-app .tee-size-table-wrap {
  max-width:calc(100% - 28px);
  min-width:0;
  margin:0 14px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  border:1px solid #e1e9e4;
  border-radius:7px;
  scrollbar-width:thin;
}
.studio-app .tee-size-table {
  width:100%;
  min-width:490px;
  margin:0;
  border-collapse:collapse;
  font-size:12px;
  line-height:1.4;
  text-align:center;
  font-variant-numeric:tabular-nums;
}
.studio-app .tee-size-table caption {
  padding:9px 12px;
  background:#fff;
  color:var(--muted,#5d726b);
  text-align:left;
  font-size:12px;
}
.studio-app .tee-size-table :is(th,td) {
  padding:9px 8px;
  border-top:1px solid #e7ede9;
  white-space:nowrap;
}
.studio-app .tee-size-table thead th {
  background:#edf6f2;
  font-weight:600;
}
.studio-app .tee-size-table tbody th {
  background:#f9fbfa;
  font-weight:700;
}
.studio-app .tee-size-measure-note {
  margin:10px 14px;
  color:var(--muted,#5d726b);
  font-size:12px;
  line-height:1.65;
}
.studio-app .tee-size-original {
  display:inline-flex;
  align-items:center;
  min-height:36px;
  max-width:calc(100% - 28px);
  margin:0 14px 8px;
  color:var(--link,#17615e);
  font-size:13px;
  line-height:1.5;
  text-underline-offset:3px;
}
.studio-app .tee-size-helper {
  margin:14px 0 0;
  padding:14px;
  border-top:1px solid #e4ece7;
  border-radius:0 0 9px 9px;
  background:#f7faf8;
}
.studio-app .tee-size-helper-intro {
  margin:0 0 12px;
  font-size:14px;
  font-weight:600;
  line-height:1.5;
}
.studio-app .tee-size-metrics {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.studio-app .tee-size-metrics > div {
  min-width:0;
}
.studio-app .tee-size-metrics label {
  display:flex;
  justify-content:space-between;
  gap:6px;
  margin-bottom:6px;
  font-size:13px;
  font-weight:600;
}
.studio-app .tee-size-metrics label span {
  color:var(--muted,#5d726b);
  font-weight:400;
}
.studio-app .tee-size-metrics .field {
  box-sizing:border-box;
  width:100%;
  min-width:0;
  min-height:46px;
  padding:10px;
  border:1px solid #cad9d1;
  border-radius:7px;
  background:#fff;
  font-size:16px;
  line-height:1.4;
}
.studio-app .tee-size-metrics .field[aria-invalid='true'] {
  border-color:#a23f35;
}
.studio-app .tee-size-fit {
  display:flex;
  flex-wrap:wrap;
  gap:4px 18px;
  min-width:0;
  margin:12px 0 0;
  padding:0;
  border:0;
}
.studio-app .tee-size-fit legend {
  padding:0;
  font-size:13px;
  font-weight:600;
  line-height:1.5;
}
.studio-app .tee-size-fit label {
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:40px;
  max-width:100%;
  font-size:13px;
  line-height:1.5;
  cursor:pointer;
}
.studio-app .tee-size-fit input {
  width:17px;
  height:17px;
  flex:0 0 17px;
  margin:0;
  accent-color:var(--link,#17615e);
}
.studio-app .tee-size-privacy {
  margin:4px 0 12px;
  color:var(--muted,#5d726b);
  font-size:12px;
  line-height:1.6;
}
.studio-app .tee-size-helper .button {
  width:100%;
  min-width:0;
  min-height:46px;
  padding:10px 12px;
  border-color:#afcfc2;
  background:white;
  color:var(--link,#17615e);
  font-size:14px;
  line-height:1.5;
}
.studio-app .tee-size-result {
  margin-top:12px;
  padding:12px;
  border:1px solid #c6dfd3;
  border-radius:8px;
  background:#edf7f1;
  font-size:13px;
  line-height:1.6;
}
.studio-app .tee-size-result strong {
  display:block;
  font-size:15px;
  line-height:1.5;
}
.studio-app .tee-size-result p {
  margin:6px 0 0;
}
.studio-app .tee-size-helper .tee-size-apply {
  margin-top:10px;
  border-color:var(--link,#17615e);
  background:var(--hh-accent,#81d8d0);
  color:var(--hh-accent-ink,#153f3b);
}
.studio-app .tee-size-helper .button:disabled {
  opacity:.6;
  cursor:not-allowed;
}
.studio-app .tee-size-helper [hidden] {
  display:none!important;
}
.studio-app :is(.tee-size-guide > summary,.tee-size-table-wrap,.tee-size-helper .field,.tee-size-helper .button,.tee-size-fit input,.purchase-location a,.tee-size-original):focus-visible {
  outline:2px solid var(--hh-focus,#17615e);
  outline-offset:3px;
}

.tee-size-options { margin: 13px 0 16px; min-width: 0; }
.tee-size-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.tee-size-heading .field-label { margin:0; }
.tee-size-heading b { margin-left:7px; font-weight:500; color:var(--muted); }
.tee-size-heading a { font-size:11px; color:var(--link); text-decoration:none; }
.tee-size-choices { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px; }
.tee-size-choices button { border:1px solid var(--line); border-radius:7px; min-height:40px; padding:5px; background:#fff; font-size:12px; font-weight:600; }
.tee-size-choices button[aria-pressed="true"] { border-color:var(--link); background:#e5f7f5; box-shadow:inset 0 0 0 1px var(--link); }
.tee-size-choices button:disabled { color:#9a9f9d; background:#f2f4f3; text-decoration:line-through; cursor:not-allowed; }
.tee-product-description { margin:0 0 15px; border-bottom:1px solid var(--line); padding-bottom:12px; }
.tee-product-description summary { font-size:12px; cursor:pointer; color:var(--muted); }
.tee-product-description p { font-size:12px; line-height:1.65; margin:8px 0; }
.tee-side-switch { flex-wrap:wrap; gap:3px; }
.tee-side-switch button { font-size:10px; padding:7px 8px; }
.tee-side-switch button small { font-size:8px; }
.tote-editor:has(.tee-side-switch) .preview-toolbar { align-items:flex-start; gap:5px; }
.tote-editor:has(.tee-side-switch) .canvas-actions { flex:none; }
.studio-app .tee-size-guide { margin-bottom:0; }
.studio-app .tee-size-guide > summary { min-height:40px; font-size:12px; padding:9px 11px; }
@media(max-width:760px){ .tee-side-switch { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); flex:1; } .tee-side-switch button { min-height:35px; padding:5px; } }
.tee-print-options { border:1px solid var(--line); border-radius:9px; padding:11px 12px; margin:0 0 14px; background:#fafcfc; }
.tee-print-options label { display:block; font-size:11px; }
.tee-print-options label > span { display:block; font-weight:600; margin-bottom:6px; }
.tee-print-options select { width:100%; min-width:0; min-height:40px; border:1px solid var(--line); border-radius:6px; background:#fff; padding:8px; font:inherit; font-size:12px; color:var(--ink,#203d38); }
.tee-print-options small { display:block; margin-top:7px; font-size:10px; color:var(--muted); }
.tee-size-heading > button { font-size:11px; }
.tee-print-quote { border:1px solid var(--line); background:#f6fbfa; border-radius:8px; margin:0 0 14px; padding:10px 12px; }
.tee-print-quote > div { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12px; }
.tee-print-quote strong { font-size:12px; font-weight:600; }
.tee-print-quote small { display:block; font-size:10px; color:var(--muted); margin-top:5px; }