/* =========================================================
   RURAL DIGITAL CENTER MODAL
========================================================= */

#digitalProjectModal {
    opacity: 0;
    transition: opacity 0.25s ease;
}

#digitalProjectModal.modal-visible {
    opacity: 1;
}

#digitalProjectBox {
    transform: translateY(25px) scale(0.97);
    opacity: 0;
    transition:
        transform 0.3s ease,
        opacity 0.3s ease;
}

#digitalProjectModal.modal-visible #digitalProjectBox {
    transform: translateY(0) scale(1);
    opacity: 1;
}


/* Custom Scrollbar */

.modal-scroll-area::-webkit-scrollbar {
    width: 6px;
}

.modal-scroll-area::-webkit-scrollbar-track {
    background: #f1f5f9;
}

.modal-scroll-area::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 20px;
}

.modal-scroll-area::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}


/* Preview Card */

.project-preview {
    isolation: isolate;
}


/* Information Cards */

.modal-info-card {
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

.modal-info-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.07);
    border-color: #c7d2fe;
}


/* Activity Cards */

.activity-card {
    transition:
        transform 0.25s ease,
        background-color 0.25s ease,
        border-color 0.25s ease;
}

.activity-card:hover {
    transform: translateY(-3px);
    background-color: #eef2ff;
    border-color: #c7d2fe;
}


/* Prevent body scrolling while modal is open */

body.modal-open {
    overflow: hidden;
}


/* Mobile */

@media (max-width: 640px) {

    #digitalProjectBox {
        max-height: 96vh;
        border-radius: 18px;
    }

    .modal-scroll-area {
        max-height: calc(96vh - 82px);
    }

}


/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

    #digitalProjectModal,
    #digitalProjectBox,
    .modal-info-card,
    .activity-card,
    .project-preview {
        transition: none !important;
    }

}