/**
 * AJIT Catalog - frontend styles
 *
 * UWAGA: w v0.6.4 zmieniono strategie ukrywania.
 * Wczesniej ukrywalismy CALE kontenery (.product-add-to-cart, .product-quantity)
 * co tez ukrywalo nasz wlasny przycisk "Przejdz do sklepu" wstawiony w
 * displayProductActions (Hummingbird wstawia hook wewnatrz tego kontenera).
 *
 * Teraz ukrywamy tylko KONKRETNE elementy: button koszyka, input ilosci,
 * formularze list. Kontenery zostaja widoczne, dzieki czemu nasze
 * .ajitcatalog-actions sie pokazuja.
 */

/* === BADGE'Y (plusy / minusy / polecam) === */

.ajitcatalog-badges {
    margin: 16px 0;
}

.ajitcatalog-recommends {
    margin-bottom: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ajit-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 0.9em;
    line-height: 1.3;
    color: var(--ajit-color, #333);
}

.ajit-badge-recommend {
    background: linear-gradient(135deg, var(--ajit-color, #f39c12), color-mix(in srgb, var(--ajit-color, #f39c12) 70%, white));
    color: #fff;
    font-weight: 600;
}

.ajit-icon-fallback {
    display: inline-block;
    font-size: 1em;
    line-height: 1;
    font-style: normal;
    font-weight: bold;
    color: var(--ajit-color, currentColor);
}

.ajitcatalog-proscons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 16px 0;
}

.ajit-pros, .ajit-cons {
    padding: 12px 16px;
    border-radius: 6px;
    background: #fafafa;
}

.ajit-pros { border-left: 4px solid #4caf50; }
.ajit-cons { border-left: 4px solid #e53935; }

.ajit-proscons-heading {
    font-size: 1rem;
    margin: 0 0 10px 0;
    font-weight: 600;
}

.ajit-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ajit-list li {
    padding: 4px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 575px) {
    .ajitcatalog-proscons {
        grid-template-columns: 1fr;
    }
}

/* === PRZYCISK "PRZEJDZ DO SKLEPU" === */

.ajitcatalog-actions {
    /* Bezwzgledna widocznosc - nawet gdy parent kontener probuje ukryc */
    display: block !important;
    margin: 12px 0;
}

.ajitcatalog-external-btn {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

/* === HIDE PRICE - granular, tylko ceny === */

body.ajit-hide-price .product-prices,
body.ajit-hide-price .product__prices,
body.ajit-hide-price .product-price,
body.ajit-hide-price .product__price,
body.ajit-hide-price .price,
body.ajit-hide-price .current-price,
body.ajit-hide-price .has-discount .regular-price,
body.ajit-hide-price .product-discount,
body.ajit-hide-price .tax-shipping-delivery-label,
body.ajit-hide-price .product-list-actions .price,
body.ajit-hide-price .product-miniature .product-price-and-shipping,
body.ajit-hide-price .product-miniature__price,
body.ajit-hide-price .product-miniature__discount-price {
    display: none !important;
}

/* === HIDE CART - GRANULAR (only button + qty input, NOT containers) === */
/*
 * UWAGA: NIE ukrywamy .product-add-to-cart, .product-quantity, .product__actions-qty-add
 * - to sa kontenery, w ktorych Hummingbird i inne motywy wstawiaja
 * tez nasz przycisk "Przejdz do sklepu". Ukrycie ich ukryloby tez nas.
 *
 * Ukrywamy tylko KONKRETNE elementy: sam button "Add to cart" i input ilosci.
 */

/* Button "Add to cart" - rozne motywy */
body.ajit-hide-add-to-cart [data-button-action="add-to-cart"],
body.ajit-hide-add-to-cart .product__add-to-cart,
body.ajit-hide-add-to-cart .product__add-to-cart-button,
body.ajit-hide-add-to-cart .product-miniature__add,
body.ajit-hide-add-to-cart .add > .add-to-cart,
body.ajit-hide-add-to-cart button.add-to-cart,
body.ajit-hide-add-to-cart .product-list-actions .add {
    display: none !important;
}

/* Input ilosci + przyciski +/- */
body.ajit-hide-add-to-cart .quantity-button__group,
body.ajit-hide-add-to-cart .product-actions__quantity,
body.ajit-hide-add-to-cart .product__quantity,
body.ajit-hide-add-to-cart .product-quantity .qty,
body.ajit-hide-add-to-cart .product-quantity input[type="number"],
body.ajit-hide-add-to-cart #quantity_wanted,
body.ajit-hide-add-to-cart .product-miniature__form .quantity-button {
    display: none !important;
}

/* Wyjatek - jesli element jest naszym kontenerem .ajitcatalog-actions
   lub jego rodzicem, NIE ukrywamy. Override poprzednich regul: */
.ajitcatalog-actions,
.ajitcatalog-actions * {
    display: revert !important;
}
.ajitcatalog-actions {
    display: block !important;
}
.ajitcatalog-actions a {
    display: inline-flex !important;
}


/* === WIDGET GLOSOWANIA KLIENTOW (v0.7) === */

.ajitcatalog-vote {
    margin: 16px 0;
    padding: 12px 0;
}

.ajit-vote-buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: stretch;
}

.ajit-vote-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 6px;
    border: 1px solid #d0d0d0;
    background: #fff;
    color: #333;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.1s;
    line-height: 1.2;
}

.ajit-vote-btn:hover:not([disabled]) {
    background: #f5f5f5;
    border-color: #999;
}

.ajit-vote-btn[disabled] {
    cursor: not-allowed;
    opacity: 0.5;
}

.ajit-vote-btn.is-loading {
    cursor: wait;
    opacity: 0.7;
}

.ajit-vote-btn .ajit-vote-icon {
    font-size: 1em;
    line-height: 1;
}

.ajit-vote-btn .ajit-vote-count {
    font-weight: 600;
    margin-left: 4px;
    background: #f0f0f0;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.85em;
}

/* Active states - kazdy typ ma swoj kolor */

.ajit-vote-pro.is-active {
    background: #e8f5e9;
    border-color: #4caf50;
    color: #2e7d32;
}
.ajit-vote-pro.is-active .ajit-vote-count {
    background: #4caf50;
    color: #fff;
}

.ajit-vote-con.is-active {
    background: #ffebee;
    border-color: #e53935;
    color: #c62828;
}
.ajit-vote-con.is-active .ajit-vote-count {
    background: #e53935;
    color: #fff;
}

.ajit-vote-recommend.is-active {
    background: linear-gradient(135deg, #f39c12, #e67e22);
    border-color: #d68910;
    color: #fff;
    font-weight: 600;
}
.ajit-vote-recommend.is-active .ajit-vote-count {
    background: rgba(255,255,255,0.3);
    color: #fff;
}

.ajit-vote-login-prompt {
    margin: 0 0 8px 0;
    font-size: 0.85rem;
    color: #888;
}

.ajit-vote-login-prompt a {
    color: #1976d2;
    text-decoration: underline;
}

.ajit-vote-message {
    margin-top: 8px;
    font-size: 0.85rem;
    min-height: 1.2em;
}

.ajit-vote-message.is-success {
    color: #2e7d32;
}

.ajit-vote-message.is-error {
    color: #c62828;
}

@media (max-width: 575px) {
    .ajit-vote-btn {
        flex: 1 1 auto;
        justify-content: center;
    }
}


/* === LISTA LINKOW AFILACYJNYCH (v0.8) === */

.ajitcatalog-links-list {
    margin: 16px 0;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.ajitcatalog-links-heading {
    margin: 0;
    padding: 12px 16px;
    background: #f8f8f8;
    border-bottom: 1px solid #e0e0e0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #555;
}

.ajitcatalog-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ajitcatalog-link-item {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    border-bottom: 1px solid #eee;
    transition: background 0.15s;
}

.ajitcatalog-link-item:last-child {
    border-bottom: none;
}

.ajitcatalog-link-item:hover {
    background: #fafafa;
}

/* Pierwszy element - najnizsza cena - subtelne wyróżnienie */
.ajitcatalog-link-item:first-child {
    background: #f0f9ff;
    border-left: 3px solid #2196f3;
}

.ajitcatalog-link-item:first-child:hover {
    background: #e3f2fd;
}

.ajitcatalog-link-store {
    display: flex;
    align-items: center;
    min-width: 80px;
}

.ajitcatalog-link-logo {
    max-height: 32px;
    max-width: 120px;
    object-fit: contain;
}

.ajitcatalog-link-store-name {
    font-weight: 600;
    color: #333;
    font-size: 1rem;
}

.ajitcatalog-link-price {
    text-align: right;
    min-width: 100px;
}

.ajitcatalog-price {
    font-size: 1.15rem;
    font-weight: 700;
    color: #2196f3;
    white-space: nowrap;
}

.ajitcatalog-link-item:first-child .ajitcatalog-price {
    color: #1976d2;
    font-size: 1.25rem;
}

.ajitcatalog-price-na {
    color: #999;
    font-size: 0.9rem;
    font-style: italic;
}

.ajitcatalog-link-action {
    min-width: 90px;
}

.ajitcatalog-link-btn {
    text-decoration: none;
    white-space: nowrap;
}

@media (max-width: 575px) {
    .ajitcatalog-link-item {
        grid-template-columns: 1fr;
        gap: 8px;
        text-align: center;
    }
    .ajitcatalog-link-store, .ajitcatalog-link-price, .ajitcatalog-link-action {
        justify-content: center;
        text-align: center;
    }
}

/* === v0.14.1 - dane wpisu katalogowego (meta ze zgloszenia) === */
.ajitcatalog-entry-info {
    margin: 16px 0;
    padding: 14px 16px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background: #fafafa;
}
.ajitcatalog-entry-label {
    font-weight: 600;
    margin-right: 6px;
}
.ajitcatalog-entry-code {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.ajitcatalog-code-value {
    font-size: 1.1em;
    font-weight: 700;
    padding: 4px 10px;
    background: #fff;
    border: 1px dashed #999;
    border-radius: 4px;
    letter-spacing: 1px;
}
.ajitcatalog-entry-valid {
    color: #666;
    font-size: 0.9em;
}
.ajitcatalog-entry-contact {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ajitcatalog-entry-contact li {
    padding: 3px 0;
}

/* === v0.16 - pasek promowanych wpisow === */
.ajitcatalog-promoted-bar {
    margin: 16px 0 24px;
    padding: 16px;
    border: 1px solid #ffe082;
    border-radius: 10px;
    background: #fffdf5;
}
.ajitcatalog-promoted-heading {
    margin: 0 0 12px;
    font-weight: 700;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #8d6e00;
}
.ajitcatalog-promoted-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 12px;
}
.ajitcatalog-promoted-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 12px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s, border-color 0.15s;
}
.ajitcatalog-promoted-tile:hover {
    border-color: #ffc107;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    text-decoration: none;
}
.ajitcatalog-promoted-badge {
    position: absolute;
    top: 6px;
    left: 6px;
    font-size: 0.65em;
    font-weight: 700;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    background: #fff3cd;
    color: #8d6e00;
}
.ajitcatalog-promoted-badge.is-plus {
    background: #ffc107;
    color: #4e3c00;
}
.ajitcatalog-promoted-tile img {
    max-width: 100%;
    height: 110px;
    object-fit: cover;
    border-radius: 4px;
}
.ajitcatalog-promoted-noimg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 110px;
    font-size: 2em;
    color: #ffc107;
    background: #fafafa;
    border-radius: 4px;
}
.ajitcatalog-promoted-name {
    font-weight: 600;
    font-size: 0.9em;
    text-align: center;
}

/* === v0.20 - obserwowanie === */
.ajitcatalog-follow { margin:14px 0; padding:12px; border:1px solid #eee; border-radius:8px; background:#fafafa; position:relative; }
.ajitcatalog-follow-label { font-weight:600; font-size:0.85em; display:block; margin-bottom:8px; }
.ajitcatalog-follow-chips { display:flex; flex-wrap:wrap; gap:6px; }
.ajitcatalog-chip { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border:1px solid #ddd; border-radius:14px; background:#fff; cursor:pointer; font-size:0.85em; transition:all .15s; }
.ajitcatalog-chip:hover { border-color:#ffc107; }
.ajitcatalog-chip .ajitcatalog-chip-star { color:#ccc; }
.ajitcatalog-chip.is-on { background:#fff3cd; border-color:#ffc107; }
.ajitcatalog-chip.is-on .ajitcatalog-chip-star { color:#ffc107; }
.ajitcatalog-follow-pop { margin-top:10px; padding:10px; border:1px solid #ffe082; border-radius:6px; background:#fffdf5; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.ajitcatalog-follow-pop input[type="number"] { width:80px; }

/* === v0.21.3 - popover obserwowania (dymek przy chipie) === */
.ajitcatalog-follow { position: relative; }
.ajitcatalog-popover {
    position: absolute;
    z-index: 1050;
    min-width: 240px;
    max-width: 300px;
    padding: 14px 14px 12px;
    background: #fff;
    border: 1px solid #e6c200;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.ajitcatalog-popover::before {
    content: "";
    position: absolute;
    top: -7px;
    left: var(--ajit-arrow-left, 24px);
    width: 12px; height: 12px;
    background: #fff;
    border-left: 1px solid #e6c200;
    border-top: 1px solid #e6c200;
    transform: rotate(45deg);
}
.ajitcatalog-popover-close {
    position: absolute; top: 4px; right: 8px;
    border: 0; background: none; font-size: 1.3em; line-height: 1;
    color: #999; cursor: pointer; padding: 2px 4px;
}
.ajitcatalog-popover-close:hover { color: #333; }
.ajitcatalog-popover-title { margin: 0 0 8px; font-weight: 700; font-size: .9em; padding-right: 16px; }
.ajitcatalog-popover-label { display: block; font-size: .85em; margin-bottom: 4px; font-weight: 400; }
.ajitcatalog-minplus-value { color: #b8860b; font-size: 1.1em; }
.ajitcatalog-popover input[type="range"] {
    width: 100%; accent-color: #ffc107; margin: 2px 0 10px; cursor: pointer;
}
.ajitcatalog-popover-actions { display: flex; gap: 8px; }
.ajitcatalog-follow-msg { display: block; margin-top: 6px; font-size: .82em; color: #555; }
.ajitcatalog-chip { position: relative; }
.ajitcatalog-chip-toast {
    position: absolute; top: -26px; left: 50%; transform: translateX(-50%);
    background: #2e7d32; color: #fff; font-size: .75em; padding: 3px 8px;
    border-radius: 4px; white-space: nowrap; pointer-events: none;
    animation: ajitToast 1.8s ease forwards;
}
@keyframes ajitToast {
    0% { opacity: 0; transform: translateX(-50%) translateY(4px); }
    15%, 75% { opacity: 1; transform: translateX(-50%) translateY(0); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-4px); }
}

/* === v0.22 - bańka one-click + dzwonek === */
.ajitcatalog-chip-bell { font-size: .95em; }
.ajitcatalog-chip.is-on .ajitcatalog-chip-bell { filter: none; }
.ajitcatalog-chip:not(.is-on) .ajitcatalog-chip-bell { filter: grayscale(1) opacity(.55); }
.ajitcatalog-bubble {
    position: absolute; z-index: 1050;
    min-width: 200px; max-width: 280px;
    padding: 10px 12px;
    background: #fff; border: 1px solid #e6c200; border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
    font-size: .88em;
}
.ajitcatalog-bubble::before {
    content: ""; position: absolute; top: -7px; left: var(--ajit-arrow-left, 24px);
    width: 12px; height: 12px; background: #fff;
    border-left: 1px solid #e6c200; border-top: 1px solid #e6c200;
    transform: rotate(45deg);
}
.ajitcatalog-bubble-text { display: block; font-weight: 600; margin-bottom: 4px; }
.ajitcatalog-bubble-link { font-size: .92em; }

/* === v0.22.1 - widocznosc przez klasy (odpornosc na CSP bez unsafe-inline) === */
.ajitcatalog-bubble { display: none; }
.ajitcatalog-bubble.is-open { display: block; }
.ajitcatalog-bubble-link.is-hidden { display: none; }
.ajitcatalog-report-form { display: none; margin-top: 8px; }
.ajitcatalog-report-form.is-open { display: block; }
.ajitcatalog-report-form.is-sent .ajitcatalog-report-reason,
.ajitcatalog-report-form.is-sent .ajitcatalog-report-send { display: none; }

/* === v0.23 - alerty na tablicy === */
.ajit-wall-alerts { margin: 0 0 18px; padding: 12px 14px; border: 1px solid #ffe082; border-radius: 10px; background: #fffdf5; }
.ajit-wall-alerts-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
.ajit-wall-alerts-list { list-style: none; margin: 0; padding: 0; }
.ajit-wall-alerts-list li { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; border-top: 1px dashed #f0e0a0; font-size: .92em; }
.ajit-wall-alert-date { color: #999; white-space: nowrap; font-size: .88em; }

/* === v0.24 - Swipe okazji === */
.ajit-swipe-page { max-width: 480px; margin: 0 auto; }
.ajit-swipe-tabs { display: flex; gap: 8px; justify-content: center; margin-bottom: 16px; }
.ajit-swipe-stage { position: relative; height: 480px; }
.ajit-swipe-stack { position: relative; width: 100%; height: 100%; }
.ajit-card {
    position: absolute; inset: 0;
    background: #fff; border: 1px solid #e5e5e5; border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
    overflow: hidden; cursor: grab; user-select: none;
    touch-action: none; display: flex; flex-direction: column;
    transition: transform .25s ease, opacity .25s ease;
}
.ajit-card.is-dragging { transition: none; cursor: grabbing; }
.ajit-card:nth-last-child(2) { transform: scale(.96) translateY(10px); }
.ajit-card:nth-last-child(3) { transform: scale(.92) translateY(20px); }
.ajit-card-img { flex: 1; min-height: 0; background: #f6f6f6; display: flex; align-items: center; justify-content: center; }
.ajit-card-img img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.ajit-card-noimg { font-size: 4em; color: #ddd; }
.ajit-card-body { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 14px 16px; }
.ajit-card-name { font-weight: 700; font-size: 1.05em; }
.ajit-card-comments { color: #777; font-size: .9em; white-space: nowrap; }
.ajit-card-badge {
    position: absolute; top: 18px; font-size: 1.6em; padding: 6px 12px;
    border-radius: 10px; border: 3px solid; background: rgba(255,255,255,.92);
    opacity: 0; transform: rotate(-12deg); transition: opacity .12s;
}
.ajit-badge-like { left: 14px; border-color: #2e7d32; }
.ajit-badge-nope { right: 14px; border-color: #c62828; transform: rotate(12deg); }
.ajit-badge-buy { left: 50%; top: auto; bottom: 18px; transform: translateX(-50%); border-color: #b8860b; }
.ajit-card.hint-like .ajit-badge-like,
.ajit-card.hint-nope .ajit-badge-nope,
.ajit-card.hint-buy .ajit-badge-buy { opacity: 1; }
.ajit-card.is-leaving { pointer-events: none; opacity: 0; }
.ajit-card.leave-like { transform: translate(140%, -20px) rotate(18deg) !important; }
.ajit-card.leave-dislike { transform: translate(-140%, -20px) rotate(-18deg) !important; }
.ajit-card.leave-buy { transform: translateY(130%) scale(.9) !important; }
.ajit-swipe-empty { display: none; position: absolute; inset: 0; text-align: center;
    padding-top: 35%; border: 2px dashed #e5e5e5; border-radius: 16px; }
.ajit-swipe-empty.is-visible { display: block; }
.ajit-swipe-actions { display: flex; justify-content: center; gap: 22px; margin-top: 18px; }
.ajit-swipe-btn {
    width: 64px; height: 64px; border-radius: 50%; border: 2px solid #e0e0e0;
    background: #fff; font-size: 1.5em; cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.1); transition: transform .1s, border-color .1s;
}
.ajit-swipe-btn:hover { transform: scale(1.08); }
.ajit-swipe-no:hover { border-color: #c62828; }
.ajit-swipe-yes:hover { border-color: #2e7d32; }
.ajit-swipe-buy:hover { border-color: #b8860b; }
.ajit-swipe-hint { text-align: center; color: #999; font-size: .85em; margin-top: 10px; }
.ajit-liked-list { list-style: none; margin: 0; padding: 0; }
.ajit-liked-list li { display: flex; align-items: center; gap: 12px; padding: 10px 4px; border-bottom: 1px solid #eee; }
.ajit-liked-list li a { flex: 1; font-weight: 600; }
.ajit-liked-date { color: #999; font-size: .85em; }
@media (max-width: 576px) { .ajit-swipe-stage { height: 70vh; } }

/* === v0.25.1 - okna czasowe gorących === */
.ajit-hot-windows { display: flex; gap: 6px; margin: 10px 0 2px; }
.ajit-hot-window {
    padding: 3px 12px; border: 1px solid #e0e0e0; border-radius: 14px;
    font-size: .85em; color: #666; text-decoration: none;
}
.ajit-hot-window:hover { border-color: #ff6a00; color: #ff6a00; text-decoration: none; }
.ajit-hot-window.is-active { background: #ff6a00; border-color: #ff6a00; color: #fff; }