/**
 * com_grab Deal Article CSS
 * Loaded only on com_content category 356 (Angebote) and individual deal articles.
 * Injected via plg_system_grab_article_css onBeforeCompileHead.
 */

/* ===== Article Hero Image (from images.image_fulltext, loaded by SP Page Builder lazysizes) ===== */
.com-content-article img.lazyloaded {
    width: 100% !important;
    max-height: 600px !important;
    object-fit: contain !important;
    background: #f8f8f8 !important;
    border-radius: 0.75rem !important;
    margin-bottom: 1.25rem !important;
}

/* ===== Description Block ===== */
.deal-article-description {
    font-size: 1rem;
    line-height: 1.7;
    color: #374151;
    margin-bottom: 1.5rem;
}

.deal-article-description p {
    margin-bottom: 1rem;
}

/* ===== Deal Box (fulltext) ===== */
.deal-article-dealbox {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.5rem;
    border: 1px solid #e5e7eb;
    border-radius: 1rem;
    background: #fafafa;
    margin-top: 1.5rem;
}

/* ===== Price Comparison ===== */
.deal-price-comparison {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.deal-price-comparison .was {
    font-size: 1.1rem;
    color: #9ca3af;
    text-decoration: line-through;
    font-weight: 400;
}

.deal-price-comparison .sale {
    font-size: 1.35rem;
    font-weight: 700;
    color: #111827;
}

/* ===== CTA Button ===== */
.deal-cta {
    align-self: flex-start;
    background: linear-gradient(135deg, #f14833 0%, #d63a25 100%) !important;
    color: #fff !important;
    font-weight: 700;
    font-size: 1rem;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 2px 8px rgba(241, 72, 51, 0.3);
    text-decoration: none !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.deal-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(241, 72, 51, 0.4) !important;
    background: linear-gradient(135deg, #e03d2a 0%, #c53522 100%) !important;
}

/* ===== Discount Badge (reused from grab/default.php) ===== */
.deal-discount-badge {
    display: inline-block;
    background: linear-gradient(135deg, #f14833 0%, #d63a25 100%);
    color: #fff;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 0.45em 0.85em;
    border-radius: 0.5rem;
    box-shadow: 0 2px 6px rgba(241, 72, 51, 0.22);
    letter-spacing: 0.01em;
    min-width: 3.4em;
    text-align: center;
}

/* ===== Expiry Chip (reused from grab/default.php) ===== */
.deal-expiry-chip {
    display: inline-block;
    padding: 0.3em 0.7em;
    border-radius: 0.4rem;
    font-weight: 600;
    font-size: 0.9rem;
    font-variant-numeric: tabular-nums;
}

.deal-expiry-chip.deal-expiry-safe     { background: #f1f3f5; color: #495057; }
.deal-expiry-chip.deal-expiry-soon     { background: #fff3cd; color: #856404; }
.deal-expiry-chip.deal-expiry-warn     { background: #ffe5d0; color: #b35900; }
.deal-expiry-chip.deal-expiry-critical  { background: #f8d7da; color: #b02a37; }

/* ===== NEU Badge (reused from grab/default.php) ===== */
.deal-new-badge {
    font-size: 0.42rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 0.08em 0.32em;
    background: linear-gradient(135deg, #0dcaf0 0%, #0d6efd 100%);
    color: #fff;
    box-shadow: 0 1px 2px rgba(13, 202, 240, 0.25);
    animation: deal-new-pulse 2.6s ease-in-out infinite;
    line-height: 1.4;
    vertical-align: middle;
    border-radius: 9999px;
}

@keyframes deal-new-pulse {
    0%, 100% { box-shadow: 0 1px 2px rgba(13, 202, 240, 0.25); }
    50%       { box-shadow: 0 1px 4px rgba(13, 202, 240, 0.45); }
}

/* ===== Sale label (when no was/sale prices available) ===== */
.deal-sale-label {
    display: inline-block;
    padding: 0.3em 0.7em;
    background: #fef3c7;
    color: #92400e;
    border-radius: 0.4rem;
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ===== Article page chrome — hide unneeded Joomla elements ===== */
.com-content-article .article-info,
.com-content-article .article-info-term,
.com-content-article dl.article-info,
.com-content-article .category-name,
.com-content-article .hits,
.com-content-article .parent-category-name,
.com-content-article .article-info dd,
.com-content-article .article-info dt {
    display: none !important;
}

.com-content-article .rscomments {
    display: none !important;
}

/* Smaller, less dominant article title */
.com-content-article h1[itemprop="headline"],
.com-content-article h1,
.item-page h1[itemprop="headline"],
.item-page h1 {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    margin: 0 0 1.25rem 0 !important;
    color: #111827;
}

/* ===== SP Page Builder image suppression on deal listing page ===== */

/* The listing page has no images: introtext img tags are stripped by onAfterRender
   and images.image_fulltext is empty. This rule is a safety net. */
body.deal-listing img.lazyload {
    display: none !important;
}

/* On article detail pages, SP Page Builder's lazysizes JS loads the image from images.image_fulltext.
   The JS adds .lazyloaded class once the image is loaded — we style that. */