/* Product tabs and reviews.
   Everything below the product summary was left to WooCommerce's own stylesheet:
   grey rounded folder tabs, browser-default fields, a grey system button — and,
   in the review form, a label sitting on the box it belongs to rather than above
   it. This file gives that whole block the shop's own language: a hairline rule
   with lettered tabs, a measured column of text, and one card for the form. */

/* ---------- Tabs ---------- */
.woocommerce div.product .woocommerce-tabs{margin-top:78px}
.woocommerce div.product .woocommerce-tabs ul.tabs{
    display:flex;
    flex-wrap:wrap;
    gap:0 36px;
    margin:0!important;
    padding:0!important;
    border-bottom:1px solid var(--line);
    overflow:visible;
    list-style:none;
}
/* WooCommerce draws the folder shape with three pseudo elements. */
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:none!important;
    box-shadow:none!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
    display:block;
    margin-bottom:-1px;
    padding:20px 0!important;
    border-bottom:2px solid transparent;
    color:var(--muted);
    font-size:10px;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
    text-decoration:none;
    transition:color .18s ease,border-color .18s ease;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{color:var(--ink)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--ink);border-bottom-color:var(--ink)}

/* ---------- Panels ---------- */
.woocommerce div.product .woocommerce-Tabs-panel{
    max-width:720px;
    padding:44px 0 20px;
    color:#444;
    font-size:13px;
    line-height:1.85;
}
.woocommerce div.product .woocommerce-Tabs-panel>h2{
    margin:0 0 20px;
    color:var(--ink);
    font-size:clamp(24px,3vw,34px);
    letter-spacing:-.045em;
    line-height:1.05;
}
.woocommerce div.product .woocommerce-Tabs-panel h3{margin:0 0 10px;color:var(--ink);font-size:13px;letter-spacing:.02em}
.woocommerce div.product .woocommerce-Tabs-panel p{margin:0 0 14px}
.woocommerce div.product .woocommerce-Tabs-panel ul{margin:0 0 14px;padding-left:18px}
.woocommerce div.product .woocommerce-Tabs-panel li{margin:0 0 6px}

/* Əlavə məlumat: the same quiet table the account pages use. */
.woocommerce div.product table.shop_attributes{width:100%;border:0;border-collapse:collapse}
.woocommerce div.product table.shop_attributes th,
.woocommerce div.product table.shop_attributes td{
    padding:15px 0;
    border-bottom:1px solid var(--line);
    background:none!important;
    font-style:normal;
    font-size:12px;
    text-align:left;
    vertical-align:top;
}
.woocommerce div.product table.shop_attributes th{width:190px;color:var(--ink);font-size:9px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.woocommerce div.product table.shop_attributes td p{margin:0;padding:0!important;color:#444}

/* ---------- Reviews ---------- */
.woocommerce div.product #reviews{max-width:720px}
.woocommerce #reviews h2.woocommerce-Reviews-title{margin:0 0 16px;color:var(--ink);font-size:clamp(24px,3vw,34px);letter-spacing:-.045em}
.woocommerce #reviews .woocommerce-noreviews{margin:0;color:var(--muted);font-size:12px}

.woocommerce #reviews #comments ol.commentlist{margin:0;padding:0;list-style:none}
.woocommerce #reviews #comments ol.commentlist li{margin:0 0 16px;padding:0;border:0;background:none}
.woocommerce #reviews #comments ol.commentlist li .comment_container{
    display:flex;
    gap:16px;
    padding:22px 24px;
    border:1px solid var(--line);
    background:var(--paper);
}
.woocommerce #reviews #comments ol.commentlist li img.avatar{position:static;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:50%;background:var(--soft)}
.woocommerce #reviews #comments ol.commentlist li .comment-text{margin:0;padding:0;border:0;border-radius:0}
.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta{margin:0 0 8px;color:var(--ink);font-size:11px;letter-spacing:.02em}
.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta time{color:var(--muted)}
.woocommerce #reviews #comments ol.commentlist li .comment-text p{color:#444;font-size:13px;line-height:1.8}

/* ---------- The form ---------- */
.woocommerce #review_form_wrapper{margin-top:30px}
.woocommerce #review_form #respond{padding:34px;border:1px solid var(--line);background:var(--paper)}
.woocommerce #review_form #respond .comment-reply-title{
    display:block;
    margin:0 0 6px;
    color:var(--ink);
    font-size:16px;
    font-weight:800;
    letter-spacing:-.02em;
}
.woocommerce #review_form #respond .comment-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin:0;
}
.woocommerce #review_form #respond .comment-form p{margin:0!important}
.woocommerce #review_form #respond .comment-notes,
.woocommerce #review_form #respond .comment-form-rating,
.woocommerce #review_form #respond .comment-form-comment,
.woocommerce #review_form #respond .comment-form-cookies-consent,
.woocommerce #review_form #respond .form-submit{grid-column:1/-1}
.woocommerce #review_form #respond .comment-notes{margin:-4px 0 0!important;color:var(--muted);font-size:11px;line-height:1.7}

/* The label always stands above its field, on its own line. */
.woocommerce #review_form #respond .comment-form label{
    display:block;
    margin:0 0 8px;
    color:var(--ink);
    font-size:9px;
    font-weight:800;
    letter-spacing:.09em;
    text-transform:uppercase;
}
.woocommerce #review_form #respond .comment-form .required{color:var(--red);font-weight:800}
.woocommerce #review_form #respond .comment-form input[type=text],
.woocommerce #review_form #respond .comment-form input[type=email],
.woocommerce #review_form #respond .comment-form input[type=url],
.woocommerce #review_form #respond .comment-form textarea,
.woocommerce #review_form #respond .comment-form select{
    box-sizing:border-box;
    width:100%;
    max-width:100%;
    padding:13px;
    border:1px solid var(--line);
    border-radius:0;
    background:#fff;
    color:var(--ink);
    font-family:inherit;
    font-size:13px;
    line-height:1.5;
}
.woocommerce #review_form #respond .comment-form textarea{min-height:132px;resize:vertical}
.woocommerce #review_form #respond .comment-form input:focus,
.woocommerce #review_form #respond .comment-form textarea:focus,
.woocommerce #review_form #respond .comment-form select:focus{border-color:var(--ink);outline:1px solid var(--ink)}

/* Stars: bigger, black, and clearly a control you can press. */
.woocommerce #review_form #respond .comment-form-rating label{margin-bottom:10px}
.woocommerce #review_form #respond p.stars{margin:0!important;font-size:19px;line-height:1}
.woocommerce #review_form #respond p.stars a{color:var(--ink)}
.woocommerce #review_form #respond p.stars:not(:hover) a::before{color:#c9c9c5}
.woocommerce #review_form #respond p.stars a:hover::before,
.woocommerce #review_form #respond p.stars a:hover~a::before{color:#c9c9c5}
.woocommerce #review_form #respond p.stars:hover a::before{color:var(--ink)}
.woocommerce #review_form #respond p.stars.selected a.active::before,
.woocommerce #review_form #respond p.stars.selected a:not(.active)::before{color:var(--ink)}
.woocommerce #review_form #respond p.stars.selected a.active~a::before{color:#c9c9c5}

.woocommerce #review_form #respond .comment-form-cookies-consent{display:flex;align-items:flex-start;gap:10px}
.woocommerce #review_form #respond .comment-form-cookies-consent input{margin:2px 0 0;flex:none}
.woocommerce #review_form #respond .comment-form-cookies-consent label{
    margin:0;
    color:var(--muted);
    font-size:11px;
    font-weight:400;
    letter-spacing:0;
    text-transform:none;
    line-height:1.6;
}
.woocommerce #review_form #respond .form-submit{margin:4px 0 0!important}
.woocommerce #review_form #respond .form-submit input#submit{
    padding:16px 30px;
    border:0;
    border-radius:0;
    background:var(--ink);
    color:var(--paper);
    font-family:inherit;
    font-size:10px;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
    cursor:pointer;
    transition:background .2s ease;
}
.woocommerce #review_form #respond .form-submit input#submit:hover{background:#2b2b2b}

@media (max-width:782px){
    .woocommerce div.product .woocommerce-tabs{margin-top:46px}
    .woocommerce div.product .woocommerce-tabs ul.tabs{gap:0 22px}
    .woocommerce div.product .woocommerce-tabs ul.tabs li a{padding:16px 0!important;font-size:9px;letter-spacing:.1em}
    .woocommerce div.product .woocommerce-Tabs-panel{padding:30px 0 10px}
    .woocommerce #review_form #respond{padding:22px 18px}
    .woocommerce #review_form #respond .comment-form{grid-template-columns:1fr;gap:16px}
    .woocommerce div.product table.shop_attributes th{width:120px}
}
