/**
 * Offers Optimizations CSS
 * تحسينات العروض - تقليل المسافة العمودية وتحسين المظهر
 */

/* ===== GLOBAL OFFER OPTIMIZATIONS ===== */
.professional-offers-container,
.offers-above-form-container,
.hozi-product-offers-display {
    margin: 10px 0 !important;
    padding: 10px !important;
}

/* ===== COMPACT OFFER CARDS ===== */
.professional-offer,
.professional-offer-compact,
.hozi-offer-card {
    margin-bottom: 6px !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

.professional-offer:hover,
.professional-offer-compact:hover,
.hozi-offer-card:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12) !important;
}

/* ===== OFFER HEADERS - ULTRA COMPACT ===== */
.offer-header,
.offer-header-compact {
    margin-bottom: 6px !important;
    gap: 6px !important;
}

.offer-title,
.offer-header-compact h4 {
    font-size: 0.95em !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

.offer-icon {
    font-size: 16px !important;
    margin-left: 6px !important;
}

/* ===== OFFER CONTENT - COMPACT ===== */
.offer-content,
.offer-content-compact {
    gap: 6px !important;
}

.offer-price-display,
.offer-prices-compact {
    padding: 6px 8px !important;
    margin-bottom: 6px !important;
    border-radius: 4px !important;
    gap: 6px !important;
}

.original-price,
.original-price-compact {
    font-size: 0.8em !important;
}

.discounted-price,
.discounted-price-compact {
    font-size: 1em !important;
}

.discount-badge,
.discount-badge-compact {
    padding: 2px 5px !important;
    font-size: 0.7em !important;
    border-radius: 3px !important;
}

/* ===== OFFER DESCRIPTION - COMPACT ===== */
.offer-description {
    font-size: 0.8em !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

/* ===== OFFER FOOTER - COMPACT ===== */
.offer-footer {
    margin-top: 6px !important;
}

.offer-timer,
.offer-timer-compact {
    padding: 4px 6px !important;
    font-size: 0.75em !important;
    border-radius: 3px !important;
}

.timer-display,
.timer-display-compact {
    font-size: 0.8em !important;
    padding: 3px 6px !important;
    min-width: 60px !important;
    border-radius: 3px !important;
}

/* ===== PRICING GRID - COMPACT ===== */
.offer-pricing > div {
    margin-bottom: 3px !important;
    font-size: 0.8em !important;
    padding: 1px 0 !important;
}

.offer-pricing .label {
    font-size: 0.75em !important;
}

.offer-pricing .value {
    font-size: 0.8em !important;
}

/* ===== OFFER ACTIONS - COMPACT ===== */
.offer-actions {
    margin-top: 6px !important;
}

.hozi-select-offer {
    padding: 4px 8px !important;
    font-size: 0.8em !important;
    border-radius: 4px !important;
}

/* ===== BADGES - COMPACT ===== */
.offer-badge {
    top: -4px !important;
    right: 8px !important;
    padding: 2px 4px !important;
    font-size: 0.65em !important;
    border-radius: 6px !important;
}

/* ===== GRID LAYOUT OPTIMIZATIONS ===== */
.hozi-offers-grid {
    gap: 6px !important;
}

.hozi-offers-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
}

/* ===== RESPONSIVE OPTIMIZATIONS ===== */
@media (max-width: 768px) {
    .professional-offers-container,
    .offers-above-form-container,
    .hozi-product-offers-display {
        margin: 8px 0 !important;
        padding: 8px !important;
    }
    
    .professional-offer,
    .professional-offer-compact,
    .hozi-offer-card {
        margin-bottom: 5px !important;
        padding: 6px 8px !important;
    }
    
    .offer-header,
    .offer-header-compact {
        margin-bottom: 4px !important;
        gap: 4px !important;
    }
    
    .offer-title,
    .offer-header-compact h4 {
        font-size: 0.9em !important;
    }
    
    .offer-icon {
        font-size: 14px !important;
        margin-left: 4px !important;
    }
    
    .offer-price-display,
    .offer-prices-compact {
        padding: 4px 6px !important;
        margin-bottom: 4px !important;
        gap: 4px !important;
    }
    
    .original-price,
    .original-price-compact {
        font-size: 0.75em !important;
    }
    
    .discounted-price,
    .discounted-price-compact {
        font-size: 0.9em !important;
    }
    
    .discount-badge,
    .discount-badge-compact {
        padding: 1px 4px !important;
        font-size: 0.65em !important;
    }
    
    .offer-description {
        font-size: 0.75em !important;
    }
    
    .offer-footer {
        margin-top: 4px !important;
    }
    
    .offer-timer,
    .offer-timer-compact {
        padding: 3px 5px !important;
        font-size: 0.7em !important;
    }
    
    .timer-display,
    .timer-display-compact {
        font-size: 0.75em !important;
        padding: 2px 5px !important;
        min-width: 55px !important;
    }
    
    .offer-pricing > div {
        margin-bottom: 2px !important;
        font-size: 0.75em !important;
    }
    
    .offer-pricing .label {
        font-size: 0.7em !important;
    }
    
    .offer-pricing .value {
        font-size: 0.75em !important;
    }
    
    .offer-actions {
        margin-top: 4px !important;
    }
    
    .hozi-select-offer {
        padding: 3px 6px !important;
        font-size: 0.75em !important;
    }
    
    .offer-badge {
        top: -3px !important;
        right: 6px !important;
        padding: 1px 3px !important;
        font-size: 0.6em !important;
    }
    
    .hozi-offers-grid {
        gap: 5px !important;
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    .professional-offers-container,
    .offers-above-form-container,
    .hozi-product-offers-display {
        margin: 6px 0 !important;
        padding: 6px !important;
    }
    
    .professional-offer,
    .professional-offer-compact,
    .hozi-offer-card {
        margin-bottom: 4px !important;
        padding: 5px 6px !important;
    }
    
    .offer-header,
    .offer-header-compact {
        margin-bottom: 3px !important;
        gap: 3px !important;
    }
    
    .offer-title,
    .offer-header-compact h4 {
        font-size: 0.85em !important;
    }
    
    .offer-icon {
        font-size: 12px !important;
        margin-left: 3px !important;
    }
    
    .offer-price-display,
    .offer-prices-compact {
        padding: 3px 5px !important;
        margin-bottom: 3px !important;
        gap: 3px !important;
    }
    
    .original-price,
    .original-price-compact {
        font-size: 0.7em !important;
    }
    
    .discounted-price,
    .discounted-price-compact {
        font-size: 0.85em !important;
    }
    
    .discount-badge,
    .discount-badge-compact {
        padding: 1px 3px !important;
        font-size: 0.6em !important;
    }
    
    .offer-description {
        font-size: 0.7em !important;
    }
    
    .offer-footer {
        margin-top: 3px !important;
    }
    
    .offer-timer,
    .offer-timer-compact {
        padding: 2px 4px !important;
        font-size: 0.65em !important;
    }
    
    .timer-display,
    .timer-display-compact {
        font-size: 0.7em !important;
        padding: 2px 4px !important;
        min-width: 50px !important;
    }
    
    .offer-pricing > div {
        margin-bottom: 1px !important;
        font-size: 0.7em !important;
    }
    
    .offer-pricing .label {
        font-size: 0.65em !important;
    }
    
    .offer-pricing .value {
        font-size: 0.7em !important;
    }
    
    .offer-actions {
        margin-top: 3px !important;
    }
    
    .hozi-select-offer {
        padding: 2px 5px !important;
        font-size: 0.7em !important;
    }
    
    .offer-badge {
        top: -2px !important;
        right: 4px !important;
        padding: 1px 2px !important;
        font-size: 0.55em !important;
    }
    
    .hozi-offers-grid {
        gap: 4px !important;
    }
}

/* ===== ANIMATION OPTIMIZATIONS ===== */
.professional-offer,
.professional-offer-compact {
    animation: slideInUp 0.4s ease-out !important;
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== HOVER EFFECT OPTIMIZATIONS ===== */
.professional-offer:hover,
.professional-offer-compact:hover,
.hozi-offer-card:hover {
    transition: all 0.2s ease !important;
}

/* ===== FOCUS STATES ===== */
.professional-offer:focus-within,
.professional-offer-compact:focus-within,
.hozi-offer-card:focus-within {
    outline: 2px solid rgba(0, 115, 170, 0.5) !important;
    outline-offset: 1px !important;
}

/* ===== ACCESSIBILITY IMPROVEMENTS ===== */
@media (prefers-reduced-motion: reduce) {
    .professional-offer,
    .professional-offer-compact,
    .hozi-offer-card {
        animation: none !important;
        transition: none !important;
    }
    
    .professional-offer:hover,
    .professional-offer-compact:hover,
    .hozi-offer-card:hover {
        transform: none !important;
    }
}

/* ===== HIGH CONTRAST MODE ===== */
@media (prefers-contrast: high) {
    .professional-offer,
    .professional-offer-compact,
    .hozi-offer-card {
        border: 2px solid #000 !important;
    }
    
    .offer-badge {
        border: 1px solid #fff !important;
    }
}