html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}

input,
select,
textarea {
    font-size: max(16px, 1em);
}

input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea {
    min-height: 44px;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: rgba(15, 118, 110, 0.16);
}

.course,
.card,
.admin-card,
.testimonial-card,
.review-card,
.stat,
.login-box,
.course-form,
.teacher-form,
.review-form,
.testimonial-form,
.filter-form,
.search-form,
.course-table-wrap,
.teacher-table-wrap,
.table-wrap,
.hero-copy,
.hero-media {
    transition:
        transform 220ms ease,
        box-shadow 220ms ease,
        border-color 220ms ease,
        opacity 360ms ease;
}

.course:hover,
.card:hover,
.admin-card:hover,
.testimonial-card:hover,
.review-card:hover,
.stat:hover,
.login-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
}

.course:active,
.card:active,
.admin-card:active,
.testimonial-card:active,
.review-card:active,
.stat:active,
.primary-button:active,
.secondary-button:active,
.danger-button:active,
.search-button:active,
.course-admin-link:active,
.admin-link:active,
.edit-link:active,
.duplicate-link:active,
.delete-link:active,
.btn-light:active,
.hero-course-link:active,
.cta:active,
.cta-secondary:active,
.media-button:active,
.logout-button:active,
.is-pressed {
    transform: translateY(1px) scale(0.99);
}

.thumb,
.hero-image img,
.hero-media img,
.hero-media video,
.testimonial-media,
.image-preview img,
.image-preview video,
.preview video,
.avatar-preview img,
.student-avatar img,
.instructor img {
    transition: transform 360ms ease, filter 360ms ease;
}

.course:hover .thumb img,
.card:hover > .thumb,
.testimonial-card:hover .testimonial-media,
.hero-media:hover img,
.hero-media:hover video,
.image-preview:hover img,
.image-preview:hover video,
.preview:hover video,
.avatar-preview:hover img {
    transform: scale(1.035);
}

.course:hover .title,
.card:hover h3,
.admin-card:hover h2,
.review-card:hover b {
    color: #0f766e;
}

tr {
    transition: background-color 180ms ease;
}

tbody tr:hover {
    background: #f8fafc;
}

.primary-button,
.secondary-button,
.danger-button,
.search-button,
.course-admin-link,
.admin-link,
.edit-link,
.duplicate-link,
.delete-link,
.btn-light,
.cta,
.cta-secondary,
.media-button,
.logout-button,
.search button,
.filters button,
.join-form button,
.hero-course-link {
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        background-color 180ms ease,
        border-color 180ms ease;
}

.primary-button:hover,
.search-button:hover,
.search button:hover,
.filters button:hover,
.join-form button:hover,
.hero-course-link:hover,
.cta:hover {
    box-shadow: 0 12px 24px rgba(15, 118, 110, 0.18);
}

.course-admin-link:hover,
.admin-link:hover,
.edit-link:hover,
.duplicate-link:hover,
.delete-link:hover,
.btn-light:hover,
.hero-course-link:hover,
.cta-secondary:hover,
.media-button:hover,
.logout-button:hover {
    transform: translateY(-2px);
}

html.ux-effects-ready .ux-reveal {
    opacity: 0;
    transform: translateY(18px) scale(0.985);
}

html.ux-effects-ready .ux-reveal.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.ux-spotlight {
    transform: translateY(-4px) scale(1.01);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
    border-color: rgba(15, 118, 110, 0.32);
}

body.media-modal-open {
    overflow: hidden;
}

.media-modal.is-open .media-panel {
    max-height: min(760px, calc(100dvh - 20px));
}

@media (max-width: 760px) {
    .admin-actions > *,
    .row-actions > *,
    .course-admin-actions > *,
    .media-actions > * {
        flex: 1 1 auto;
    }

    .search,
    .join-form {
        border-radius: 8px;
        align-items: stretch;
    }

    .search input,
    .search button,
    .join-form input,
    .join-form button {
        min-height: 46px;
        border-radius: 8px;
    }

    .whatsapp-float {
        right: 14px;
        bottom: 14px;
        width: 54px;
        height: 54px;
    }
}

@media (max-width: 560px) {
    .search,
    .join-form {
        display: grid;
        gap: 8px;
    }

    .search {
        padding: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }

    html.ux-effects-ready .ux-reveal,
    html.ux-effects-ready .ux-reveal.is-visible,
    .ux-spotlight,
    .course:hover,
    .card:hover,
    .admin-card:hover,
    .testimonial-card:hover,
    .review-card:hover,
    .stat:hover,
    .login-box:hover {
        opacity: 1;
        transform: none;
        box-shadow: inherit;
    }
}