.myb-ai { border: 1px solid #ecdcd4; border-radius: 14px; padding: 18px; margin: 0 0 18px; background: #fffaf7; }
.myb-ai-step { margin-bottom: 14px; }
.myb-ai-label { display: block; font-weight: 700; margin-bottom: 6px; }
.myb-ai-hint { font-size: 13px; color: #7a6a63; margin: 0 0 8px; }
.myb-ai input[type="text"] { width: 100%; max-width: 320px; }
.myb-ai-colours { display: flex; gap: 14px; flex-wrap: wrap; }
.myb-ai-colour { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.myb-ai-colour input { position: absolute; opacity: 0; }
.myb-ai-colour span { width: 26px; height: 26px; border-radius: 50%; border: 2px solid transparent; box-shadow: inset 0 0 0 2px #fff; }
.myb-ai-colour input:checked + span { border-width: 3px; }
.myb-ai-consent { display: block; font-size: 13px; margin: 10px 0 14px; color: #5d4f49; }
.myb-ai-go { background: #a2264a !important; color: #fff !important; border-radius: 999px !important; padding: 12px 22px !important; }
.myb-ai-go:disabled { opacity: .5; }
.myb-ai-left { font-size: 13px; color: #7a6a63; margin: 8px 0; }
.myb-ai-status { padding: 10px 12px; border-radius: 10px; background: #f6efe9; margin: 8px 0; font-size: 14px; }
.myb-ai-status.is-error { background: #fbe7e9; color: #8d1f36; }
.myb-ai-spin { display: inline-block; width: 14px; height: 14px; border: 2px solid #a2264a; border-right-color: transparent; border-radius: 50%; vertical-align: -2px; animation: myb-ai-spin 0.8s linear infinite; margin-right: 6px; }
@keyframes myb-ai-spin { to { transform: rotate(360deg); } }
.myb-ai-preview img { width: 100%; border-radius: 10px; border: 1px solid #eee; background: #fff; }
.myb-ai-thumbs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.myb-ai-thumb { padding: 0; border: 2px solid transparent; border-radius: 8px; background: none; width: 96px; cursor: pointer; }
.myb-ai-thumb img { width: 100%; border-radius: 6px; display: block; }
.myb-ai-thumb.is-active { border-color: #a2264a; }
.myb-ai-rules { font-size: 12px; color: #8a7b74; margin: 12px 0 0; }
/* the theme lays out form.cart as one flex row (quantity + button); give the generator its own full-width row above them */
.single-product div.product form.cart:has(.myb-ai) { flex-wrap: wrap; row-gap: 14px; }
.single-product div.product form.cart .myb-ai { flex: 0 0 100%; width: 100%; order: -1; box-sizing: border-box; }
.myb-ai-preview a { display: block; }
.myb-ai-zoom { max-width: 320px; margin: 10px auto 0; }
.myb-ai-zoom img { border-radius: 10px; }
.myb-ai-pick, .myb-ai input.myb-ai-upper { width: 100%; max-width: 360px; text-transform: uppercase; }
.myb-ai-pick + .myb-ai-upper { margin-top: 8px; }

/* wygenerowany podgląd w galerii produktu (u góry po lewej) */
.myb-ai-badge { position: absolute; top: 10px; left: 10px; z-index: 6; background: #a2264a; color: #fff; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; box-shadow: 0 2px 6px rgba(0,0,0,.2); pointer-events: none; }
/* gdy podgląd jest już w galerii po lewej – nie dubluj dużego mockupu pod formularzem (zostają miniatury wersji i zbliżenie postaci) */
.myb-ai.has-left-preview #myb-ai-img-link { display: none; }
#myb-ai-left-preview { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5; background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: inherit; }
#myb-ai-left-preview img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
/* wskaźnik odświeżania podglądu przy zmianie napisu/koloru */
#myb-ai-left-preview.is-updating img, .myb-ai-preview.is-updating img { opacity: .55; filter: blur(1px); transition: opacity .15s; }
#myb-ai-left-preview.is-updating::after { content: ""; position: absolute; top: 50%; left: 50%; width: 34px; height: 34px; margin: -17px 0 0 -17px; border: 4px solid rgba(162,38,74,.35); border-top-color: #a2264a; border-radius: 50%; animation: myb-ai-spin .8s linear infinite; z-index: 7; }
/* przycisk powrotu do wygenerowanego podglądu (po obejrzeniu innych zdjęć) */
#myb-ai-show-preview{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:6;background:#a2264a;color:#fff;border:none;border-radius:999px;padding:9px 16px;font-weight:700;font-size:12px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.28)}
#myb-ai-show-preview:hover{background:#86203f}
/* zawsze widoczny przełącznik: podgląd klienta <-> zdjęcia produktu */
#myb-ai-toggle{position:absolute;top:12px;right:12px;z-index:8;background:#a2264a;color:#fff;border:none;border-radius:999px;padding:9px 15px;font-weight:700;font-size:12px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.28);line-height:1}
#myb-ai-toggle:hover{background:#86203f}
@media(max-width:600px){#myb-ai-toggle{top:8px;right:8px;padding:7px 12px;font-size:11px}}
/* miniatura „Twój podgląd" w liście miniatur galerii */
.myb-ai-navthumb{position:relative;cursor:pointer;border:2px solid #a2264a;border-radius:8px;overflow:hidden;width:100% !important;float:none !important;margin:0 0 10px !important;list-style:none;box-sizing:border-box}
.myb-ai-navthumb img{display:block;width:100% !important;height:auto !important;margin:0 !important}
.myb-ai-navthumb .myb-ai-navbadge{position:absolute;top:3px;left:3px;z-index:2;background:#a2264a;color:#fff;font-size:8px;font-weight:800;line-height:1.05;padding:2px 4px;border-radius:4px;text-align:center}
.myb-ai-navthumb.myb-ai-active{box-shadow:0 0 0 3px #a2264a}
