/*
Theme Name: Anex Moda
Description: Butikowy motyw zintegrowany z WooCommerce.
Author: barmSTUDIO
Version: 1.0
Text Domain: anex-moda
*/

/* ==========================================================================
   KOLORYZACJA I DETALE (Przyciski, odznaki, komunikaty)
   ========================================================================== */

.woocommerce button.button, 
.woocommerce input.button, 
.woocommerce a.button,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.button.alt {
    background-color: #DDA7A5 !important;
    color: #ffffff !important;
    border-radius: 2px !important;
    padding: 12px 24px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-size: 12px !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

.woocommerce button.button:hover, 
.woocommerce input.button:hover, 
.woocommerce a.button:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce a.button.alt:hover {
    background-color: #B87A7D !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

.woocommerce span.onsale {
    background-color: #A64B55 !important;
    color: #ffffff !important;
    border-radius: 2px !important;
    padding: 6px 12px !important;
    min-height: auto !important;
    min-width: auto !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    line-height: 1 !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
}

.woocommerce-message, 
.woocommerce-info {
    border-top-color: #DDA7A5 !important;
    background-color: #FCFAFA !important;
    color: #2C2A29 !important;
}

.woocommerce-message::before, 
.woocommerce-info::before {
    color: #DDA7A5 !important;
}

.anex-card { overflow: hidden !important; }

/* Poprawka widocznej kreski – przesuń CTA 2px poza krawędź */
.anex-card { overflow: hidden !important; }

.anex-card__cta {
    transform: translateY(calc(100% + 2px)) !important;
}
.anex-card:hover .anex-card__cta {
    transform: translateY(0) !important;
}

/* ════════════════════════════════════════════════════════════════
   ANEX MODA × CookieYes – pełny custom CSS
   Wtyczka: CookieYes | GDPR Cookie Consent
   Wklej do: WP Admin → CookieYes → Appearance → Custom CSS
             LUB WP Admin → Wygląd → Dostosuj → Dodatkowy CSS
   ════════════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════
   SEKCJA 1 – PASEK ZGODY (notice bar)
   ══════════════════════════════════════════════════════════════ */

.cky-consent-container.cky-box-bottom-left {
    left:      24px !important;
    bottom:    24px !important;
    max-width: 390px !important;
    width:     calc(100vw - 48px) !important;
    z-index:   99999 !important;
}

.cky-consent-bar {
    background-color: #FCFAFA !important;
    border:           1px solid #F0E4E5 !important;
    border-radius:    3px !important;
    padding:          22px 24px 20px !important;
    box-shadow:       0 8px 32px rgba(44,42,41,.10),
                      0 2px 8px  rgba(44,42,41,.06) !important;
    font-family:      'Inter', sans-serif !important;
}

/* Tytuł paska */
.cky-consent-bar .cky-title {
    font-family:  'Playfair Display', serif !important;
    font-size:    16px   !important;
    font-weight:  400    !important;
    font-style:   normal !important;
    color:        #2C2A29 !important;
    line-height:  1.3    !important;
    margin:       0 0 10px !important;
}

/* Opis paska */
.cky-consent-bar .cky-notice-des p {
    font-family: 'Inter', sans-serif !important;
    font-size:   12px !important;
    font-weight: 400  !important;
    line-height: 1.75 !important;
    color:       #7a7876 !important;
    margin:      0 0 18px !important;
}

/* Link "Dowiedz się więcej" w opisie */
.cky-consent-bar .cky-notice-des a {
    color:           #B87A7D !important;
    text-decoration: underline !important;
    text-decoration-color: #F0E4E5 !important;
}
.cky-consent-bar .cky-notice-des a:hover {
    color:                 #A64B55 !important;
    text-decoration-color: #DDA7A5 !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 2 – PRZYCISKI (wspólne + indywidualne)
   ══════════════════════════════════════════════════════════════ */

.cky-btn {
    font-family:    'Inter', sans-serif !important;
    font-size:      9px    !important;
    font-weight:    700    !important;
    text-transform: uppercase !important;
    letter-spacing: .14em  !important;
    border-radius:  2px    !important;
    padding:        10px 18px !important;
    cursor:         pointer !important;
    border-width:   1px    !important;
    border-style:   solid  !important;
    line-height:    1      !important;
    white-space:    nowrap !important;
    transition:     background .22s cubic-bezier(.25,.1,.25,1),
                    color      .22s cubic-bezier(.25,.1,.25,1),
                    border-color .22s cubic-bezier(.25,.1,.25,1),
                    transform    .22s cubic-bezier(.25,.1,.25,1) !important;
}
.cky-btn:hover  { transform: translateY(-1px) !important; }
.cky-btn:active { transform: translateY(0)    !important; }
.cky-btn:focus-visible {
    outline:        2px solid #B87A7D !important;
    outline-offset: 3px !important;
}

/* Akceptuj wszystko – primary CTA */
.cky-btn-accept {
    color:            #FFFFFF !important;
    background-color: #2C2A29 !important;
    border-color:     #2C2A29 !important;
}
.cky-btn-accept:hover {
    background-color: #B87A7D !important;
    border-color:     #B87A7D !important;
    color:            #FFFFFF !important;
}

/* Odrzuć wszystkie – ghost */
.cky-btn-reject {
    color:            #2C2A29 !important;
    background-color: transparent !important;
    border-color:     #D4C8C8 !important;
}
.cky-btn-reject:hover {
    color:            #A64B55 !important;
    border-color:     #DDA7A5 !important;
    background-color: #FAF5F5 !important;
}

/* Dostosuj – text link */
.cky-btn-customize {
    color:            #B0A5A5 !important;
    background-color: transparent !important;
    border-color:     transparent !important;
    padding-left:     4px !important;
    padding-right:    4px !important;
}
.cky-btn-customize:hover {
    color:            #B87A7D !important;
    border-color:     transparent !important;
    background-color: transparent !important;
}

/* Zapisz ustawienia (w modal) */
.cky-btn-preferences-save,
.cky-prefbar-btn-accept {
    color:            #FFFFFF !important;
    background-color: #2C2A29 !important;
    border-color:     #2C2A29 !important;
}
.cky-btn-preferences-save:hover,
.cky-prefbar-btn-accept:hover {
    background-color: #B87A7D !important;
    border-color:     #B87A7D !important;
}

/* Wrapper przycisków paska */
.cky-notice-btn-wrapper {
    display:     flex  !important;
    flex-wrap:   wrap  !important;
    gap:         8px   !important;
    align-items: center !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 3 – MODAL PREFERENCJI (okienko ustawień)
   ══════════════════════════════════════════════════════════════ */

/* Overlay */
.cky-overlay {
    background: rgba(44,42,41,.45) !important;
    backdrop-filter: blur(2px)     !important;
}

/* Box modalu */
.cky-modal,
.cky-preference-wrapper {
    background-color: #FCFAFA  !important;
    border:           1px solid #F0E4E5 !important;
    border-radius:    3px !important;
    box-shadow:       0 24px 64px rgba(44,42,41,.16),
                      0 4px  16px rgba(44,42,41,.08) !important;
    font-family:      'Inter', sans-serif !important;
    max-width:        680px !important;
}

/* Header modalu */
.cky-modal-header,
.cky-preference-header {
    background-color: #FCFAFA !important;
    border-bottom:    1px solid #F0E4E5 !important;
    padding:          22px 28px !important;
}

.cky-modal-header .cky-title,
.cky-preference-header .cky-title,
.cky-preference-wrapper .cky-title {
    font-family:  'Playfair Display', serif !important;
    font-size:    20px !important;
    font-weight:  400  !important;
    color:        #2C2A29 !important;
    margin:       0 0 6px !important;
}

.cky-modal-header p,
.cky-preference-header p {
    font-size:   12px !important;
    color:       #9c8f8e !important;
    line-height: 1.7 !important;
    margin:      0 !important;
}

/* Przycisk zamknij (X) */
.cky-modal-close,
.cky-preference-close,
[data-cky-tag="modal-close"] {
    color:            #C0B9B7 !important;
    background:       transparent !important;
    border:           none !important;
    border-radius:    2px !important;
    transition:       color .2s !important;
    padding:          4px !important;
}
.cky-modal-close:hover,
.cky-preference-close:hover {
    color: #B87A7D !important;
}
.cky-modal-close svg path,
.cky-preference-close svg path {
    stroke: currentColor !important;
}

/* Obszar przewijalny */
.cky-modal-content,
.cky-preference-content {
    padding:    0 !important;
    max-height: 60vh !important;
    overflow-y: auto !important;
    scrollbar-width: thin !important;
    scrollbar-color: #DDA7A5 #F5EEEE !important;
}
.cky-modal-content::-webkit-scrollbar,
.cky-preference-content::-webkit-scrollbar {
    width: 4px !important;
}
.cky-modal-content::-webkit-scrollbar-thumb,
.cky-preference-content::-webkit-scrollbar-thumb {
    background: #DDA7A5 !important;
    border-radius: 2px !important;
}

/* Footer modalu */
.cky-modal-footer,
.cky-preference-footer {
    background-color: #FCFAFA !important;
    border-top:       1px solid #F0E4E5 !important;
    padding:          16px 28px !important;
    display:          flex !important;
    gap:              10px !important;
    align-items:      center !important;
    flex-wrap:        wrap  !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 4 – KATEGORIE COOKIES (accordion / tabs)
   ══════════════════════════════════════════════════════════════ */

/* Każda kategoria */
.cky-prefbar-item,
.cky-accordion-item,
[data-cky-tag="category-item"] {
    border-bottom: 1px solid #F0E4E5 !important;
    padding:       16px 28px !important;
}
.cky-prefbar-item:last-child,
.cky-accordion-item:last-child {
    border-bottom: none !important;
}

/* Nagłówek kategorii (klikalny) */
.cky-prefbar-item-title,
.cky-accordion-header,
[data-cky-tag="category-title"] {
    font-family:  'Inter', sans-serif !important;
    font-size:    11px !important;
    font-weight:  700  !important;
    text-transform: uppercase !important;
    letter-spacing: .12em !important;
    color:        #2C2A29 !important;
    cursor:       pointer !important;
    display:      flex !important;
    align-items:  center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    background: transparent !important;
    border: none !important;
    width: 100% !important;
    padding: 0 !important;
    transition: color .18s !important;
}
.cky-prefbar-item-title:hover,
.cky-accordion-header:hover {
    color: #B87A7D !important;
}

/* Chevron ikona */
.cky-accordion-chevron svg path,
.cky-prefbar-item-title svg path {
    stroke: #C0B9B7 !important;
    transition: stroke .18s !important;
}
.cky-prefbar-item-title:hover svg path,
.cky-accordion-header:hover svg path {
    stroke: #B87A7D !important;
}

/* Opis kategorii */
.cky-prefbar-item-des,
.cky-accordion-body p,
[data-cky-tag="category-description"] {
    font-size:   12px !important;
    color:       #7a7876 !important;
    line-height: 1.7   !important;
    margin:      8px 0 0 !important;
    font-weight: 400 !important;
}

/* Link "Zawsze aktywne" */
.cky-always-active {
    font-family:    'Inter', sans-serif !important;
    font-size:      9px  !important;
    font-weight:    700  !important;
    text-transform: uppercase !important;
    letter-spacing: .12em !important;
    color:          #B87A7D !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 5 – TOGGLE (przełącznik włącz/wyłącz)
   ══════════════════════════════════════════════════════════════ */

/* Track (tło przełącznika) */
.cky-switch,
.cky-switch-wrapper {
    flex-shrink: 0 !important;
}

.cky-switch input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position:   relative !important;
    width:      40px   !important;
    height:     22px   !important;
    background: #E2D9D9 !important;
    border-radius: 11px !important;
    cursor:     pointer !important;
    transition: background .22s !important;
    outline:    none !important;
    flex-shrink: 0 !important;
}

/* Kółko (knob) */
.cky-switch input[type="checkbox"]::after {
    content:    '' !important;
    position:   absolute !important;
    width:      16px   !important;
    height:     16px   !important;
    top:        3px    !important;
    left:       3px    !important;
    background: #FFFFFF !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 4px rgba(44,42,41,.18) !important;
    transition: left .22s cubic-bezier(.25,.1,.25,1) !important;
}

/* Stan włączony */
.cky-switch input[type="checkbox"]:checked {
    background: #2C2A29 !important;
}
.cky-switch input[type="checkbox"]:checked::after {
    left: 21px !important;
}

/* Hover */
.cky-switch input[type="checkbox"]:hover {
    background: #C0B9B7 !important;
}
.cky-switch input[type="checkbox"]:checked:hover {
    background: #B87A7D !important;
}

/* Focus ring */
.cky-switch input[type="checkbox"]:focus-visible {
    box-shadow: 0 0 0 3px rgba(184,122,125,.3) !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 6 – TABELA SZCZEGÓŁÓW COOKIES
   ══════════════════════════════════════════════════════════════ */

.cky-audit-table-wrapper {
    margin-top:    14px !important;
    border:        1px solid #F0E4E5 !important;
    border-radius: 3px !important;
    overflow:      hidden !important;
    overflow-x:    auto !important;
}

.cky-audit-table {
    width:           100% !important;
    border-collapse: collapse !important;
    font-family:     'Inter', sans-serif !important;
    font-size:       11px !important;
}

/* Nagłówki tabeli */
.cky-audit-table thead tr,
.cky-audit-table th {
    background-color: #F8F2F2 !important;
    border-bottom:    1px solid #F0E4E5 !important;
}

.cky-audit-table th {
    font-size:      9px    !important;
    font-weight:    700    !important;
    text-transform: uppercase !important;
    letter-spacing: .12em  !important;
    color:          #2C2A29 !important;
    padding:        9px 14px !important;
    white-space:    nowrap  !important;
    text-align:     left    !important;
}

/* Wiersze */
.cky-audit-table td {
    padding:     8px 14px !important;
    color:       #4a4746  !important;
    font-size:   11px     !important;
    line-height: 1.5      !important;
    border-bottom: 1px solid #F8F2F2 !important;
    vertical-align: top !important;
}
.cky-audit-table tr:last-child td {
    border-bottom: none !important;
}
.cky-audit-table tbody tr:hover td {
    background: #FAF7F7 !important;
}

/* Link w tabeli */
.cky-audit-table a {
    color: #B87A7D !important;
    text-decoration: underline !important;
    text-decoration-color: #F0E4E5 !important;
}
.cky-audit-table a:hover {
    color: #A64B55 !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 7 – PRZYCISK PONOWNEGO OTWARCIA (floating icon)
   ══════════════════════════════════════════════════════════════ */

.cky-revisit-bottom-left,
.cky-revisit-bottom-right,
[data-cky-tag="revisit-consent"] {
    background-color: #2C2A29 !important;
    border-radius:    2px !important;
    width:            38px !important;
    height:           38px !important;
    display:          flex !important;
    align-items:      center !important;
    justify-content:  center !important;
    bottom:           24px !important;
    box-shadow:       0 4px 16px rgba(44,42,41,.22) !important;
    transition:       background .22s, transform .22s !important;
    cursor:           pointer !important;
}
.cky-revisit-bottom-left  { left:  24px !important; }
.cky-revisit-bottom-right { right: 24px !important; }

[data-cky-tag="revisit-consent"]:hover {
    background-color: #B87A7D !important;
    transform:        scale(1.08) !important;
}

[data-cky-tag="revisit-consent"] svg path,
[data-cky-tag="revisit-consent"] img {
    filter: brightness(10) !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 8 – PASEK PREFERENCJI (mini-bar po częściowej zgodzie)
   ══════════════════════════════════════════════════════════════ */

.cky-prefbar,
[data-cky-tag="preferences-bar"] {
    background-color: #FCFAFA !important;
    border-top:       1px solid #F0E4E5 !important;
    padding:          14px 24px !important;
    font-family:      'Inter', sans-serif !important;
    box-shadow:       0 -4px 24px rgba(44,42,41,.07) !important;
}

.cky-prefbar-title,
[data-cky-tag="preferences-bar"] .cky-title {
    font-family: 'Playfair Display', serif !important;
    font-size:   15px !important;
    font-weight: 400  !important;
    color:       #2C2A29 !important;
    margin:      0 0 4px !important;
}

.cky-prefbar p {
    font-size:   12px !important;
    color:       #9c8f8e !important;
    margin:      0 !important;
}


/* ══════════════════════════════════════════════════════════════
   SEKCJA 9 – MOBILE (≤ 599px)
   ══════════════════════════════════════════════════════════════ */

@media (max-width: 599px) {

    /* Pasek – full width, wyrasta z dołu */
    .cky-consent-container.cky-box-bottom-left,
    .cky-consent-container.cky-box-bottom-right {
        left:      0    !important;
        right:     0    !important;
        bottom:    0    !important;
        width:     100% !important;
        max-width: 100% !important;
    }
    .cky-consent-bar {
        border-radius:  3px 3px 0 0 !important;
        border-bottom:  none !important;
        padding:        20px 16px 16px !important;
    }

    /* Przyciski w kolumnie */
    .cky-notice-btn-wrapper {
        flex-direction: column !important;
    }
    .cky-btn {
        width:      100% !important;
        text-align: center !important;
        padding:    13px 18px !important;
    }

    /* Modal – pełna wysokość od dołu */
    .cky-modal,
    .cky-preference-wrapper {
        max-width:     100%  !important;
        width:         100%  !important;
        margin:        0     !important;
        border-radius: 3px 3px 0 0 !important;
        position:      fixed !important;
        bottom:        0    !important;
        left:          0    !important;
        right:         0    !important;
        max-height:    92vh !important;
        overflow-y:    auto !important;
    }
    .cky-modal-header,
    .cky-preference-header {
        padding: 18px 16px !important;
    }
    .cky-prefbar-item,
    .cky-accordion-item {
        padding: 14px 16px !important;
    }
    .cky-modal-footer,
    .cky-preference-footer {
        padding:        12px 16px !important;
        flex-direction: column !important;
    }
    .cky-modal-footer .cky-btn,
    .cky-preference-footer .cky-btn {
        width: 100% !important;
    }

    /* Revisit button */
    .cky-revisit-bottom-left,
    .cky-revisit-bottom-right {
        bottom: 16px !important;
        left:   16px !important;
        right:  auto !important;
    }
}

/* Anex Moda - Minimalistyczny Omnibus */
p.iworks-omnibus {
    font-size: 11px !important;
    color: #888888 !important;
    margin-top: 4px !important;
    margin-bottom: 16px !important;
    font-weight: 400 !important;
    letter-spacing: 0.2px !important;
    line-height: 1.4 !important;
}

p.iworks-omnibus .woocommerce-Price-amount {
    font-weight: 600 !important;
    color: #2C2A29 !important; /* Twój ciemny atramentowy kolor */
    margin-left: 3px !important;
}