/*
 Theme Name: Divi Child
 Theme URI: https://www.elegantthemes.com/gallery/divi/
 Description: Divi Child Theme
 Author: Stela Pavlova
 Author URI: https://www.elegantthemes.com
 Template: Divi
 Version: 1.0.11.1
*/
 
/* =Theme customization starts here
------------------------------------------------------- */
/*****Add any custom CSS below this line*****/

/* ==========================================================
   FILTER EVERYTHING Design
   ========================================================== */

/* 1. Шрифт и размер на филтрите — заглавия и опции */
.wpc-filter-title,
.wpc-filter-content,
.wpc-filter-content li.wpc-term-item,
.wpc-filter-content li.wpc-term-item label,
.wpc-filter-content li.wpc-term-item a,
.wpc-filter-content input,
.wpc-filter-content select {
    font-family: 'Poiret One', sans-serif !important;
    font-size: 15px !important;
}

/* 2. По-малко разстояние между отделните филтри */
.wpc-filters-section {
    margin-bottom: 12px !important; /* по подразбиране е 32px */
}
/* Бутони на количка и checkout страници */
.wc-block-components-button.contained {
  background-color: #32373C !important;
  color: #ffffff !important;
  padding: 14px 24px !important;
  border-radius: 0 !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
.wc-block-components-button.contained:hover {
  background-color: #1e2124 !important;
  color: #ffffff !important;
}
/* CLS fix - marki logos grid */ .page-id-5385 .et_pb_image_wrap img { aspect-ratio: 1 / 1; }

/* Checkout Page Styling */
body.woocommerce-checkout .entry-title {
  text-align: center;
  text-transform: uppercase;
}
#customer_details input[type="text"],
#customer_details input[type="email"],
#customer_details input[type="tel"],
#customer_details input[type="password"],
#customer_details textarea,
#customer_details .select2-selection {
  background-color: #fff;
  border: 1px solid rgba(32, 7, 7, 0.8);
  border-radius: 4px;
  padding: 8px 12px;
  height: auto;
  box-shadow: none;
}

#customer_details .select2-selection {
  height: 38px;
  display: flex;
  align-items: center;
  padding: 0 12px;
}

#customer_details .select2-selection__rendered {
  padding-left: 0;
  line-height: normal;
}

#customer_details input[type="text"]:focus,
#customer_details input[type="email"]:focus,
#customer_details input[type="tel"]:focus,
#customer_details textarea:focus {
  border-color: #5B477C;
  outline: none;
}
/* Съобщения (success/info/error) - четим фон и текст навсякъде на сайта */
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
	font-size: 16px !important;
	color: #515151 !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}
.woocommerce-error a,
.woocommerce-info a,
.woocommerce-message a {
	color: var(--gcid-link-color, #2f6f73) !important;
}
/* Cart Page Styling */
/* 1. Заглавие "Количка" - центрирано и с главни букви, като на чекаута */
body.woocommerce-cart .entry-title.main_title {
	text-align: center;
	text-transform: uppercase;
}

/* 2 + 4. Поле за количество и поле за промо код - без сив фон */
.woocommerce-cart-form input.qty,
.woocommerce-cart-form #coupon_code {
	background-color: transparent !important;
}

/* 4. Полето за промо код - само рамка отдолу */
.woocommerce-cart-form #coupon_code {
	border: none;
	border-bottom: 1px solid #cfc8d8;
	border-radius: 0;
}

/* 3. Бутон "Обновяване на количката" - унифициран с дефолтния бутон на сайта */
.woocommerce-cart-form button[name="update_cart"] {
	background-color: rgb(50, 55, 60) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 4.2px 14px !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	font-family: "Google Sans", sans-serif;
	opacity: 1 !important;
}
.woocommerce-cart-form button[name="update_cart"]:disabled {
	opacity: 0.5 !important;
	cursor: not-allowed;
}

/* 5. Унифициране на padding-а на промо код полето с бутона до него */
.woocommerce-cart-form .coupon {
	display: flex;
	align-items: center;
	gap: 8px;
}
.woocommerce-cart-form .coupon #coupon_code {
	padding: 4.2px 14px;
	box-sizing: border-box;
}

/* Мобилен изглед - полето и бутонът за промо код се подреждат едно под друго,
   за да не се пренася текстът на бутона и да няма струпване с грешки */
@media (max-width: 480px) {
	.woocommerce-cart-form .coupon {
		flex-direction: column;
		align-items: stretch;
	}
	.woocommerce-cart-form .coupon #coupon_code,
	.woocommerce-cart-form .coupon button[name="apply_coupon"] {
		width: 100% !important;
	}
}
/* ==========================================================
   SIZE CHARTS — общи стилове за всички марки (атрибутни селектори)
   ========================================================== */

/* 1. Основни контейнери за таблиците */
div[class$="-size-chart"]{
    width:100%;
    max-width:100%;
    margin:0 0 30px;
    padding:0;
    box-sizing:border-box;
}

/* 2. Заглавия на таблиците — H2 */
[class$="-size-chart__title"]{
    width:100%;
    margin:0 0 12px;
    padding:0;
    text-align:center;
    font-family:"Poiret One",sans-serif;
    font-size:18px;
    font-weight:700;
    line-height:1.3;
    color:#655188;
}

/* 3. Хоризонтален скрол — table-wrap е директен scroll контейнер за марки БЕЗ картинка;
      __scroll е контейнерът за марки С картинка (обвива картинка+таблица заедно) */
div[class$="-size-chart"] > [class$="-size-chart__table-wrap"],
[class$="-size-chart__scroll"]{
    width:100%;
    max-width:100%;
    margin:0;
    padding:0;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    box-sizing:border-box;
}

/* 4. Марки с картинка — картинка и таблица една до друга (merle, malinami, aarre) */
[class$="-size-chart__content"]{
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    width:100%;
    min-width:760px;
}
[class$="-size-chart__image"]{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 18%;
    aspect-ratio:1/1;
    padding:5px 22px 5px 5px;
    box-sizing:border-box;
}
[class$="-size-chart__image"] img{
    display:block;
    width:100%;
    height:100%;
    max-width:220px;
    max-height:220px;
    aspect-ratio:1/1;
    object-fit:contain;
}
[class$="-size-chart__content"] > [class$="-size-chart__table-wrap"]{
    flex:1 1 auto;
    min-width:0;
}

/* 5. Основни настройки на всички таблици */
table[class*="-size-chart__table"]{
    width:100%;
    margin:0;
    padding:0;
    border:0;
    border-collapse:collapse;
    border-spacing:0;
    table-layout:auto;
    font-family:"Google Sans",sans-serif;
    font-size:16px;
    line-height:1.35;
    color:#2f2f2f;
    box-sizing:border-box;
}

/* 6. Клетки */
table[class*="-size-chart__table"] th,
table[class*="-size-chart__table"] td{
    padding:10px 8px;
    text-align:left;
    vertical-align:middle;
    border:0!important;
    box-sizing:border-box;
}

/* 7. Заглавен ред — бял */
table[class*="-size-chart__table"] thead th{
    background:#fff!important;
    font-weight:700;
    color:#262626;
}

/* 8. Редуване на редовете — сив, бял
      (Slug&Snails хоризонталната таблица е изключена нарочно —
      тя си има собствени, по-специфични правила в секция 10) */
table[class*="-size-chart__table"]:not([class*="slug-snails-size-chart__table--horizontal"]) tbody tr:nth-child(odd) td{
    background:#f1f1f1!important;
}
table[class*="-size-chart__table"]:not([class*="slug-snails-size-chart__table--horizontal"]) tbody tr:nth-child(even) td{
    background:#fff!important;
}

/* 9. Без пренасяне на текст на desktop */
@media(min-width:768px){
    table[class*="-size-chart__table"] th,
    table[class*="-size-chart__table"] td{
        white-space:nowrap;
    }
}

/* 10. Slug&Snails — хоризонтална таблица за чорапогащници */
.slug-snails-size-chart__table--horizontal{
    min-width:1100px;
    table-layout:fixed;
}
.slug-snails-size-chart__table--horizontal th{
    width:90px;
    font-weight:700;
    color:#262626;
    background:#fff!important;
}
.slug-snails-size-chart__table--horizontal tbody tr:first-child td{
    background:#fff!important;
}
.slug-snails-size-chart__table--horizontal tbody tr:nth-child(2) td{
    background:#f1f1f1!important;
}
.slug-snails-size-chart__table--horizontal tbody tr:nth-child(2) th{
    background:#f1f1f1!important;
}

/* 11. PaaPii — хоризонтална таблица за шапки */
.paapii-size-chart__table--horizontal{
    table-layout:fixed;
}

/* 12. Мобилна версия */
@media(max-width:767px){
    [class$="-size-chart__title"]{
        margin-bottom:10px;
        font-size:17px;
        font-weight:700;
    }

    [class$="-size-chart__content"]{
        min-width:680px;
    }

    [class$="-size-chart__image"]{
        flex:0 0 130px;
        width:130px;
        height:130px;
        padding:5px 12px 5px 5px;
    }

    [class$="-size-chart__image"] img{
        width:115px;
        height:115px;
        max-width:115px;
        max-height:115px;
    }

    /* Минималните широчини остават по бранд — зависят от броя/съдържанието на колоните */
    .merle-size-chart__table,.malinami-size-chart__table,.aarre-size-chart__table{
        min-width:530px;
    }

    .frugi-size-chart__table{
        min-width:760px;
    }

    .slug-snails-size-chart__table{
        min-width:530px;
    }

    .slug-snails-size-chart__table--horizontal{
        min-width:1100px;
    }

    .lilly-sid-size-chart__table,.paapii-size-chart__table,.piccalilly-size-chart__table{
        min-width:650px;
    }

    .paapii-size-chart__table--horizontal{
        min-width:600px;
    }

    .alba-size-chart__table{
        min-width:720px;
    }

    .turtledove-size-chart__table--wide-headings{
        min-width:400px;
    }

    .turtledove-size-chart__table--wide-headings th:nth-child(1){
        width:18%;
    }

    .turtledove-size-chart__table--wide-headings th:nth-child(2),
    .turtledove-size-chart__table--wide-headings th:nth-child(3){
        width:27%;
    }

    .turtledove-size-chart__table--wide-headings th:nth-child(4){
        width:28%;
    }

    table[class*="-size-chart__table"]{
        font-size:13px;
    }

    table[class*="-size-chart__table"] th,
    table[class*="-size-chart__table"] td{
        padding:8px 7px;
        white-space:nowrap;
    }
}
/* ==========================================================
   PRODUCT PAGE — Price & Star Rating Color Fix
   Overrides Divi core default (#F4F4F4) that made price
   and star rating nearly invisible on white background
   ========================================================== */
.woocommerce div.product span.price,
.woocommerce-page div.product span.price,
.woocommerce .star-rating span:before {
  color: #262626 !important;
}
/* ==========================================================
   VARIATION SWATCHES - CENTERED
   ========================================================== */
.single-product .variable-items-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px !important;
}