/**
 * Home Aside Block Styles
 * 
 * Aside con posts destacados y banners publicitarios
 * Configurado desde Theme Options
 * 
 * @package Yaconic_Aesthetic
 */

/* Block Container */
.yaconic-home-aside {
    position: relative;
}

/* Title Styles */
.yaconic-home-aside h2 {
    margin: 0;
}

/* Post List */
.yaconic-home-aside article a {
    text-decoration: none;
    color: inherit;
}

/* Number Styles */
.yaconic-home-aside article span {
    flex-shrink: 0;
}

/* Post Title */
.yaconic-home-aside article h3 {
    margin: 0;
}

/* Accessibility - Focus States */
.yaconic-home-aside article a:focus {
    outline: 2px solid currentColor;
    outline-offset: 4px;
    border-radius: 4px;
}

/* Banner Container */
.yaconic-home-aside [data-selector="adsbanner"] {
    position: relative;
}

/* Banner Image */
.yaconic-home-aside .adsbox {
    display: block;
}

/* Preview State */
.acf-block-preview {
    padding: 2rem;
    background: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 4px;
    text-align: center;
}

.acf-block-preview p {
    margin: 0;
    color: #6b7280;
}

/* Error State */
.acf-block-error {
    padding: 2rem;
    background: #fff3cd;
    border: 2px dashed #ffc107;
    border-radius: 4px;
    text-align: center;
}

.acf-block-error p {
    margin: 0;
    color: #856404;
    font-weight: bold;
}

/* Dark Mode Adjustments */
@media (prefers-color-scheme: dark) {
    .acf-block-preview {
        background: #1f2937;
        border-color: #374151;
    }
    
    .acf-block-preview p {
        color: #9ca3af;
    }
    
    .acf-block-error {
        background: #1f2937;
        border-color: #374151;
    }
    
    .acf-block-error p {
        color: #fbbf24;
    }
}

/* Print Styles */
@media print {
    .yaconic-home-aside [data-selector="adsbanner"] {
        display: none;
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .yaconic-home-aside * {
        transition: none !important;
    }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .yaconic-home-aside article a:focus {
        outline-width: 3px;
    }
}