/* Tavelo Baby – personalizacja karty produktu. Wszystkie style są ograniczone do .tavelo-baby. */
.tavelo-baby { --tvb-navy:#0b182b; --tvb-beige:#f5f1eb; --tvb-line:#d8d9d9; --tvb-text:#162030; margin:22px 0 26px; color:var(--tvb-text); font-family:inherit; width:100%; }
.tavelo-baby * { box-sizing:border-box; }
.tavelo-baby .tvb-heading { color:var(--tvb-navy); font-size:21px; line-height:1.3; margin:0 0 24px; font-weight:500; letter-spacing:-.02em; }
.tavelo-baby .tvb-symbols { padding:0; margin:0 0 22px; border:0; min-width:0; }
.tavelo-baby .tvb-symbols legend, .tavelo-baby .tvb-field > span { display:block; margin:0 0 10px; font-size:13px; line-height:1.5; font-weight:700; color:var(--tvb-navy); }
.tavelo-baby .tvb-symbols legend span, .tavelo-baby .tvb-field b { color:#a13d3d; }
.tavelo-baby .tvb-symbol-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.tavelo-baby .tvb-symbol { display:block; position:relative; cursor:pointer; margin:0; }
.tavelo-baby .tvb-symbol input { position:absolute; width:1px; height:1px; clip-path:inset(50%); opacity:0; overflow:hidden; }
.tavelo-baby .tvb-symbol-card { border:1px solid var(--tvb-line); border-radius:6px; padding:9px 4px 8px; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:104px; gap:6px; transition:border-color .15s, background .15s; }
.tavelo-baby .tvb-symbol-card img { display:block; width:58px; height:58px; object-fit:contain; margin:0; }
.tavelo-baby .tvb-symbol-card span { font-size:11px; font-weight:500; text-align:center; line-height:1.3; color:var(--tvb-text); }
.tavelo-baby .tvb-symbol input:checked + .tvb-symbol-card { border:2px solid var(--tvb-navy); padding:8px 3px 7px; background:#fcfbf9; }
.tavelo-baby .tvb-symbol input:focus-visible + .tvb-symbol-card { outline:3px solid #90aed5; outline-offset:3px; }
.tavelo-baby .tvb-fields { display:grid; gap:15px; margin-bottom:18px; }
.tavelo-baby .tvb-field { display:block; margin:0; }
.tavelo-baby .tvb-field em { color:#6b7079; font-style:normal; font-weight:400; }
.tavelo-baby .tvb-field input { display:block; height:48px; width:100%; background:#fff; border:1px solid #ced1d4; border-radius:4px; box-shadow:none; padding:0 14px; font-size:15px; color:var(--tvb-text); margin:0; font-family:inherit; }
.tavelo-baby .tvb-field input:focus { border-color:var(--tvb-navy); outline:2px solid #d7dfec; outline-offset:1px; }
.tavelo-baby .tvb-field small { display:block; color:#777; font-size:11px; margin-top:7px; line-height:1.4; }
.tavelo-baby .tvb-preview-intro { display:flex; gap:15px; align-items:center; background:var(--tvb-beige); border-radius:7px; padding:12px; margin-top:20px; }
.tavelo-baby .tvb-mini-preview { flex:0 0 114px; min-width:0; }
.tavelo-baby .tvb-preview-actions { flex:1 1 0; min-width:0; }
.tavelo-baby .tvb-preview-actions p { margin:0 0 4px; font-size:14px; color:var(--tvb-navy); font-weight:700; line-height:1.35; }
.tavelo-baby .tvb-preview-actions small { display:block; margin:0 0 11px; color:#6f7176; font-size:11px; }
.tavelo-baby .tvb-open-preview, .tavelo-baby .tvb-back-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; text-align:center; background:var(--tvb-navy) !important; color:white !important; border:1px solid var(--tvb-navy) !important; border-radius:4px; padding:10px 12px !important; font-size:11px !important; font-family:inherit; letter-spacing:.04em; cursor:pointer; text-transform:uppercase; line-height:1.4 !important; height:auto !important; min-height:0 !important; }
.tavelo-baby .tvb-open-preview:hover, .tavelo-baby .tvb-back-button:hover { filter:brightness(1.2); }
.tavelo-baby .tvb-disclaimer { color:#777; margin:9px 0 0 !important; font-size:11px; line-height:1.45; }
.tavelo-baby .tvb-visual { position:relative; width:100%; aspect-ratio:1 / 1; overflow:hidden; background:white; }
.tavelo-baby .tvb-disc-photo { display:block; width:100%; height:100%; object-fit:contain; margin:0; }
.tavelo-baby .tvb-engraving { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
/* Jeden krój i identyczna geometria dla obu instancji podglądu. */
.tavelo-baby .tvb-engraving text { font-family:Comfortaa, 'Century Gothic', 'Avenir Next', sans-serif; font-weight:400; stroke:none; letter-spacing:0; }
.tavelo-baby .tvb-engraving textPath { font-family:inherit; }
body.tvb-modal-open { overflow:hidden; }
.tavelo-baby .tvb-modal[hidden] { display:none !important; }
.tavelo-baby .tvb-modal { position:fixed; inset:0; z-index:999999; display:flex; align-items:center; justify-content:center; padding:16px; }
.tavelo-baby .tvb-backdrop { position:absolute; inset:0; background:rgba(5,12,23,.7); cursor:pointer; }
.tavelo-baby .tvb-dialog { position:relative; width:min(94vw,650px); max-height:calc(100dvh - 32px); overflow:auto; background:white; border-radius:12px; padding:16px; text-align:center; box-shadow:0 12px 60px rgba(0,0,0,.18); outline:none; }
.tavelo-baby .tvb-dialog-header { display:flex; justify-content:space-between; align-items:center; padding:0 2px 8px; color:var(--tvb-navy); font-size:17px; font-weight:600; }
.tavelo-baby .tvb-close { width:36px; height:36px; flex:0 0 36px; border:1px solid #e4e1de; background:white !important; border-radius:50%; color:var(--tvb-navy); padding:0 !important; font-size:25px; font-weight:300; line-height:1 !important; min-height:0 !important; cursor:pointer; }
.tavelo-baby .tvb-visual--large { width:min(100%,510px); margin:0 auto; }
.tavelo-baby .tvb-dialog > p { margin:6px auto 13px !important; color:#747474; font-size:11px; }
.tavelo-baby .tvb-back-button { width:100%; max-width:360px; margin:0 auto 5px; }
@media (max-width:600px) {
 .tavelo-baby .tvb-heading { font-size:19px; }
 .tavelo-baby .tvb-symbol-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
 .tavelo-baby .tvb-symbol-card { min-height:94px; padding:7px 2px; }
 .tavelo-baby .tvb-symbol-card img { width:52px; height:52px; }
 .tavelo-baby .tvb-symbol-card span { font-size:10px; }
 .tavelo-baby .tvb-mini-preview { flex-basis:100px; }
 .tavelo-baby .tvb-preview-intro { gap:10px; padding:10px; }
 .tavelo-baby .tvb-dialog { width:100%; padding:10px; }
 .tavelo-baby .tvb-dialog-header { font-size:14px; }
}