:root {
  --shirt-surface: #ffffff;
  --shirt-ink: #000354;
  --shirt-muted: #626579;
  --shirt-border: #d9deed;
  --shirt-accent: #f6b025;
  --shirt-blue: #086abd;
  --shirt-print-blue: #17428a;
  --shirt-field: #f5f7fb;
  --shirt-error: #c62828;
}
section.personalize.shirt-section { padding: 64px 24px; }
.shirt-section .shirt-container { width: 100%; max-width: 1100px; margin: 0 auto; position: relative; z-index: 1; }
.shirt-section .title-section { margin: 0 0 32px; text-align: center; }
.shirt-customizer { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); background: var(--shirt-surface); color: var(--shirt-ink); border-radius: 8px; overflow: hidden; font-family: Outfit,sans-serif; }
.shirt-visual { padding: 24px; border-right: 1px solid var(--shirt-border); min-width: 0; }
.shirt-preview { position: relative; width: 100%; aspect-ratio: 1; }
.shirt-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.shirt-print { position: absolute; inset: 0; color: var(--shirt-surface); pointer-events: none; text-align: center; }
[data-color="white"] .shirt-print { color: var(--shirt-print-blue); }
.shirt-print [data-print-name], .shirt-print [data-print-number] { position: absolute; left: 25%; width: 50%; line-height: 1; font-family: 'Tusker Grotesk',Phudu,sans-serif; font-weight: 700; white-space: nowrap; letter-spacing: 0; }
.shirt-print [data-print-name] { top: 25%; }
.shirt-print [data-print-number] { top: 33%; }
.shirt-controls { padding: 36px 28px; display: flex; flex-direction: column; justify-content: center; gap: 26px; min-width: 0; }
.shirt-controls h4 { margin: 0; font-family: Phudu,sans-serif; font-size: 26px; color: var(--shirt-ink); }
.shirt-customizer fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }
.shirt-customizer legend, .shirt-field label { font-size: 16px; font-weight: 600; margin-bottom: 12px; display: block; }
.shirt-colors { display: flex; gap: 12px; }
.shirt-choice { cursor: pointer; position: relative; display: flex; align-items: center; gap: 9px; border: 1px solid var(--shirt-border); border-radius: 6px; padding: 11px 16px; font-size: 16px; }
.shirt-choice:has(input:checked) { border-color: var(--shirt-ink); outline: 1px solid var(--shirt-ink); background: var(--shirt-field); }
.shirt-choice input, .shirt-side input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.shirt-choice:has(input:focus-visible), .shirt-side:has(input:focus-visible) { outline: 3px solid var(--shirt-accent); outline-offset: 3px; }
.shirt-swatch { width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--shirt-border); background: var(--shirt-surface); }
.shirt-swatch-blue { background: var(--shirt-blue); }
.shirt-fields { display: grid; grid-template-columns: minmax(0,1fr) 100px; gap: 14px; }
.shirt-field input { box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid var(--shirt-border); border-radius: 6px; background: var(--shirt-field); color: var(--shirt-ink); padding: 14px 12px; font-family: inherit; font-size: 16px; height: 50px; }
.shirt-field input:focus { outline: 2px solid var(--shirt-ink); outline-offset: 2px; }
.shirt-field input::placeholder { color: var(--shirt-muted); }
.shirt-sizes { display: flex; gap: 10px; flex-wrap: wrap; }
.shirt-size { cursor: pointer; position: relative; display: flex; align-items: center; justify-content: center; min-width: 56px; padding: 12px 14px; border: 1px solid var(--shirt-border); border-radius: 6px; font-size: 16px; font-weight: 600; }
.shirt-size:has(input:checked) { border-color: var(--shirt-ink); outline: 1px solid var(--shirt-ink); background: var(--shirt-field); }
.shirt-size input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.shirt-size:has(input:focus-visible) { outline: 3px solid var(--shirt-accent); outline-offset: 3px; }
.shirt-sides { display: flex; justify-content: center; gap: 4px; margin-top: 12px; }
.shirt-side { cursor: pointer; position: relative; padding: 10px 24px; font-size: 14px; font-weight: 600; border-bottom: 2px solid var(--shirt-border); color: var(--shirt-muted); }
.shirt-side:has(input:checked) { color: var(--shirt-ink); border-color: var(--shirt-ink); }
.shirt-customizer .shirt-reset.btn { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 10px; background: var(--shirt-field); color: var(--shirt-ink); border: 1px solid var(--shirt-border); border-radius: 6px; cursor: pointer; }
.shirt-reset svg { width: 22px; height: 22px; }
.shirt-error { color: var(--shirt-ink); font-size: 14px; text-align: center; }
.shirt-customizer [hidden] { display: none; }
.shirt-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 700px) {
  section.personalize.shirt-section { padding: 40px 16px; }
  .shirt-customizer { grid-template-columns: minmax(0,1fr); }
  .shirt-visual { padding: 14px; border-right: 0; border-bottom: 1px solid var(--shirt-border); }
  .shirt-controls { padding: 24px 20px; gap: 22px; }
  .shirt-fields { grid-template-columns: minmax(0,1fr) 86px; gap: 10px; }
  .shirt-choice { padding: 10px 14px; }
}
section.personalize.shirt-section, section.personalize.shirt-section *, section.personalize.shirt-section *::before, section.personalize.shirt-section *::after { box-sizing: border-box; }
section.personalize.shirt-section { width: 100%; max-width: 100%; overflow-x: hidden; }

.shirt-cta-wrap { display: grid; min-width: 0; max-width: 100%; gap: 8px; margin-top: 16px; }
.shirt-gift { margin: 0; font-weight: 700; color: var(--shirt-ink); font-size: 15px; }
.shirt-cta { width: 100%; max-width: 100%; white-space: normal; padding: 12px; min-height: 52px; border: 0; border-radius: 8px; background: var(--shirt-accent); color: var(--shirt-ink); font: 800 16px Outfit, sans-serif; text-transform: uppercase; cursor: pointer; }
.shirt-cta:hover { filter: brightness(1.05); }
.shirt-cta-error { margin: 0; color: var(--shirt-error); font-weight: 600; font-size: 14px; }