/* Rules every page of the theme declared in its own <style> block, merged once.
   Home-only rules (.tamda_title, .font-mulish weight, hero shape, marquee) stay in home.css. */
.sticky-header-active {
    transform: translateY(0%) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.nav-slant {
    clip-path: polygon(50px 0, 100% 0, 100% 100%, 0% 100%);
}

.nav-slant-sticky {
    clip-path: polygon(60px 0, 100% 0, 100% 100%, 0% 100%);
}

.service-slant {
    clip-path: polygon(0 15px, 100% 0, 100% 100%, 0% 100%);
}

.nav-hover-effect {
    position: relative;
}

.nav-hover-effect::after {
    content: "";
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #ffffff;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.nav-hover-effect:hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

@keyframes spin-slow {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.animate-spin-slow {
    animation: spin-slow 20s linear infinite;
}

.dropdown-menu {
    display: none;
}

.group:hover .dropdown-menu {
    display: block !important;
}

@media (min-width: 640px) {
    .footer-links-layout {
        display: grid !important;
        grid-template-columns: 1fr minmax(280px, 1.6fr) 1fr !important;
    }
}

/* Edit mode only: overlays and full-width layout boxes of the theme sit above a section background
   or a decorative picture, so the editor's hover ("Đổi ảnh nền") and click never reach them. While an
   admin is editing, such a box lets the pointer through to what is under it; its own children stay
   clickable. Visitors and edit mode off: no effect. */
body.client-edit-active .tamda-edit-passthrough {
    pointer-events: none !important;
}

body.client-edit-active .tamda-edit-passthrough > :not(.tamda-edit-passthrough) {
    pointer-events: auto;
}

body.client-edit-active .tamda-edit-target {
    pointer-events: auto !important;
}

/* Edit mode keeps the theme's positioning. The editor sets `position: relative !important` on every
   region ([data-block-key]) and list card (.client-list-item) so its outline and controls can anchor
   to them; the theme stacks hero slides, card pictures and watermarks with `absolute`, which that
   rule turned into a vertical stack the moment an admin pressed Sửa. A region or card the theme
   positions itself keeps its own value (still a containing block for the editor's controls). */
body.client-edit-active [data-block-key].absolute,
body.client-edit-active .client-list-item.absolute {
    position: absolute !important;
}

body.client-edit-active [data-block-key].fixed,
body.client-edit-active .client-list-item.fixed {
    position: fixed !important;
}

body.client-edit-active [data-block-key].sticky,
body.client-edit-active .client-list-item.sticky {
    position: sticky !important;
}

/* No bin on every card: the shop asked for the page to stay clean while editing. A card is still
   removed from the toolbar's "…" menu › Xoá ô, which goes through the same Lưu/Huỷ flow. */
body.client-edit-active .client-list-item > .client-list-remove {
    display: none !important;
}

/* Edit mode: the theme puts `select-none` on cards, sliders and watermarks; selecting a word to colour
   or format it must still work inside a region. */
body.client-edit-active [data-block-key] {
    -webkit-user-select: text !important;
    user-select: text !important;
}
