/* Focus one garment part at a time; retain the existing fields and save contract. */
.ilogo-create-ui #canvas_front { position:relative; z-index:0; }
.ilogo-create-ui #canvas_front .js-product-parts { left:0 !important; top:0 !important; width:100% !important; height:auto; }
.ilogo-create-ui #create-view-tools { grid-column:1/-1; width:min(100%,440px); margin:8px auto 20px; position:relative; z-index:20; }
.ilogo-create-ui .create-view-buttons,.ilogo-create-ui .create-history-buttons { display:flex; justify-content:center; gap:8px; margin:8px 0; }
.ilogo-create-ui #create-view-tools button { min-height:44px; padding:8px 14px; border:1px solid #bac8d5; border-radius:7px; background:#fff; color:#062c50; cursor:pointer; }
.ilogo-create-ui #create-view-tools button[aria-pressed=true] { background:#062c50; color:white; }
.ilogo-create-ui #create-view-tools button:disabled { opacity:.45; cursor:default; }
.ilogo-create-ui #create-view-status { margin:8px 0; font-size:13px; color:#596576; text-align:center; }
.ilogo-create-ui #create-view-retry[hidden] { display:none; }
.ilogo-create-ui .create-view-loading .js-product-parts { visibility:hidden; }
.ilogo-create-ui .js-product-parts { cursor:pointer; }
.ilogo-create-ui .js-product-parts.create-part-flash { animation:create-part-flash .35s ease-out; }
@keyframes create-part-flash { 45% { opacity:.35; } }
@media(prefers-reduced-motion:reduce){.ilogo-create-ui .js-product-parts.create-part-flash{animation:none;}}
.ilogo-create-ui #create-garment-specification { max-width:440px; margin-top:20px; padding:12px; border:1px solid #d8e1e9; border-radius:8px; }
.ilogo-create-ui #create-garment-specification summary { cursor:pointer; font-weight:600; }
.ilogo-create-ui #create-garment-specification dl { margin:12px 0; }
.ilogo-create-ui #create-garment-specification dl>div { display:flex; justify-content:space-between; gap:12px; margin:6px 0; }
.ilogo-create-ui #create-garment-specification dd { margin:0; }
.ilogo-create-ui .create-spec-swatch { display:inline-block; width:14px; height:14px; border:1px solid #aaa; border-radius:50%; margin-right:6px; vertical-align:middle; }
.ilogo-create-ui .ilogo-part-picker-ready #parts-carousel,
.ilogo-create-ui .ilogo-part-picker-ready #parts-slider-controls,
.ilogo-create-ui .ilogo-part-picker-ready .tns-outer { display:none !important; }
.ilogo-create-ui .create-part-label { display:block; margin:0 0 8px; color:#062c50; font-size:14px; font-weight:600; }
.ilogo-create-ui .create-part-select { display:block; box-sizing:border-box; width:100%; min-height:46px; padding:10px 36px 10px 12px; border:1px solid #bac8d5; border-radius:8px; background-color:#fff; color:#062c50; font-size:16px; }
.ilogo-create-ui .parts-slider-wrapper.ilogo-part-picker-ready { width:min(100%,440px); height:auto !important; }
.ilogo-create-ui .ilogo-selected-colour { display:block; margin:14px 0 10px; color:#062c50; }
.ilogo-create-ui #mobile-parts-container #imgPlace { display:inline-flex !important; align-items:center; justify-content:center; box-sizing:border-box; width:100%; max-width:440px; min-height:48px; margin:20px 0 0; padding:12px 20px; border:1px solid #ff8000; border-radius:8px; background:#ff8000; color:#fff; font-size:16px; font-weight:600; text-decoration:none; cursor:pointer; }
.ilogo-create-ui #mobile-parts-container #imgPlace[aria-disabled=true] { opacity:.65; cursor:progress; }
.ilogo-create-ui #mobile-parts-container #imgPlace:hover { background:#e87500; border-color:#e87500; color:#fff; }
.ilogo-create-ui #mobile-parts-container .ilogo-artwork-hint { display:block; max-width:440px; margin:8px 0 0; color:#596576; font-size:13px; line-height:1.5; }
.ilogo-create-ui #create-design-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.ilogo-create-ui #create-design-actions button { min-height:44px; padding:10px 14px; border:1px solid #bac8d5; border-radius:8px; background:#fff; color:#062c50; font-size:14px; }
.ilogo-create-ui #create-design-actions .ilogo-choose-sizes { background:#fff; border-color:#bac8d5; color:#062c50; }
.ilogo-create-ui #colors-carousel .js-color-init { position:relative; }
.ilogo-create-ui #colors-carousel .js-color-init[aria-pressed=true] { outline:2px solid #062c50; outline-offset:2px; }
.ilogo-create-ui #colors-carousel .js-color-init[aria-pressed=true]::after { content:'✓'; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:18px; height:18px; border-radius:50%; background:#fff; color:#062c50; border:1px solid #062c50; font:bold 12px/16px Arial,sans-serif; text-align:center; }
.ilogo-create-ui #create-preview-status { max-width:440px; min-height:20px; margin:12px 0 0; color:#596576; font-size:13px; line-height:1.5; }
.ilogo-create-ui #create-preview-status button { min-height:40px; margin-left:8px; padding:6px 12px; border:1px solid #bac8d5; border-radius:6px; background:#fff; color:#062c50; }
.ilogo-create-ui .create-part-select:focus-visible,
.ilogo-create-ui #imgPlace:focus-visible { outline:2px solid #062c50; outline-offset:3px; }
@media(max-width:990px) {
    .ilogo-create-ui body { padding-bottom:calc(68px + env(safe-area-inset-bottom)); }
    .ilogo-create-ui #create-view-tools .create-view-buttons { position:fixed; left:0; right:0; bottom:0; z-index:80; margin:0; padding:8px 12px calc(8px + env(safe-area-inset-bottom)); border-top:1px solid #d8e1e9; background:#fff; box-shadow:0 -2px 8px #062c5014; }
    .ilogo-create-ui #create-view-tools .create-view-buttons button { flex:1 1 0; max-width:120px; }
    .ilogo-create-ui #mobile-parts-container { position:static; inset:auto; width:100%; max-width:100%; box-sizing:border-box; padding:0 8px; }
    .ilogo-create-ui #create-design-actions { display:flex; }
    .ilogo-create-ui .parts-slider-wrapper.ilogo-part-picker-ready { width:100%; }
    .ilogo-create-ui #mobile-parts-container .parts-slider-wrapper,.ilogo-create-ui #mobile-parts-container .colors-slider-wrapper { width:100%!important; max-width:100%; box-sizing:border-box; margin:0!important; padding:0!important; }
    .ilogo-create-ui .create-part-label,.ilogo-create-ui .create-part-select { display:none; }
    .ilogo-create-ui .ilogo-selected-colour { display:block; margin:2px 0; font-size:12px; line-height:18px; }
    .ilogo-create-ui #create-preview-status { box-sizing:border-box; width:100%; max-width:none; margin:4px 0; padding:8px 12px; font-size:13px; background:#f4f7fa; }
    .ilogo-create-ui #create-preview-status[data-state=ready] { display:none; }
    .ilogo-create-ui #create-preview-status[data-state=error] { background:#fff1e5; color:#713a00; }
    .ilogo-create-ui .parts-slider-wrapper .tns-outer,.ilogo-create-ui .colors-slider-wrapper .tns-outer { width:100%!important; padding:0!important; }
    .ilogo-create-ui #mobile-parts-container>p:first-child { margin:4px 0!important; font-size:13px; }
    .ilogo-create-ui .ilogo-part-picker-ready .tns-outer { display:block!important; }
    .ilogo-create-ui .parts-slider-wrapper .tns-ovh,.ilogo-create-ui .parts-slider-wrapper .tns-inner,
    .ilogo-create-ui .colors-slider-wrapper .tns-ovh,.ilogo-create-ui .colors-slider-wrapper .tns-inner { width:100%!important; max-width:100%; box-sizing:border-box; height:auto!important; margin:0!important; padding:0!important; overflow:visible; }
    .ilogo-create-ui .ilogo-part-picker-ready #parts-carousel,.ilogo-create-ui #colors-carousel { display:flex!important; flex-wrap:nowrap; gap:6px; width:100%!important; max-width:100%; height:auto!important; padding:4px 2px!important; margin:0!important; overflow-x:auto; transform:none!important; transition:none!important; scrollbar-width:thin; }
    .ilogo-create-ui #parts-carousel>.item { flex:0 0 auto; width:auto!important; margin:0; padding:0; }
    .ilogo-create-ui #parts-carousel>.item:empty,.ilogo-create-ui #parts-carousel>.tns-slide-cloned,
    .ilogo-create-ui #colors-carousel>.tns-slide-cloned { display:none; }
    .ilogo-create-ui #parts-carousel .js-part-init { display:flex; align-items:center; justify-content:center; gap:6px; min-height:40px; padding:6px 12px; box-sizing:border-box; white-space:nowrap; border:1px solid #d8e1e9; border-radius:5px; background:#f6f8fa; color:#062c50; font-size:13px; }
    .ilogo-create-ui #parts-carousel .js-part-init.active { background:#062c50; border-color:#062c50; color:#fff; }
    .ilogo-create-ui #parts-carousel .js-part-init span { margin:0; width:12px; height:12px; flex:0 0 12px; border-radius:50%; }
    .ilogo-create-ui #colors-carousel>.item { flex:0 0 42px; width:42px!important; margin:0; padding:3px; box-sizing:border-box; }
    .ilogo-create-ui #colors-carousel .js-color-init { display:block; width:36px; height:36px; margin:0; border:1px solid #bac8d5; border-radius:4px; box-sizing:border-box; }
    .ilogo-create-ui .parts-slider-wrapper .controls,.ilogo-create-ui .colors-slider-wrapper .controls { display:none!important; }
    .ilogo-create-ui .leftPanel { width:100%; max-width:100%; padding:0!important; float:none; }
    .ilogo-create-ui #canvas { width:min(100%,418px)!important; height:auto!important; aspect-ratio:418/482; margin:0 auto!important; }
    .ilogo-create-ui #canvas_front { width:100%!important; height:auto!important; aspect-ratio:418/482; margin:0!important; }
    .ilogo-create-ui #create-view-tools { width:100%; margin:4px auto 12px; }
    .ilogo-create-ui .create-view-buttons,.ilogo-create-ui .create-history-buttons { margin:4px 0; }
    .ilogo-create-ui #create-view-status { font-size:12px; margin:4px 8px; }
    .ilogo-create-ui #create-mobile-actions { padding:0 12px 20px; }
    .ilogo-create-ui #create-mobile-actions #imgPlace { display:flex; align-items:center; justify-content:center; min-height:46px; margin:8px 0; padding:10px; box-sizing:border-box; border-radius:7px; background:#ff8000; color:#fff; font-size:15px; font-weight:600; cursor:pointer; }
    .ilogo-create-ui #create-mobile-actions #imgPlace[aria-disabled=true] { opacity:.65; }
    .ilogo-create-ui #create-mobile-actions .ilogo-artwork-hint { font-size:12px; color:#596576; }
    .ilogo-create-ui #create-mobile-actions #create-design-actions { margin-top:8px; }
    .ilogo-create-ui .header .middle-header>.container { flex-wrap:nowrap!important; gap:4px; padding:6px 8px; }
    .ilogo-create-ui .header .middle-header>.container>#logo { flex:0 0 32px; min-width:32px; width:32px; margin:0 4px 0 0!important; padding:4px!important; box-sizing:border-box; }
    .ilogo-create-ui .header .middle-header>.container>.logo { flex:0 0 60px; width:60px!important; padding:0!important; margin:0!important; }
    .ilogo-create-ui .header .middle-header>.container>.logo img { width:60px; max-width:100%; height:auto; }
    .ilogo-create-ui .header .middle-header>.container>#create-studio-nav-bar { flex:1 1 auto; width:auto!important; min-width:0; margin:0!important; padding:0; border:0; }
    .ilogo-create-ui #create-studio-nav-bar.ilogo-editor-nav>li>a { height:48px; min-height:44px; font-size:10px; gap:3px; padding:3px 2px; }
    .ilogo-create-ui #create-studio-nav-bar.ilogo-editor-nav svg { width:20px; height:20px; }
}