/* =========================================
   ARTMC Universal Display - v2.7.0 (Icon Fix)
   ========================================= */

/* --- COMMON GRID & CARD STYLES --- */
.artmc-grid-container { display: grid; gap: 30px; width: 100%; box-sizing: border-box; }

.artmc-card {
    background-color: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: 0.3s;
    position: relative;
    width: 100%;
    display: flex; flex-direction: column;
    border: 0 solid transparent;
}
.artmc-card:hover { transform: translateY(-5px); }

.artmc-thumb-wrap { position: relative; width: 100%; overflow: hidden; flex-shrink: 0; display: block; height: 250px; }
.artmc-thumb-wrap img { width: 100%; height: 100%; object-fit: cover; transition: 0.5s; display: block; }
.artmc-card:hover .artmc-thumb-wrap img { transform: scale(1.05); }

.artmc-content { padding: 20px; display: flex; flex-direction: column; flex-grow: 1; z-index: 2; position: relative; transition: 0.3s; background-color: inherit; }
.artmc-title { margin: 0 0 10px; font-size: 18px; font-weight: 700; line-height: 1.4; display: block; }
.artmc-title a { text-decoration: none; color: inherit; transition: 0.2s; }
.artmc-excerpt { color: #666; font-size: 14px; margin-bottom: 20px; flex-grow: 1; }

.artmc-meta-wrap { display: flex; gap: 15px; font-size: 12px; color: #888; margin-bottom: 10px; }
.artmc-meta-wrap i { margin-inline-end: 4px; }
.artmc-custom-meta { display: inline-flex; align-items: center; gap: 5px; background: #f5f5f5; padding: 4px 10px; border-radius: 4px; font-size: 12px; width: fit-content; margin-bottom: 10px; }

.artmc-footer { margin-top: auto; display: flex; }
.artmc-btn { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border: 1px solid #2271b1; color: #2271b1; border-radius: 4px; text-decoration: none; transition: 0.3s; font-size: 14px; font-weight: 600; }
.artmc-btn:hover { background: #2271b1; color: #fff; }

.artmc-full-card-link { position: absolute; inset: 0; z-index: 3; cursor: pointer; }
.artmc-btn { position: relative; z-index: 4; }

/* SKINS */
.artmc-card.skin-overlay { min-height: 300px; justify-content: flex-end; }
.artmc-card.skin-overlay .artmc-thumb-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; z-index: 0; }
.artmc-card.skin-overlay .artmc-content { color: #fff; flex-grow: 0; margin-top: auto; width: 100%; background-color: transparent !important; }
.artmc-card.skin-overlay .artmc-title, .artmc-card.skin-overlay .artmc-title a { color: #fff !important; }
.artmc-card.skin-overlay .artmc-excerpt { color: #ddd !important; }
.artmc-card.skin-overlay .artmc-meta-wrap { color: #ccc !important; }

/* IMAGE ONLY */
.artmc-img-only { height: 100%; min-height: auto; }
.artmc-img-only .artmc-thumb-wrap { height: 100% !important; }
.artmc-img-only .artmc-thumb-wrap img { object-fit: contain; padding: 10px; background: #fff; }

/* TOOLTIPS */
.artmc-card[data-artmc-tip] { position: relative; }
.artmc-card[data-artmc-tip]::after { content: attr(data-artmc-tip); position: absolute; bottom: 10px; left: 50%; transform: translate(-50%, 10px); background: rgba(0,0,0,0.85); color: #fff; padding: 6px 12px; border-radius: 4px; font-size: 13px; font-weight: 500; white-space: nowrap; opacity: 0; visibility: hidden; z-index: 10; transition: 0.3s ease; pointer-events: none; box-shadow: 0 4px 6px rgba(0,0,0,0.2); }
.artmc-card[data-artmc-tip]:hover::after { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

/* DATE BADGE */
.artmc-date-badge { position: absolute; background: #fff; padding: 5px 10px; border-radius: 4px; font-size: 12px; font-weight: bold; box-shadow: 0 2px 5px rgba(0,0,0,0.1); z-index: 5; margin: 15px; }
.artmc-date-pos-top-right { top: 0; inset-inline-end: 0; }
.artmc-date-pos-top-left { top: 0; inset-inline-start: 0; }
.artmc-date-pos-bottom-right { bottom: 0; inset-inline-end: 0; }
.artmc-date-pos-bottom-left { bottom: 0; inset-inline-start: 0; }

/* PAGINATION (GRID ONLY) */
.artmc-pagination { text-align: center; margin-top: 30px; }
.artmc-pagination .page-numbers { padding: 8px 12px; margin: 0 2px; background: #eee; border-radius: 4px; text-decoration: none; color: #333; display: inline-block; }
.artmc-pagination .page-numbers.current { background: #2271b1; color: #fff; }
.artmc-load-more-wrap { text-align: center; margin-top: 30px; }
.artmc-btn-loadmore { padding: 10px 25px; background: #2271b1; color: #fff; border: none; border-radius: 4px; cursor: pointer; transition: 0.3s; }
.artmc-btn-loadmore:hover { opacity: 0.9; }

/* =========================================
   CAROUSEL / SLIDER STYLES
   ========================================= */

.artmc-uni-carousel-wrap {
    position: relative;
    width: 100%;
}

.artmc-uni-swiper {
    width: 100%;
    overflow: hidden; 
}

/* 1. CUSTOM ARROWS (FIXED ICON DISPLAY) */
.artmc-arrow-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px; height: 40px;
    background: rgba(255,255,255,0.9);
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    color: #2271b1;
    display: flex; 
    align-items: center; 
    justify-content: center;
    cursor: pointer;
    z-index: 50; /* Z-Index Fix */
    transition: 0.3s;
    border: 1px solid transparent;
}

/* Force Default Size if Elementor hasn't loaded yet */
.artmc-arrow-btn i, 
.artmc-arrow-btn svg {
    display: block;
    line-height: 1;
    width: 1em; /* Default */
    height: 1em; /* Default */
    font-size: 20px; /* Default Fallback Size */
    fill: currentColor; 
    color: inherit;
    z-index: 2; /* Layer Fix */
}

/* Hide Swiper default arrows if they somehow appear */
.artmc-arrow-btn::after { content: none !important; display: none !important; }

.artmc-arrow-btn.swiper-button-disabled {
    opacity: 0.3;
    pointer-events: none;
    cursor: default;
}

/* Positioning */
.artmc-next-btn { right: 20px; }
.artmc-prev-btn { left: 20px; }

/* 2. EQUAL HEIGHT */
.artmc-equal-height .swiper-slide { height: auto; display: flex; }
.artmc-equal-height .artmc-card { height: 100%; }

/* 3. DOTS WRAPPER */
.artmc-dots-wrap {
    position: relative !important;
    width: 100% !important;
    text-align: center;
    margin-top: 20px;
    display: block;
    line-height: 0;
    z-index: 10;
}

.swiper-pagination-bullet {
    width: 8px; height: 8px;
    background: #ccc;
    opacity: 1;
    transition: 0.3s;
    margin: 0 6px !important;
    display: inline-block;
    border-radius: 50%;
    cursor: pointer;
}

.swiper-pagination-bullet-active {
    background: #2271b1;
    width: 10px; height: 10px;
}