/* Font styles */
body {
    font-family: 'Lexend', 'BIZ UDP Gothic', sans-serif;
}

/* Hero image transition styles */
.hero-image-container {
    position: relative;
    width: 100%;
    height: 100svh;
    overflow: hidden;
}

.hero-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

.hero-image.active {
    opacity: 1;
}

/* Media query */
@media (min-width: 640px) {
    #all-works-modal>.modal-box {
        max-width: 56rem;
    }
}

@media (max-width: 768px) {
    .hero-image-container .hero-image[src="./assets/img/hero_01.jpg"] {
        content: url("../img/hero_01_vertical.jpg");
    }

    .hero-image-container .hero-image[src="./assets/img/hero_02.jpg"] {
        content: url("../img/hero_02_vertical.jpg");
    }

    .hero-image-container .hero-image[src="./assets/img/hero_03.jpg"] {
        content: url("../img/hero_03_vertical.jpg");
    }

    #all-works-modal>.modal-box {
        max-width: 90%;
        max-height: 100svh;
    }

    #universal-modal iframe {
        max-width: fit-content;
    }

}

#universal-modal .modal-box {
    max-width: fit-content;
}

/* Scroll reveal animation styles */
.scroll-reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Custom font weights for headings */
h1 {
    font-weight: 500;
}

h2 {
    font-weight: 300;
}

h3 {
    font-weight: 300;
}

.link {
    font-weight: 600;
}

/* Works card overlay adjustments */
.card.image-full:before {
    background-color: rgba(0, 0, 0, 0.4);
    transition: background-color 0.3s ease;
}

.card.image-full:hover:before {
    background-color: rgba(0, 0, 0, 0);
}

.card.image-full:hover .card-body h4,
.card.image-full:hover .card-body p {
    opacity: 0;
}

/* Floating Menu visible tooltips */
ul.menu.p-2.shadow-lg.bg-base-100.rounded-box {
    overflow: visible;
}

.table td {
    white-space: pre-wrap;
}

/* Twitter icon hover effect */
.twitter-icon-container .normal-icon {
    display: block;
}

.twitter-icon-container .hover-icon {
    display: none;
}

.twitter-icon-container:hover .normal-icon {
    display: none;
}

.twitter-icon-container:hover .hover-icon {
    display: block;
}