/*
 * Silverbead – Produktseite (NOVAChild)
 * Wird nach my-nova.css geladen und überschreibt nur die Produktdetail-Seite.
 */

/* ---------- Galerie ---------- */
.product-detail .product-gallery{padding:0}

.sb-gallery{
    position:relative;
    display:grid;
    grid-template-columns:64px minmax(0,1fr);
    gap:14px;
    align-items:start;
    min-width:0;
}

.sb-gallery-thumbs{
    display:flex;
    flex-direction:column;
    gap:8px;
    max-height:560px;
    overflow-y:auto;
    padding:2px;
    scrollbar-width:none;
    min-width:0;
}
.sb-gallery-thumbs::-webkit-scrollbar{display:none}

.sb-gallery-thumb{
    width:100%;
    aspect-ratio:1/1;
    border:1px solid #e2e8f0;
    border-radius:11px;
    background:#fff;
    padding:4px;
    cursor:pointer;
    transition:border-color .15s, box-shadow .15s;
}
.sb-gallery-thumb:hover{border-color:#b9c9dc}
.sb-gallery-thumb.is-active{
    border-color:#1f6fd0;
    box-shadow:0 0 0 2px rgba(31,111,208,.13);
}
.sb-gallery-thumb:focus-visible,
.sb-gallery-arrow:focus-visible,
.sb-gallery-zoom:focus-visible,
.sb-gallery-stage:focus-visible{
    outline:3px solid rgba(31,111,208,.4);
    outline-offset:2px;
}
.sb-gallery-thumb img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}

.sb-gallery-stage{
    position:relative;
    aspect-ratio:1/1;
    min-height:520px;
    border:1px solid #e5eaf0;
    border-radius:22px;
    background:linear-gradient(145deg,#fff 0%,#f6f8fb 100%);
    overflow:hidden;
    touch-action:pan-y;
    cursor:grab;
    user-select:none;
    -webkit-user-select:none;
}
.sb-gallery-stage.is-dragging{cursor:grabbing}

.sb-gallery-track{
    display:flex;
    height:100%;
    will-change:transform;
    transition:transform .32s cubic-bezier(.22,.7,.25,1);
}

.sb-gallery-slide{
    flex:0 0 100%;
    min-width:0;
    height:100%;
    margin:0;
    padding:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}
.sb-gallery-slide img{
    width:100%;
    height:100%;
    max-height:480px;
    object-fit:contain;
    display:block;
    -webkit-user-drag:none;
    user-select:none;
    cursor:zoom-in;
}

.sb-gallery-arrow,
.sb-gallery-zoom{
    position:absolute;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(18,26,38,.1);
    background:rgba(255,255,255,.94);
    color:#121a26;
    box-shadow:0 6px 20px rgba(18,26,38,.08);
    cursor:pointer;
    z-index:3;
}
.sb-gallery-arrow{
    top:50%;
    width:42px;
    height:42px;
    border-radius:50%;
    font-size:25px;
    line-height:1;
    transform:translateY(-50%);
}
.sb-gallery-prev{left:14px}
.sb-gallery-next{right:14px}
.sb-gallery-zoom{
    top:14px;
    right:14px;
    width:40px;
    height:40px;
    border-radius:12px;
    font-size:18px;
}
.sb-gallery-arrow:hover,
.sb-gallery-zoom:hover{background:#fff;border-color:#b8c7d8}

.sb-gallery-count{
    position:absolute;
    left:16px;
    bottom:16px;
    z-index:3;
    padding:5px 10px;
    border-radius:999px;
    background:rgba(11,21,36,.72);
    color:#fff;
    font-size:12px;
    font-weight:600;
    letter-spacing:.03em;
}

.sb-gallery .product-actions{
    position:absolute;
    top:14px;
    right:64px;
    z-index:4;
    display:flex;
    gap:8px;
}
.sb-gallery .product-actions .btn{
    width:38px;
    height:38px;
    padding:0;
    border-radius:50%;
    border:1px solid rgba(18,26,38,.1);
    background:rgba(255,255,255,.94);
    color:#121a26;
    box-shadow:0 4px 14px rgba(18,26,38,.07);
}

.sb-gallery-dialog{
    width:min(92vw,1100px);
    max-width:none;
    max-height:92vh;
    padding:14px;
    border:1px solid #e2e8f0;
    border-radius:18px;
    background:#fff;
    box-shadow:0 24px 90px rgba(0,0,0,.35);
    overflow:hidden;
}
.sb-gallery-dialog::backdrop{
    background:rgba(5,12,22,.82);
    backdrop-filter:blur(5px);
}
.sb-gallery-dialog img{
    max-width:100%;
    max-height:calc(90vh - 28px);
    margin:auto;
    object-fit:contain;
}
.sb-gallery-dialog-close{
    position:fixed;
    top:20px;
    right:20px;
    width:44px;
    height:44px;
    border:0;
    border-radius:50%;
    background:#fff;
    color:#121a26;
    font-size:24px;
    cursor:pointer;
}

/* ---------- Kaufbereich ---------- */
.product-detail .product-info-inner.sb-buy-panel{
    background:#f7f9fc;
    border:1px solid #e8edf3;
    border-radius:20px;
    padding:28px 30px;
    box-shadow:0 18px 45px rgba(18,26,38,.045);
}
.sb-product-kicker{
    margin:0 0 10px;
    color:#1f6fd0;
    font-size:11.5px;
    font-weight:750;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.product-detail .product-title{
    font-size:clamp(26px,2.5vw,35px);
    line-height:1.13;
    letter-spacing:-.025em;
    margin:0 0 10px;
    text-wrap:balance;
}
.product-detail .info-essential{display:none}
.product-detail .shortdesc{
    margin:0 0 22px;
    color:#5c6a7d;
    font-size:15px;
    line-height:1.55;
}
.product-detail .product-offer{margin-top:0}
.product-detail .price_wrapper .price{
    font-size:36px;
    font-weight:700;
    letter-spacing:-.025em;
    line-height:1.1;
}
.product-detail .price_wrapper .price_label,
.product-detail .price_wrapper .footnote-reference{
    font-size:13px;
    color:#5c6a7d;
}
.product-detail .delivery-status{
    display:inline-flex;
    margin:12px 0 4px;
    padding:5px 12px;
    border-radius:999px;
    background:#f4f6f9;
    border:1px solid #e8edf3;
    font-size:13px;
}
.product-detail .delivery-status ul{margin:0;padding:0;list-style:none}
.product-detail .delivery-status li{margin:0;line-height:1.35}
.product-detail .sb-facts{
    list-style:none;
    padding:18px 0 0;
    margin:16px 0 18px;
    border-top:1px solid #e2e8f0;
    display:grid;
    gap:8px;
    font-size:13.5px;
    color:#5c6a7d;
}
.product-detail .sb-facts li{display:flex;gap:9px;align-items:flex-start}
.product-detail .sb-facts li::before{
    content:"";
    width:16px;
    height:16px;
    flex:0 0 16px;
    border-radius:50%;
    margin-top:2px;
    background:#e6f2ff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f6fd0' stroke-width='3'><path d='M5 13l4 4L19 7'/></svg>") center/10px no-repeat;
}
.product-detail .basket-form-inline{margin-top:4px}
.product-detail .basket-form-inline .form-counter,
.product-detail .basket-form-inline .input-group{
    border:1px solid #e2e8f0;
    border-radius:12px;
    overflow:hidden;
    background:#fff;
}
.product-detail .basket-form-inline .input-group{display:flex;height:50px;align-items:stretch}
.product-detail .basket-form-inline .input-group .btn{
    height:100%;
    min-height:0;
    padding:0 12px;
    border:0;
    border-radius:0;
    background:transparent;
    color:#121a26;
    box-shadow:none;
}
.product-detail .basket-form-inline .input-group .btn:hover{background:#f1f5fa}
.product-detail .basket-form-inline .form-control,
.product-detail .basket-form-inline .quantity{
    height:100%;
    border:0;
    background:#fff;
    text-align:center;
    font-size:15px;
}
.product-detail .basket-form-inline .btn{min-height:50px;border-radius:12px}
.product-detail .product-buy .btn-primary{
    background:#1f6fd0 !important;
    border-color:#1f6fd0 !important;
    color:#fff !important;
    box-shadow:0 8px 18px rgba(31,111,208,.17);
}
.product-detail .product-buy .btn-primary:hover{background:#1a5fb4 !important}

/* ---------- Tabs ---------- */
#result-wrapper .tab-navigation{margin:42px 0 0}
#result-wrapper .tab-navigation .nav-tabs{
    display:flex;
    flex-wrap:nowrap;
    align-items:stretch;
    gap:6px;
    height:53px;
    padding:0 6px;
    border:1px solid #e2e8f0;
    border-radius:14px;
    background:#f7f9fc;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
}
#result-wrapper .tab-navigation .nav-tabs::-webkit-scrollbar{display:none}
#result-wrapper .tab-navigation .nav-item{display:flex;flex:0 0 auto}
#result-wrapper .tab-navigation .nav-link{
    display:flex;
    align-items:center;
    border:6px solid transparent !important;
    border-radius:14px;
    padding:0 12px;
    color:#5c6a7d;
    font-size:13.5px;
    font-weight:600;
    line-height:1.2;
    white-space:nowrap;
    background:transparent;
    background-clip:padding-box;
}
#result-wrapper .tab-navigation .nav-link:hover{color:#1f6fd0}
#result-wrapper .tab-navigation .nav-link::after{display:none !important}
#result-wrapper .tab-navigation .nav-link.active{
    background:#fff;
    color:#1f6fd0;
    box-shadow:inset 0 0 0 1px #e6ecf3;
}
#result-wrapper .tab-content{padding-top:26px}
#result-wrapper .tab-content .desc{
    max-width:78ch;
    font-size:15px;
    line-height:1.65;
    color:#3d4a5c;
}
#result-wrapper .tab-content .desc p{margin:0 0 14px}
#result-wrapper .tab-content .desc ul,
#result-wrapper .tab-content .desc ol{padding-left:20px;margin:0 0 16px}
#result-wrapper .tab-content .desc li{margin:0 0 6px}
#result-wrapper .tab-content .desc h2,
#result-wrapper .tab-content .desc h3,
#result-wrapper .tab-content .desc h4{
    margin:22px 0 10px;
    color:#121a26;
    line-height:1.25;
    letter-spacing:-.015em;
}
#result-wrapper .tab-content .desc h2{font-size:22px}
#result-wrapper .tab-content .desc h3{font-size:18px}
#result-wrapper .tab-content .desc h4{font-size:16px}
#result-wrapper .tab-content .desc strong{color:#121a26}
#tab-sb-daten .desc ul{
    list-style:none;
    margin:0;
    padding:0;
    max-width:640px;
    border-top:1px solid #e8edf3;
}
#tab-sb-daten .desc li{
    display:flex;
    justify-content:space-between;
    gap:28px;
    margin:0;
    padding:9px 0;
    border-bottom:1px solid #eef2f6;
}
#tab-sb-daten .desc li strong{font-weight:600;color:#5c6a7d;flex:0 0 auto}
#tab-sb-daten .desc li{text-align:right}
#result-wrapper .tab-content .btn-primary{
    background:#1f6fd0;
    border-color:#1f6fd0;
}
#result-wrapper .tab-content .btn-primary:hover,
#result-wrapper .tab-content .btn-primary:focus{
    background:#1a5fb4;
    border-color:#1a5fb4;
}
#result-wrapper .tab-content input[type="checkbox"],
#result-wrapper .tab-content input[type="radio"]{accent-color:#1f6fd0}

/* ---------- Responsive ---------- */
@media (max-width:991px){
    .sb-gallery{
        display:flex;
        flex-direction:column;
        gap:12px;
    }
    .sb-gallery-stage{order:1;min-height:0;aspect-ratio:1/1;border-radius:18px}
    .sb-gallery-thumbs{
        order:2;
        flex-direction:row;
        width:100%;
        max-width:100%;
        min-width:0;
        max-height:none;
        overflow-x:auto;
        overflow-y:hidden;
        padding:0 0 4px;
    }
    .sb-gallery-thumb{width:64px;flex:0 0 64px}
    .sb-gallery .product-actions{
        position:absolute;
        top:10px;
        left:10px;
        right:auto;
        margin:0;
        justify-content:flex-start;
        z-index:5;
    }
    .product-detail .product-info-inner.sb-buy-panel{
        margin-top:2px;
        padding:24px 22px;
        border-radius:16px;
    }
    .product-detail .product-buy .btn-primary .btn-basket-check{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:8px;
    }
    .product-detail .product-buy .btn-primary .btn-basket-check > span{display:inline !important}
    #result-wrapper .tab-navigation{margin-top:32px}
}

@media (max-width:600px){
    .sb-gallery-slide{padding:18px}
    .sb-gallery-slide img{max-height:none}
    .sb-gallery-arrow{width:36px;height:36px}
    .sb-gallery-prev{left:8px}
    .sb-gallery-next{right:8px}
    .sb-gallery-zoom{top:10px;right:10px;width:34px;height:34px;border-radius:10px}
    .sb-gallery-count{left:10px;bottom:10px}
    .product-detail .product-title{font-size:27px}
    .product-detail .price_wrapper .price{font-size:32px}
    #result-wrapper .tab-navigation .nav-tabs{height:47px}
    #result-wrapper .tab-navigation .nav-link{border-width:5px !important;padding:0 10px;font-size:13px}
}

@media (prefers-reduced-motion:reduce){
    .sb-gallery-track{transition:none}
}