/**
 * Malaysian Hijri Calendar Styling
 * Inherits Clay design tokens with explicit high contrast styling
 */

/* Full Calendar Page Container & Scroll Restoration */
#primary-takwim,
.takwim-page-main {
    position: static !important;
    top: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.mdh-full-calendar-container {
    margin-top: 1.5rem !important;
    padding-top: 1rem !important;
    padding-bottom: 5rem !important;
    margin-bottom: 2rem !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* General Day Cell */
.mdh-day-cell {
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
    color: #2A322E !important; /* ink-900 */
}

.mdh-day-cell:hover {
    transform: translateY(-1px);
    background-color: #DCECE3 !important; /* sage-100 */
}

.mdh-day-cell:active {
    transform: scale(0.95);
}

/* Today Active Cell - solid sage-600 background with crisp white typography */
.mdh-today-active {
    background-color: #467362 !important; /* sage-600 */
    color: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(70, 115, 98, 0.35) !important;
}

.mdh-today-active span {
    color: #FFFFFF !important;
}

/* Active Switcher Button - solid sage-600 with crisp white text */
.mdh-view-btn.active,
.mdh-full-view-btn.active {
    background-color: #467362 !important; /* sage-600 */
    color: #FFFFFF !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 10px rgba(70, 115, 98, 0.25) !important;
}

/* Inactive Switcher Buttons */
.mdh-view-btn:not(.active),
.mdh-full-view-btn:not(.active) {
    color: #35584B !important; /* sage-700 / ink-700 */
    font-weight: 600 !important;
}

.mdh-view-btn:not(.active):hover,
.mdh-full-view-btn:not(.active):hover {
    color: #2A322E !important; /* ink-900 */
    background-color: #DCECE3 !important;
}

/* Islamic event dot pulses */
.mdh-day-cell span.bg-sage-600,
.mdh-day-cell span.bg-amber-500 {
    animation: mdhEventPulse 2.5s infinite;
}

@keyframes mdhEventPulse {
    0%, 100% {
        opacity: 0.85;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.3);
    }
}