﻿/**
 * MBRSC DDA Theme — mbrsc-elementor.css
 *
 * Elementor-specific widget styles.
 * Enqueued only when Elementor is active.
 * Extends theme.css with widget-specific overrides.
 *
 * @package MBRSC_DDA_Theme
 */


/* =============================================================================
   ELEMENTOR WIDGET — HERO BANNER
   ============================================================================= */

.elementor-widget-mbrsc-hero-banner .mbrsc-hero {
    min-height: var(--hero-min-height, 600px);
}

.elementor-widget-mbrsc-hero-banner .mbrsc-hero__overlay {
    opacity: var(--hero-overlay-opacity, 0.7);
}

.elementor-widget-mbrsc-hero-banner .mbrsc-hero__heading {
    font-size:  var(--hero-heading-size, var(--mbrsc-font-size-5xl));
    color:      var(--hero-heading-color, var(--mbrsc-color-white));
}

/* Elementor editor preview fix */
.elementor-editor-active .mbrsc-hero {
    pointer-events: none;
}

.elementor-editor-active .mbrsc-hero__ctas .mbrsc-btn {
    pointer-events: all;
}


/* =============================================================================
   ELEMENTOR WIDGET — NEWS GRID
   ============================================================================= */

.elementor-widget-mbrsc-news-grid .mbrsc-grid {
    gap: var(--news-grid-gap, var(--mbrsc-grid-gap));
}

.elementor-widget-mbrsc-news-grid .mbrsc-card--news {
    height: 100%;
}

/* Column count control via Elementor */
.elementor-widget-mbrsc-news-grid[data-columns="2"] .mbrsc-grid {
    grid-template-columns: repeat(2, 1fr);
}

.elementor-widget-mbrsc-news-grid[data-columns="3"] .mbrsc-grid {
    grid-template-columns: repeat(3, 1fr);
}

.elementor-widget-mbrsc-news-grid[data-columns="4"] .mbrsc-grid {
    grid-template-columns: repeat(4, 1fr);
}


/* =============================================================================
   ELEMENTOR WIDGET — STATS COUNTER
   ============================================================================= */

.elementor-widget-mbrsc-stats-counter .mbrsc-stats-section {
    background: var(--stats-bg-color, var(--mbrsc-color-primary));
}

.elementor-widget-mbrsc-stats-counter .mbrsc-stat-number__value {
    font-size: var(--stats-number-size, var(--mbrsc-font-size-5xl));
    color:     var(--stats-number-color, var(--mbrsc-color-white));
}

.elementor-widget-mbrsc-stats-counter .mbrsc-stat-label {
    color: var(--stats-label-color, rgba(255,255,255,.7));
}

/* Light variant */
.elementor-widget-mbrsc-stats-counter.mbrsc-stats--light .mbrsc-stats-section {
    background: var(--mbrsc-color-gray-50);
}

.elementor-widget-mbrsc-stats-counter.mbrsc-stats--light .mbrsc-stat-number__value {
    color: var(--mbrsc-color-primary);
}

.elementor-widget-mbrsc-stats-counter.mbrsc-stats--light .mbrsc-stat-label {
    color: var(--mbrsc-color-gray-600);
}


/* =============================================================================
   ELEMENTOR WIDGET — MISSIONS GRID
   ============================================================================= */

.elementor-widget-mbrsc-missions-grid .mbrsc-card--mission {
    height: 100%;
}

.elementor-widget-mbrsc-missions-grid .mbrsc-grid {
    gap: var(--missions-grid-gap, var(--mbrsc-grid-gap));
}


/* =============================================================================
   ELEMENTOR WIDGET — MEDIA GRID
   ============================================================================= */

.elementor-widget-mbrsc-media-grid .mbrsc-card--media {
    height: 100%;
}

/* Masonry layout option */
.elementor-widget-mbrsc-media-grid.mbrsc-layout--masonry .mbrsc-grid {
    grid-template-rows: masonry;
    align-items:        start;
}


/* =============================================================================
   ELEMENTOR WIDGET — LEADERSHIP GRID
   ============================================================================= */

.elementor-widget-mbrsc-leadership-grid .mbrsc-card--leader {
    height: 100%;
}

.elementor-widget-mbrsc-leadership-grid[data-columns="4"] .mbrsc-grid {
    grid-template-columns: repeat(4, 1fr);
}

.elementor-widget-mbrsc-leadership-grid[data-columns="5"] .mbrsc-grid {
    grid-template-columns: repeat(5, 1fr);
}


/* =============================================================================
   ELEMENTOR WIDGET — SERVICES GRID
   ============================================================================= */

.elementor-widget-mbrsc-services-grid .mbrsc-card--service {
    height: 100%;
}

.elementor-widget-mbrsc-services-grid .mbrsc-card__icon-wrap {
    background: var(--service-icon-bg, var(--mbrsc-color-gray-100));
}

.elementor-widget-mbrsc-services-grid .mbrsc-card__icon-wrap .material-icons {
    color: var(--service-icon-color, var(--mbrsc-color-primary));
}


/* =============================================================================
   ELEMENTOR WIDGET — AWARDS GRID
   ============================================================================= */

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card {
    background:     var(--mbrsc-color-white);
    border-radius:  var(--mbrsc-radius-xl);
    box-shadow:     var(--mbrsc-shadow-card);
    padding:        var(--mbrsc-space-6);
    text-align:     center;
    transition:     transform var(--mbrsc-transition-base),
                    box-shadow var(--mbrsc-transition-base);
}

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card:hover {
    transform:  translateY(-4px);
    box-shadow: var(--mbrsc-shadow-card-hover);
}

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card__logo {
    max-width:      120px;
    max-height:     80px;
    object-fit:     contain;
    margin:         0 auto var(--mbrsc-space-4);
    filter:         grayscale(30%);
    transition:     filter var(--mbrsc-transition-base);
}

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card:hover .mbrsc-award-card__logo {
    filter: grayscale(0%);
}

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card__year {
    display:        inline-block;
    font-size:      var(--mbrsc-font-size-xs);
    font-weight:    var(--mbrsc-font-weight-semibold);
    color:          var(--mbrsc-color-gold);
    background:     rgba(201,168,76,.1);
    padding:        2px var(--mbrsc-space-2);
    border-radius:  var(--mbrsc-radius-full);
    margin-bottom:  var(--mbrsc-space-2);
}

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card__title {
    font-size:      var(--mbrsc-font-size-sm);
    font-weight:    var(--mbrsc-font-weight-semibold);
    color:          var(--mbrsc-color-gray-800);
    margin-bottom:  var(--mbrsc-space-1);
    line-height:    var(--mbrsc-line-height-snug);
}

.elementor-widget-mbrsc-awards-grid .mbrsc-award-card__org {
    font-size:  var(--mbrsc-font-size-xs);
    color:      var(--mbrsc-color-gray-500);
}


/* =============================================================================
   ELEMENTOR GENERAL FIXES
   ============================================================================= */

/* Prevent Elementor column padding from breaking card grids */
.elementor-widget-mbrsc-news-grid .elementor-widget-container,
.elementor-widget-mbrsc-missions-grid .elementor-widget-container,
.elementor-widget-mbrsc-media-grid .elementor-widget-container,
.elementor-widget-mbrsc-services-grid .elementor-widget-container,
.elementor-widget-mbrsc-leadership-grid .elementor-widget-container,
.elementor-widget-mbrsc-awards-grid .elementor-widget-container {
    padding: 0;
}

/* Fix section padding in Elementor */
.elementor-section.mbrsc-section {
    padding-block: var(--mbrsc-section-padding);
}

/* Elementor editor — show widget placeholder */
.elementor-editor-active .mbrsc-widget-placeholder {
    display:        flex;
    align-items:    center;
    justify-content: center;
    min-height:     200px;
    background:     var(--mbrsc-color-gray-50);
    border:         2px dashed var(--mbrsc-color-gray-300);
    border-radius:  var(--mbrsc-radius-xl);
    color:          var(--mbrsc-color-gray-400);
    font-size:      var(--mbrsc-font-size-sm);
    gap:            var(--mbrsc-space-2);
}

/* RTL fixes inside Elementor */
[dir="rtl"] .elementor-widget-mbrsc-news-grid .mbrsc-card__read-more .material-icons,
[dir="rtl"] .elementor-widget-mbrsc-missions-grid .mbrsc-card__read-more .material-icons {
    transform: scaleX(-1);
}

/* Responsive — Elementor mobile */
@media (max-width: 768px) {
    .elementor-widget-mbrsc-news-grid[data-columns="3"] .mbrsc-grid,
    .elementor-widget-mbrsc-news-grid[data-columns="4"] .mbrsc-grid,
    .elementor-widget-mbrsc-missions-grid .mbrsc-grid,
    .elementor-widget-mbrsc-media-grid .mbrsc-grid,
    .elementor-widget-mbrsc-services-grid .mbrsc-grid,
    .elementor-widget-mbrsc-leadership-grid .mbrsc-grid {
        grid-template-columns: 1fr;
    }

    .elementor-widget-mbrsc-news-grid[data-columns="2"] .mbrsc-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1024px) {
    .elementor-widget-mbrsc-news-grid[data-columns="4"] .mbrsc-grid,
    .elementor-widget-mbrsc-leadership-grid[data-columns="5"] .mbrsc-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

