/* GGG Countdown Timer Styles */
.ggg-countdown-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    transition: all 0.3s ease;
}

/* Layout Styles */
.ggg-layout-row {
    flex-direction: row;
}

.ggg-layout-column {
    flex-direction: column;
}

/* Two Rows Layout */
.ggg-layout-two-rows {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}

.ggg-layout-two-rows .ggg-countdown-item {
    flex: 0 0 calc(50% - 15px);
    max-width: calc(50% - 15px);
    box-sizing: border-box;
}

/* Special layouts for 3+ items */
.ggg-layout-first-item-single-row {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    gap: 15px;
}

.ggg-layout-first-item-single-row .ggg-countdown-item:first-child {
    grid-column: 1 / -1;
    justify-self: center;
}

.ggg-layout-first-item-single-row .ggg-countdown-item:not(:first-child) {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
}

.ggg-layout-last-item-single-row {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    gap: 15px;
}

.ggg-layout-last-item-single-row .ggg-countdown-item:last-child {
    grid-column: 1 / -1;
    justify-self: center;
}

.ggg-layout-last-item-single-row .ggg-countdown-item:not(:last-child) {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
}

.ggg-countdown-item {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 80px;
}

/* Label position styles */
.ggg-label-position-top .ggg-countdown-item {
    flex-direction: column;
    gap: var(--label-spacing, 5px);
}

.ggg-label-position-bottom .ggg-countdown-item {
    flex-direction: column;
    gap: var(--label-spacing, 5px);
}

.ggg-label-position-left .ggg-countdown-item {
    flex-direction: row;
    gap: var(--label-spacing, 5px);
}

.ggg-label-position-right .ggg-countdown-item {
    flex-direction: row-reverse;
    gap: var(--label-spacing, 5px);
}

/* Label order management */
.ggg-label-position-top .ggg-countdown-label {
    order: 1;
}

.ggg-label-position-top .ggg-countdown-number {
    order: 2;
}

.ggg-label-position-bottom .ggg-countdown-label {
    order: 2;
}

.ggg-label-position-bottom .ggg-countdown-number {
    order: 1;
}

.ggg-label-position-left .ggg-countdown-label {
    order: 1;
}

.ggg-label-position-left .ggg-countdown-number {
    order: 2;
}

.ggg-label-position-right .ggg-countdown-label {
    order: 2;
}

.ggg-label-position-right .ggg-countdown-number {
    order: 1;
}

/* Label visibility */
.ggg-labels-hidden .ggg-countdown-label {
    display: none !important;
}

/* NUMBER STYLES - Enhanced specificity */
.ggg-countdown-container .ggg-countdown-number {
    font-size: 2.5em;
    font-weight: bold;
    line-height: 1;
    display: block;
    padding: 0;
    margin: 0;
}

/* LABEL STYLES - Enhanced specificity */
.ggg-countdown-container .ggg-countdown-label {
    font-size: 0.9em;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    white-space: nowrap;
    display: block;
    padding: 0;
    margin: 0;
}

/* Horizontal layout adjustments for left/right labels */
.ggg-label-position-left .ggg-countdown-item,
.ggg-label-position-right .ggg-countdown-item {
    text-align: left;
    justify-content: flex-start;
}

/* Ensure proper alignment in various layouts */
.ggg-layout-two-rows .ggg-label-position-left .ggg-countdown-item,
.ggg-layout-two-rows .ggg-label-position-right .ggg-countdown-item {
    justify-content: center;
}

/* Responsive Styles */
@media (max-width: 1024px) {
    .ggg-layout-tablet-row {
        flex-direction: row !important;
    }
    
    .ggg-layout-tablet-column {
        flex-direction: column !important;
    }
    
    /* Two Rows Tablet */
    .ggg-layout-tablet-two-rows {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 12px !important;
    }
    
    .ggg-layout-tablet-two-rows .ggg-countdown-item {
        flex: 0 0 calc(50% - 12px) !important;
        max-width: calc(50% - 12px) !important;
    }
    
    .ggg-layout-tablet-first-item-single-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto !important;
        gap: 12px !important;
    }
    
    .ggg-layout-tablet-first-item-single-row .ggg-countdown-item:first-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    
    .ggg-layout-tablet-first-item-single-row .ggg-countdown-item:not(:first-child) {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }
    
    .ggg-layout-tablet-last-item-single-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto !important;
        gap: 12px !important;
    }
    
    .ggg-layout-tablet-last-item-single-row .ggg-countdown-item:last-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    
    .ggg-layout-tablet-last-item-single-row .ggg-countdown-item:not(:last-child) {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }
    
    .ggg-countdown-container .ggg-countdown-number {
        font-size: 2em;
    }
    
    .ggg-countdown-container .ggg-countdown-label {
        font-size: 0.85em;
    }
}

@media (max-width: 767px) {
    .ggg-layout-mobile-row {
        flex-direction: row !important;
    }
    
    .ggg-layout-mobile-column {
        flex-direction: column !important;
    }
    
    /* Two Rows Mobile */
    .ggg-layout-mobile-two-rows {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 10px !important;
    }
    
    .ggg-layout-mobile-two-rows .ggg-countdown-item {
        flex: 0 0 calc(50% - 10px) !important;
        max-width: calc(50% - 10px) !important;
    }
    
    .ggg-layout-mobile-first-item-single-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto !important;
        gap: 10px !important;
    }
    
    .ggg-layout-mobile-first-item-single-row .ggg-countdown-item:first-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    
    .ggg-layout-mobile-first-item-single-row .ggg-countdown-item:not(:first-child) {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
    }
    
    .ggg-layout-mobile-last-item-single-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto !important;
        gap: 10px !important;
    }
    
    .ggg-layout-mobile-last-item-single-row .ggg-countdown-item:last-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    
    .ggg-layout-mobile-last-item-single-row .ggg-countdown-item:not(:last-child) {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
    }
    
    .ggg-countdown-container {
        gap: 10px;
    }
    
    .ggg-countdown-item {
        min-width: 70px;
    }
    
    .ggg-countdown-container .ggg-countdown-number {
        font-size: 1.8em;
    }
    
    .ggg-countdown-container .ggg-countdown-label {
        font-size: 0.8em;
    }
    
    /* Adjust horizontal layouts for mobile */
    .ggg-label-position-left .ggg-countdown-item,
    .ggg-label-position-right .ggg-countdown-item {
        flex-direction: column;
        text-align: center;
    }
    
    .ggg-label-position-left .ggg-countdown-label,
    .ggg-label-position-right .ggg-countdown-label {
        order: 2;
    }
    
    .ggg-label-position-left .ggg-countdown-number,
    .ggg-label-position-right .ggg-countdown-number {
        order: 1;
    }
}

@media (max-width: 480px) {
    .ggg-countdown-container.ggg-layout-mobile-row {
        gap: 5px;
    }
    
    /* Two Rows Small Mobile */
    .ggg-layout-mobile-two-rows .ggg-countdown-item {
        flex: 0 0 calc(50% - 5px) !important;
        max-width: calc(50% - 5px) !important;
        min-width: 60px;
    }
    
    .ggg-countdown-item {
        min-width: 60px;
    }
    
    .ggg-countdown-container .ggg-countdown-number {
        font-size: 1.5em;
    }
    
    .ggg-countdown-container .ggg-countdown-label {
        font-size: 0.7em;
    }
}

/* Error Styles */
.ggg-countdown-error {
    padding: 20px;
    background: #ffeaa7;
    border: 1px solid #fdcb6e;
    border-radius: 5px;
    text-align: center;
    color: #e17055;
    font-weight: bold;
}

/* FIX: Enhanced color specificity for numbers and labels */
.ggg-countdown-container .ggg-countdown-number,
.ggg-countdown-item .ggg-countdown-number,
div.ggg-countdown-number {
    color: inherit !important;
}

.ggg-countdown-container .ggg-countdown-label,
.ggg-countdown-item .ggg-countdown-label,
div.ggg-countdown-label {
    color: inherit !important;
}

/* Additional fix for Elementor color controls */
.elementor-widget-ggg_countdown .ggg-countdown-number,
.elementor-widget-ggg_countdown .ggg-countdown-label {
    color: inherit !important;
}