/* Szklenie w publicznym konfiguratorze. Krem, brąz i rzeczywiste próbki Agmar. */
#cfg-szyba-sekcja .cfg-klamka-card,
#cfg-wzory-sekcja .cfg-klamka-card {
    font-family: inherit; text-align: center; padding: 0; min-width: 0;
    transition: border-color .18s, box-shadow .18s, transform .18s;
    touch-action: manipulation; -webkit-tap-highlight-color: rgba(85,45,28,.12);
}
#cfg-szyba-sekcja .cfg-klamka-card:focus-visible,
#cfg-wzory-sekcja button:focus-visible { outline: 3px solid #8b5834; outline-offset: 3px; }
#cfg-szyba-sekcja .cfg-klamka-foto { height: 144px; padding: 12px; }
#cfg-szyba-sekcja .cfg-klamka-foto img { width: 120px; height: 120px; object-fit: contain; border-radius: 3px; }
#cfg-szyba-sekcja .cfg-klamka-nazwa { display:block; min-height: 54px; font-size: .8rem; padding: 10px 7px; line-height: 1.35; }
#cfg-szyba-sekcja .cfg-klamka-cena { font-size: .75rem; margin-top: 4px; }
#cfg-szkla { grid-template-columns: repeat(auto-fill,minmax(158px,1fr)); gap: 14px; }
#cfg-szkla .cfg-klamka-foto { height: 222px; padding: 12px; }
#cfg-szkla .cfg-klamka-foto img { width: 100%; height: 100%; object-fit: contain; }
#cfg-szkla .cfg-klamka-nazwa { display:block; padding: 12px 8px; font-size: .85rem; line-height: 1.35; }
#cfg-szkla .cfg-szklo-opis { display:block; margin-top: 5px; color: #735e50; font-size: .73rem; font-weight: 400; line-height: 1.45; }
#cfg-szkla .cfg-klamka-cena { font-size: .78rem; margin-top: 7px; }
.cfg-szklo-detal { margin: 0 0 20px; padding: 0 0 18px; border-bottom: 1px solid #eadfce; }
.cfg-szklo-detal[hidden], .cfg-szklo-opcje[hidden] { display:none; }
.cfg-szklo-opcje { margin:0; padding:0; border:0; min-width:0; }
.cfg-szklo-opcje + .cfg-szklo-opcje { margin-top: 16px; }
.cfg-szklo-opcje legend { margin-bottom: 9px; padding:0; font-size:.83rem; font-weight:700; color:#552d1c; }
.cfg-szklo-opcje-lista { display:flex; flex-wrap:wrap; gap:8px; }
.cfg-szklo-opcje button { display:flex; align-items:center; gap:8px; min-height:46px; padding:8px 12px; border:1px solid #ddcdbb; border-radius:10px; background:#fffdf9; font:600 .8rem/1.25 inherit; font-family:inherit; color:#552d1c; cursor:pointer; touch-action:manipulation; transition:background-color .16s,border-color .16s; }
.cfg-szklo-opcje button[aria-pressed="true"] { background:#552d1c; border-color:#552d1c; color:#fffaf2; }
.cfg-szklo-opcje button:disabled { opacity:.5; cursor:default; }
.cfg-szklo-opcje img { width:28px; height:28px; object-fit:cover; border-radius:5px; }
.cfg-szklo-tasma { width:22px; height:22px; border-radius:50%; border:1px solid #b49b80; flex:0 0 auto; }
.cfg-szklo-tasma--1 { background:#232323; }
.cfg-szklo-tasma--2 { background:#fff; }
.cfg-szklo-tasma--4 { background:linear-gradient(135deg,#edd69f,#ad8037); }
.cfg-szklo-wybrane { margin:0 0 16px; color:#674331; font-size:.8rem; line-height:1.5; overflow-wrap:anywhere; }
.cfg-szklo-blad { color:#74472c; line-height:1.5; font-size:.85rem; }
.cfg-szklo-blad button { min-height:44px; padding:8px 14px; border:1px solid #c4a080; border-radius:8px; background:#fffaf2; color:#552d1c; font:inherit; cursor:pointer; }
@media (hover:hover) { .cfg-szklo-opcje button:not(:disabled):hover { border-color:#8b5834; background:#f4ebdf; } .cfg-szklo-opcje button[aria-pressed="true"]:hover { background:#6b3d28; } }
@media (max-width:700px) {
    #cfg-szyba-sekcja .cfg-klamka-foto { height:136px; padding:8px; }
    #cfg-szyba-sekcja .cfg-klamka-nazwa { font-size:.82rem; min-height:58px; }
    #cfg-szkla { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    #cfg-szkla .cfg-klamka-foto { height:200px; padding:9px; }
    #cfg-szkla .cfg-klamka-nazwa { font-size:.85rem; padding:10px 7px; }
    .cfg-szklo-opcje-lista { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
    #cfg-szklo-tasma .cfg-szklo-opcje-lista { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .cfg-szklo-opcje button { justify-content:center; padding:8px 6px; font-size:.78rem; min-width:0; }
    .cfg-szklo-tasma { width:16px; height:16px; }
}
@media (prefers-reduced-motion:reduce) { #cfg-szyba-sekcja .cfg-klamka-card,#cfg-wzory-sekcja .cfg-klamka-card,.cfg-szklo-opcje button { transition:none; } }
