﻿/* ===== Artex Cart — Theme variables ===== */
.artex-theme-light,
.artex-theme-auto {
    --artex-surface-1:       #ffffff;
    --artex-surface-2:       #f9fafb;
    --artex-surface-3:       #f3f4f6;
    --artex-surface-hover:   #fafafa;
    --artex-line-1:          #eaeaea;
    --artex-line-2:          #f0f0f0;
    --artex-line-3:          #e5e7eb;
    --artex-text-1:          #111111;
    --artex-text-2:          #374151;
    --artex-text-3:          #6b7280;
    --artex-text-4:          #9ca3af;
    --artex-text-5:          #d1d5db;
    --artex-accent:          #2563eb;
    --artex-accent-2:        #3286e5;
    --artex-accent-hover:    #1d4ed8;
    --artex-accent-bg:       #eff6ff;
    --artex-danger:          #e63946;
    --artex-success:         #22c55e;
    --artex-success-text:    #15803d;
    --artex-success-bg:      #f0fdf4;
    --artex-success-border:  #bbf7d0;
    --artex-error-text:      #b91c1c;
    --artex-error-bg:        #fff3f3;
    --artex-error-border:    #fca5a5;
    --artex-toggle-off:      #d1d5db;
    --artex-overlay-bg:      rgba(0, 0, 0, 0.45);
    --artex-shadow-sm:       0 4px 20px rgba(0, 0, 0, 0.12);
    --artex-shadow-md:       0 8px 30px rgba(0, 0, 0, 0.15);
    --artex-shadow-notify:   0px 5px 39px 0px rgba(0, 0, 0, 0.18);
}

.artex-theme-dark {
    --artex-surface-1:       #1f2937;
    --artex-surface-2:       #111827;
    --artex-surface-3:       #374151;
    --artex-surface-hover:   #283040;
    --artex-line-1:          #374151;
    --artex-line-2:          #2d3748;
    --artex-line-3:          #4b5563;
    --artex-text-1:          #f9fafb;
    --artex-text-2:          #d1d5db;
    --artex-text-3:          #9ca3af;
    --artex-text-4:          #6b7280;
    --artex-text-5:          #4b5563;
    --artex-accent:          #60a5fa;
    --artex-accent-2:        #60a5fa;
    --artex-accent-hover:    #3b82f6;
    --artex-accent-bg:       #1e3a5f;
    --artex-danger:          #f87171;
    --artex-success:         #4ade80;
    --artex-success-text:    #86efac;
    --artex-success-bg:      #052e16;
    --artex-success-border:  #166534;
    --artex-error-text:      #fca5a5;
    --artex-error-bg:        #450a0a;
    --artex-error-border:    #991b1b;
    --artex-toggle-off:      #4b5563;
    --artex-overlay-bg:      rgba(0, 0, 0, 0.65);
    --artex-shadow-sm:       0 4px 20px rgba(0, 0, 0, 0.40);
    --artex-shadow-md:       0 8px 30px rgba(0, 0, 0, 0.40);
    --artex-shadow-notify:   0px 5px 39px 0px rgba(0, 0, 0, 0.45);
}

@media (prefers-color-scheme: dark) {
    .artex-theme-auto {
        --artex-surface-1:       #1f2937;
        --artex-surface-2:       #111827;
        --artex-surface-3:       #374151;
        --artex-surface-hover:   #283040;
        --artex-line-1:          #374151;
        --artex-line-2:          #2d3748;
        --artex-line-3:          #4b5563;
        --artex-text-1:          #f9fafb;
        --artex-text-2:          #d1d5db;
        --artex-text-3:          #9ca3af;
        --artex-text-4:          #6b7280;
        --artex-text-5:          #4b5563;
        --artex-accent:          #60a5fa;
        --artex-accent-2:        #60a5fa;
        --artex-accent-hover:    #3b82f6;
        --artex-accent-bg:       #1e3a5f;
        --artex-danger:          #f87171;
        --artex-success:         #4ade80;
        --artex-success-text:    #86efac;
        --artex-success-bg:      #052e16;
        --artex-success-border:  #166534;
        --artex-error-text:      #fca5a5;
        --artex-error-bg:        #450a0a;
        --artex-error-border:    #991b1b;
        --artex-toggle-off:      #4b5563;
        --artex-overlay-bg:      rgba(0, 0, 0, 0.65);
        --artex-shadow-sm:       0 4px 20px rgba(0, 0, 0, 0.40);
        --artex-shadow-md:       0 8px 30px rgba(0, 0, 0, 0.40);
        --artex-shadow-notify:   0px 5px 39px 0px rgba(0, 0, 0, 0.45);
    }
}

/* ===== Artex Cart — кнопка «В корзину» ===== */

.artex-add-to-cart {
    display: inline-flex;
    align-items: stretch;
    gap: 8px;
    font-family: inherit;
    font-size: inherit;
}

.artex-cart-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--artex-line-3);
    border-radius: var(--artex-btn-radius, 6px);
    background: var(--artex-surface-1);
    overflow: hidden;
}

.artex-cart-qty-btn {
    width: 30px;
    height: 100%;
    min-height: 38px;
    border: none;
    background: transparent;
    color: var(--artex-text-1);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.artex-cart-qty-btn:hover {
    background: var(--artex-surface-3);
}

.artex-cart-qty-input {
    width: 44px;
    min-height: 38px;
    border: none;
    border-left: 1px solid var(--artex-line-3);
    border-right: 1px solid var(--artex-line-3);
    text-align: center;
    background: transparent;
    color: var(--artex-text-1);
    font-size: 0.875em;
    font-family: inherit;
    -moz-appearance: textfield;
}

.artex-cart-qty-input::-webkit-outer-spin-button,
.artex-cart-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.artex-cart-qty .artex-is-busy {
    opacity: 0.55;
    cursor: wait;
}

/* Базовая кнопка */
.artex-cart-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 18px;
    border-radius: var(--artex-btn-radius, 6px);
    font-size: 0.875em;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: background 0.18s, color 0.18s, opacity 0.18s;
    white-space: nowrap;
    line-height: 1.3;
}

/* Состояние: добавить */
.artex-cart-btn--add {
    background: var(--artex-btn-add-bg, var(--artex-accent));
    color: var(--artex-btn-add-text, var(--artex-surface-1));
    border-style: solid;
    border-width: var(--artex-btn-add-border-width, 1px);
    border-color: var(--artex-btn-add-border, var(--artex-accent));
}

.artex-cart-btn--add:hover {
    background: var(--artex-btn-add-bg-hover, var(--artex-btn-add-bg, var(--artex-accent-hover)));
    color: var(--artex-btn-add-text, var(--artex-surface-1));
}

/* Состояние: уже в корзине */
.artex-cart-btn--in-cart {
    background: var(--artex-btn-added-bg, var(--artex-success-bg));
    color: var(--artex-btn-added-text, var(--artex-success-text));
    border-style: solid;
    border-width: var(--artex-btn-added-border-width, 1px);
    border-color: var(--artex-btn-added-border, var(--artex-success-border));
}

.artex-cart-btn--in-cart:hover {
    background: var(--artex-btn-added-bg, var(--artex-success-bg));
    color: var(--artex-btn-added-text, var(--artex-success-text));
}

/* Загрузка */
.artex-cart-btn--loading {
    opacity: 0.65;
    pointer-events: none;
}

/* Иконки */
.artex-cart-btn__icon {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

/* Адаптивность: на мобилке растягиваем на полную ширину */
@media (max-width: 480px) {
    .artex-add-to-cart {
        width: 100%;
    }

    .artex-cart-btn {
        flex: 1 1 auto;
        justify-content: center;
    }
}

/* ===== Notification container ===== */
.artex-notify-container {
    position: fixed;
    top: 28px;
    right: 28px;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    gap: 0;
    pointer-events: none;
    max-height: 90vh;
    font-family: inherit;
    font-size: inherit;
}
  
/* ===== Individual notification ===== */
.artex-add-notify { 
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #1c2b23;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: var(--artex-shadow-notify);
    padding: 14px 42px 14px 14px;
    min-width: 260px;
    max-width: 320px;
    pointer-events: none;
    opacity: 0;
    transform: translateY(-16px);
    max-height: 200px;
    overflow: hidden;
    margin-bottom: 10px;
    transition:
        opacity 0.28s ease,
        transform 0.28s ease,
        max-height 0.25s ease 0.28s,
        padding-top 0.25s ease 0.28s,
        padding-bottom 0.25s ease 0.28s,
        margin-bottom 0.25s ease 0.28s;
}

.artex-add-notify--show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.artex-add-notify--hide {
    opacity: 0;
    transform: translateY(-8px);
    max-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    pointer-events: none;
}

.artex-add-notify-close {
    position: absolute;
    top: 8px;
    right: 10px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.125em;
    font-family: inherit;
    color: var(--artex-text-4);
    line-height: 1;
    padding: 2px;
}
.artex-add-notify-close:hover { color: var(--artex-text-2); }

.artex-add-notify-img {
    display: flex;
    align-items: center;
    width: 52px;
    height: 52px;
    text-align: center;
    justify-content: center;
}
.artex-add-notify-img img {
    max-width: 45px;
    height: 100%;
    display: flex;
    align-items: center;
} 
.artex-add-notify-no-img {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background-color:#1f2f26;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
} 
.artex-add-notify-info { flex: 1; min-width: 0; }
.artex-add-notify-title 
{ 
	display: block; 
    font-family: 'Tilda Sans Semibold';
    font-size: 15px;
    display: block;
    color: #e9d8bf;
	margin-bottom: 2px;
}
.artex-add-notify-name {
    display: block;
    color: #9f9280;
    font-size: 16px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}




