/* =========================================================
   COPUCHA PLAY V3 — FULL APP LAYOUT
========================================================= */

/* Ocultar scroll general del sitio en Copucha Play */
body.page-template-page-videos,
body.page-template-page-videos-php {
    background: #000 !important;
    overflow: hidden !important;
}

/* =========================================================
   OCULTAR HEADER GLOBAL SOLO EN COPUCHA PLAY
========================================================= */

body.page-template-page-videos .cvc-top-nav,
body.page-template-page-videos-php .cvc-top-nav,
body.page-template-page-videos .cvc-top-header-row,
body.page-template-page-videos-php .cvc-top-header-row,
body.page-template-page-videos .cvc-top-nav-scroll,
body.page-template-page-videos-php .cvc-top-nav-scroll,
.cvc-top-nav,
.cvc-top-header-row,
.cvc-top-nav-scroll,
body.page-template-page-videos .site-header,
body.page-template-page-videos-php .site-header,
body.page-template-page-videos header.site-header,
body.page-template-page-videos-php header.site-header,
body.page-template-page-videos #masthead,
body.page-template-page-videos-php #masthead,
body.page-template-page-videos .elementor-location-header,
body.page-template-page-videos-php .elementor-location-header,
body.page-template-page-videos .cvc-main-header,
body.page-template-page-videos-php .cvc-main-header,
body.page-template-page-videos .cvc-site-header,
body.page-template-page-videos-php .cvc-site-header,
body.page-template-page-videos .cvc-header-global,
body.page-template-page-videos-php .cvc-header-global,
body.page-template-page-videos .cvc-categorias,
body.page-template-page-videos-php .cvc-categorias,
body.page-template-page-videos .cvc-categorias-wrapper,
body.page-template-page-videos-php .cvc-categorias-wrapper,
body.page-template-page-videos .cvc-category-nav,
body.page-template-page-videos-php .cvc-category-nav,
body.page-template-page-videos .cvc-category-tabs,
body.page-template-page-videos-php .cvc-category-tabs,
body.page-template-page-videos .cvc-menu-categorias,
body.page-template-page-videos-php .cvc-menu-categorias,
body.page-template-page-videos .cvc-stories-wrapper,
body.page-template-page-videos-php .cvc-stories-wrapper {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* Contenedor principal tipo app */
.cvc-app-box.cvc-play-v3 {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100dvh !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #000 !important;
    color: #fff !important;

    overflow: hidden !important;
    z-index: 999000 !important;
}

/* Ajuste si estás logueado como admin y aparece admin bar */
body.admin-bar .cvc-app-box.cvc-play-v3 {
    top: 32px !important;
    height: calc(100dvh - 32px) !important;
}

@media (max-width: 782px) {
    body.admin-bar .cvc-app-box.cvc-play-v3 {
        top: 46px !important;
        height: calc(100dvh - 46px) !important;
    }
}

/* Feed centrado en desktop, fullscreen en móvil */
.cvc-feed {
    position: relative !important;

    width: min(450px, 100vw) !important;
    height: 100dvh !important;

    margin: 0 auto !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    scroll-snap-type: y mandatory !important;
    scroll-behavior: smooth !important;

    background: #000 !important;

    scrollbar-width: none !important;
}

.cvc-feed::-webkit-scrollbar {
    display: none !important;
}

/* Cada video ocupa pantalla completa */
.cvc-item {
    position: relative !important;

    width: 100% !important;
    height: 100dvh !important;
    min-height: 100dvh !important;

    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;

    overflow: hidden !important;
    background: #000 !important;
}

/* Video */
.cvc-video {
    position: absolute !important;
    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
    object-position: center center !important;

    background: #000 !important;
    z-index: 1 !important;
}

/* Degradado de lectura */
.cvc-overlay {
    position: absolute !important;
    inset: 0 !important;

    z-index: 2 !important;
    pointer-events: none !important;

    background:
        linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0.38) 0%,
            rgba(0, 0, 0, 0.08) 28%,
            rgba(0, 0, 0, 0.12) 52%,
            rgba(0, 0, 0, 0.86) 100%
        ) !important;
}

/* =========================================================
   TOPBAR PROPIA DE COPUCHA PLAY
========================================================= */

.cvc-play-topbar {
    position: absolute !important;
    top: 0 !important;
    left: 50% !important;

    width: min(450px, 100vw) !important;
    height: 58px !important;

    transform: translateX(-50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 0 15px !important;
    box-sizing: border-box !important;

    z-index: 80 !important;

    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.58),
        rgba(0, 0, 0, 0)
    ) !important;
}

.cvc-play-back {
    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    text-decoration: none !important;
    color: #fff !important;

    font-size: 26px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.14) !important;

    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.85) !important;
}

.cvc-play-brand {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;

    white-space: nowrap !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    letter-spacing: -0.6px !important;
    line-height: 1 !important;

    text-transform: uppercase !important;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.85) !important;
}

.cvc-play-brand .brand-la {
    color: #fff !important;
}

.cvc-play-brand .brand-copucha {
    color: #ff2d7a !important;
}

.cvc-play-brand .brand-play {
    color: #fff !important;
    margin-left: 5px !important;
}

.cvc-play-user {
    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: relative !important;
    z-index: 90 !important;
}

.cvc-play-user img {
    width: 34px !important;
    height: 34px !important;

    border-radius: 50% !important;
    object-fit: cover !important;

    border: 2px solid #ff2d7a !important;
    box-shadow: 0 0 14px rgba(255, 45, 122, 0.45) !important;
}

.cvc-play-user a {
    color: #fff !important;
    text-decoration: none !important;
    font-size: 20px !important;
}

/* =========================================================
   MENÚ USUARIO COPUCHA PLAY
========================================================= */

.cvc-play-user-menu {
    position: relative !important;
    z-index: 9999 !important;
}

.cvc-play-user-btn,
.cvc-play-user-login {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;
    outline: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    color: #fff !important;

    cursor: pointer !important;
}

.cvc-play-user-login {
    background: rgba(0, 0, 0, 0.28) !important;
    font-size: 18px !important;
}

.cvc-play-user-dropdown {
    position: absolute !important;
    top: 48px !important;
    right: 0 !important;

    width: 260px !important;
    padding: 12px !important;

    display: none !important;

    background: rgba(8, 8, 10, 0.98) !important;
    color: #fff !important;

    border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.65),
        0 0 0 1px rgba(255, 45, 122, 0.10) !important;

    backdrop-filter: blur(18px) !important;

    z-index: 99999999 !important;
}

.cvc-play-user-dropdown.is-open {
    display: block !important;
}

.cvc-play-account-card {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;

    padding: 9px !important;
    border-radius: 14px !important;

    text-decoration: none !important;
    color: #fff !important;
}

.cvc-play-account-card:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

.cvc-play-account-card img {
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    object-fit: cover !important;

    border: 2px solid #ff2d7a !important;
}

.cvc-play-account-card div {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

.cvc-play-account-card strong {
    max-width: 170px !important;

    color: #fff !important;

    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;

    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.cvc-play-account-card span {
    margin-top: 4px !important;

    color: rgba(255, 255, 255, 0.72) !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
}

.cvc-play-menu-separator {
    height: 1px !important;
    margin: 10px 4px !important;

    background: rgba(255, 255, 255, 0.10) !important;
}

.cvc-play-menu-item {
    width: 100% !important;
    min-height: 44px !important;

    display: flex !important;
    align-items: center !important;
    gap: 11px !important;

    padding: 9px 10px !important;
    box-sizing: border-box !important;

    border: 0 !important;
    border-radius: 12px !important;

    background: transparent !important;
    color: #fff !important;

    text-decoration: none !important;
    text-align: left !important;

    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;

    cursor: pointer !important;
}

.cvc-play-menu-item:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

.cvc-play-menu-icon {
    width: 30px !important;
    height: 30px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    border-radius: 50% !important;

    background: rgba(255, 255, 255, 0.10) !important;

    font-size: 15px !important;
}

.cvc-play-menu-item small {
    margin-left: auto !important;

    color: #ff2d7a !important;

    font-size: 11px !important;
    font-weight: 900 !important;
}

.cvc-play-logout .cvc-play-menu-icon {
    background: rgba(255, 45, 122, 0.14) !important;
    color: #ff2d7a !important;
}

/* Estado de audio */
.cvc-audio-state {
    position: absolute !important;
    left: 50% !important;
    top: 72px !important;

    transform: translateX(-50%) !important;

    z-index: 20 !important;

    min-width: 42px !important;
    height: 28px !important;
    padding: 0 10px !important;

    display: none !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 999px !important;

    background: rgba(0, 0, 0, 0.42) !important;
    color: #fff !important;

    font-size: 14px !important;
    line-height: 1 !important;

    backdrop-filter: blur(8px) !important;
}

.cvc-audio-state.show,
.cvc-audio-state.visible {
    display: flex !important;
}

/* =========================================================
   INFO DEL VIDEO
========================================================= */

.cvc-info {
    position: absolute !important;

    left: 18px !important;
    right: 92px !important;
    bottom: 102px !important;

    z-index: 10 !important;

    color: #fff !important;

    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.85) !important;
}

.cvc-info h3 {
    margin: 0 0 7px 0 !important;

    color: #fff !important;

    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;

    letter-spacing: -0.2px !important;
}

.cvc-info p {
    margin: 0 0 8px 0 !important;

    color: rgba(255, 255, 255, 0.92) !important;

    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.28 !important;
}

.cvc-tags {
    color: #ff2d7a !important;

    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

/* =========================================================
   BOTONES DERECHA
========================================================= */

.cvc-actions {
    position: absolute !important;

    right: 18px !important;
    bottom: 104px !important;

    z-index: 12 !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 15px !important;
}

.cvc-actions button {
    width: 52px !important;
    min-height: 50px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;
    color: #fff !important;

    cursor: pointer !important;

    text-align: center !important;

    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.85) !important;
}

.cvc-actions button svg {
    width: 31px !important;
    height: 31px !important;

    display: block !important;

    margin: 0 0 4px 0 !important;

    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.72)) !important;
}

.cvc-actions button span {
    display: block !important;

    max-width: 62px !important;

    color: #fff !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;

    text-align: center !important;
    white-space: nowrap !important;
}

/* Fuego video */
.btn-fuego svg {
    fill: #ff2d7a !important;
}

.btn-fuego.active svg {
    transform: scale(1.1) !important;
    filter:
        drop-shadow(0 2px 8px rgba(0, 0, 0, 0.72))
        drop-shadow(0 0 10px rgba(255, 45, 122, 0.85)) !important;
}

.btn-fuego.active .count,
.btn-fuego .count {
    color: #ff2d7a !important;
}

/* Comentarios con cantidad */
.btn-comentar.has-comments .comment-count {
    color: #fff !important;
}

/* Guardar activo */
.btn-guardar.active svg,
.btn-guardar.active svg path {
    fill: #ff2d7a !important;
    stroke: #ff2d7a !important;
}

.btn-guardar.active span {
    color: #ff2d7a !important;
}

/* Loading social */
.btn-fuego.loading,
.btn-guardar.loading,
.btn-comentar.loading {
    opacity: 0.65 !important;
    pointer-events: none !important;
}

/* =========================================================
   BOTTOM NAV DEL SITIO
========================================================= */

body.page-template-page-videos .cvc-bottom-nav,
body.page-template-page-videos-php .cvc-bottom-nav {
    z-index: 999999 !important;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 480px) {
    .cvc-feed,
    .cvc-play-topbar {
        width: 100vw !important;
    }

    .cvc-play-topbar {
        height: 56px !important;
        padding: 0 13px !important;
    }

    .cvc-play-brand {
        font-size: 15px !important;
    }

    .cvc-play-back {
        width: 36px !important;
        height: 36px !important;
        font-size: 25px !important;
    }

    .cvc-play-user,
    .cvc-play-user img {
        width: 34px !important;
        height: 34px !important;
    }

    .cvc-play-user-dropdown {
        top: 46px !important;
        right: 0 !important;
        width: 252px !important;
    }

    .cvc-info {
        left: 16px !important;
        right: 86px !important;
        bottom: 98px !important;
    }

    .cvc-info h3 {
        font-size: 15px !important;
    }

    .cvc-info p {
        font-size: 13px !important;
    }

    .cvc-actions {
        right: 14px !important;
        bottom: 98px !important;
        gap: 14px !important;
    }

    .cvc-actions button {
        width: 50px !important;
        min-height: 48px !important;
    }

    .cvc-actions button svg {
        width: 30px !important;
        height: 30px !important;
    }

    .cvc-actions button span {
        font-size: 10.5px !important;
    }
}

@media (max-height: 720px) {
    .cvc-actions {
        gap: 10px !important;
        bottom: 88px !important;
    }

    .cvc-actions button {
        min-height: 43px !important;
    }

    .cvc-actions button svg {
        width: 27px !important;
        height: 27px !important;
        margin-bottom: 2px !important;
    }

    .cvc-actions button span {
        font-size: 10px !important;
    }

    .cvc-info {
        bottom: 86px !important;
    }

    .cvc-info h3 {
        font-size: 14px !important;
    }

    .cvc-info p {
        font-size: 12px !important;
    }
}

@media (min-width: 768px) {
    .cvc-app-box.cvc-play-v3 {
        background: #050505 !important;
    }

    .cvc-feed {
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
    }
}

/* =========================================================
   COPUCHA PLAY — USER DROPDOWN IGUAL AL MENÚ GLOBAL
========================================================= */

.cvc-play-user-dropdown {
    display: none !important;
    position: absolute !important;
    right: 0 !important;
    top: 45px !important;

    width: 250px !important;
    padding: 12px !important;

    background: var(--bg-main, #ffffff) !important;
    border: 1px solid var(--border-color, #e5e5e5) !important;
    border-radius: 12px !important;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 15px !important;

    z-index: 99999999 !important;

    color: var(--text-main, #050505) !important;

    backdrop-filter: none !important;
}

.cvc-play-user-dropdown.is-open {
    display: block !important;
}

/* Tarjeta superior del usuario */
.cvc-play-account-card {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    padding: 10px !important;

    text-decoration: none !important;
    color: var(--text-main, #050505) !important;

    border-radius: 8px !important;
    background: transparent !important;

    transition: background 0.2s ease !important;
}

.cvc-play-account-card:hover {
    background: var(--bg-hover, #f2f2f2) !important;
}

.cvc-play-account-card img {
    width: 40px !important;
    height: 40px !important;

    border-radius: 50% !important;
    object-fit: cover !important;

    border: 0 !important;
    box-shadow: none !important;
}

.cvc-play-account-card div {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    min-width: 0 !important;
}

.cvc-play-account-card strong {
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;

    color: var(--text-main, #050505) !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;

    max-width: 165px !important;
}

.cvc-play-account-card span {
    font-size: 13px !important;
    line-height: 1.2 !important;

    color: var(--text-muted, #65676B) !important;

    margin-top: 3px !important;
}

/* Separador */
.cvc-play-menu-separator {
    height: 1px !important;
    margin: 10px 0 !important;

    background: var(--border-color, #e5e5e5) !important;
}

/* Items del menú */
.cvc-play-menu-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    width: 100% !important;
    min-height: 44px !important;

    padding: 10px !important;

    border: 0 !important;
    border-radius: 8px !important;

    background: transparent !important;
    color: var(--text-main, #050505) !important;

    text-decoration: none !important;
    text-align: left !important;

    font-weight: 500 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;

    transition: background 0.2s ease !important;

    cursor: pointer !important;
}

.cvc-play-menu-item:hover {
    background: var(--bg-hover, #f2f2f2) !important;
}

.cvc-play-menu-icon {
    width: 32px !important;
    height: 32px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;

    background: #e4e6eb !important;
    color: #1c1e21 !important;

    font-size: 16px !important;

    flex: 0 0 auto !important;
}

/* Botón cerrar sesión */
.cvc-play-logout {
    color: var(--text-main, #050505) !important;
}

.cvc-play-logout .cvc-play-menu-icon {
    background: #e4e6eb !important;
    color: #1c1e21 !important;
}

/* Botón “Pronto” */
.cvc-play-menu-item small {
    margin-left: auto !important;

    color: var(--text-muted, #65676B) !important;

    font-size: 12px !important;
    font-weight: 600 !important;
}

/* Modo oscuro: mantiene coherencia si tu sitio usa variables dark */
body.dark-mode .cvc-play-user-dropdown {
    background: var(--bg-main, #111111) !important;
    border-color: var(--border-color, #2a2a2a) !important;
    color: var(--text-main, #ffffff) !important;
}

body.dark-mode .cvc-play-account-card,
body.dark-mode .cvc-play-menu-item {
    color: var(--text-main, #ffffff) !important;
}

body.dark-mode .cvc-play-account-card strong {
    color: var(--text-main, #ffffff) !important;
}

body.dark-mode .cvc-play-account-card span,
body.dark-mode .cvc-play-menu-item small {
    color: var(--text-muted, #a0a0a8) !important;
}

body.dark-mode .cvc-play-account-card:hover,
body.dark-mode .cvc-play-menu-item:hover {
    background: var(--bg-hover, #1f1f25) !important;
}

body.dark-mode .cvc-play-menu-icon {
    background: #2f3037 !important;
    color: #ffffff !important;
}


/* =========================================================
   FIX: MENÚ USUARIO COPUCHA PLAY IGUAL AL GLOBAL
========================================================= */

.cvc-play-native-user-menu img {
    box-shadow: none !important;
}

#cvc-play-native-user-menu-btn img {
    border: 2px solid #ff2d7a !important;
    box-shadow: 0 0 14px rgba(255,45,122,0.45) !important;
}

#cvc-play-native-user-dropdown img {
    border: 0 !important;
    box-shadow: none !important;
}

#cvc-play-native-user-dropdown a,
#cvc-play-native-user-dropdown span {
    text-shadow: none !important;
}

body.dark-mode #cvc-play-native-user-dropdown {
    background: var(--bg-main, #060606) !important;
    border-color: var(--border-color, #222) !important;
}

body.dark-mode #cvc-play-native-user-dropdown a {
    color: var(--text-main, #ffffff) !important;
}

body.dark-mode #cvc-play-native-user-dropdown a:hover {
    background: var(--bg-hover, #151515) !important;
}

body.dark-mode #cvc-play-native-user-dropdown hr {
    border-top-color: var(--border-color, #222) !important;
}

body.dark-mode #cvc-play-native-user-dropdown span:first-child {
    color: var(--text-main, #ffffff) !important;
}

body.dark-mode #cvc-play-native-user-dropdown span:last-child {
    color: var(--text-muted, #9ca3af) !important;
}

/* =========================================================
   COPUCHA PLAY — NUEVO ICONO FUEGO OUTLINE / ACTIVE FILLED
========================================================= */

/* Estado normal: fuego outline */
.btn-fuego {
    color: #ffffff !important;
}

.btn-fuego svg {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
}

.btn-fuego svg path {
    fill: none !important;
    stroke: currentColor !important;
}

.btn-fuego .count {
    color: #ffffff !important;
}

/* Estado activo: fuego relleno rosado */
.btn-fuego.active {
    color: #ff2d7a !important;
}

.btn-fuego.active svg {
    fill: #ff2d7a !important;
    stroke: #ff2d7a !important;
    transform: scale(1.08) !important;
    filter:
        drop-shadow(0 2px 8px rgba(0, 0, 0, 0.72))
        drop-shadow(0 0 10px rgba(255, 45, 122, 0.75)) !important;
}

.btn-fuego.active svg path {
    fill: #ff2d7a !important;
    stroke: #ff2d7a !important;
}

.btn-fuego.active .count {
    color: #ff2d7a !important;
}

/* =========================================================
   COPUCHA PLAY — LINKS EN TITULAR Y TAGS
========================================================= */

.cvc-info h3 a,
.cvc-info h3 a:visited,
.cvc-info h3 a:hover,
.cvc-info h3 a:active {
    color: inherit !important;
    text-decoration: none !important;
}

.cvc-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.cvc-tags a,
.cvc-tags a:visited,
.cvc-tags a:hover,
.cvc-tags a:active,
.cvc-tag-link,
.cvc-tag-link:visited,
.cvc-tag-link:hover,
.cvc-tag-link:active {
    color: #ff2d7a !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}


/* =========================================================
   COPUCHA PLAY — BOTONES SIN TEXTO EN GUARDAR Y ENVIAR
========================================================= */

.btn-guardar span,
.btn-enviar span {
    display: none !important;
}

.btn-guardar,
.btn-enviar {
    gap: 0 !important;
}

.btn-guardar svg,
.btn-enviar svg {
    margin-bottom: 0 !important;
}

.btn-guardar,
.btn-enviar,
.btn-fuego,
.btn-comentar {
    min-height: auto !important;
}

/* Mantener alineación limpia */
.cvc-actions {
    gap: 18px !important;
}

/* Guardado activo */
.btn-guardar.active {
    color: #ff2d7a !important;
}

.btn-guardar.active svg,
.btn-guardar.active svg path {
    stroke: #ff2d7a !important;
    fill: none !important;
}

/* Enviar: icono limpio, más grueso, sin relleno */
.btn-enviar {
    color: #ffffff !important;
}

.btn-enviar svg {
    width: 33px !important;
    height: 33px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.1 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    margin-bottom: 0 !important;
    transform: none !important;
}

.btn-enviar svg path,
.btn-enviar svg line,
.btn-enviar svg polygon {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.1 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.btn-enviar:active svg {
    transform: scale(0.94) !important;
}

/* =========================================================
   COPUCHA PLAY — INDICADOR DE PAUSA + AUDIO SVG
========================================================= */

.cvc-pause-indicator {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) scale(0.95) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;

    z-index: 30 !important;

    opacity: 0 !important;
    pointer-events: none !important;

    transition:
        opacity 0.18s ease,
        transform 0.18s ease !important;
}

.cvc-pause-indicator.show {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translate(-50%, -50%) scale(1) !important;
}

.cvc-pause-play-btn,
.cvc-pause-mute-btn {
    width: 68px !important;
    height: 68px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: rgba(0, 0, 0, 0.46) !important;
    color: #ffffff !important;

    cursor: pointer !important;
    pointer-events: auto !important;

    backdrop-filter: blur(8px) !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.35) !important;

    text-shadow: none !important;

    transition:
        transform 0.15s ease,
        background 0.15s ease !important;
}

.cvc-pause-play-btn:hover,
.cvc-pause-mute-btn:hover {
    background: rgba(0, 0, 0, 0.58) !important;
}

.cvc-pause-play-btn:active,
.cvc-pause-mute-btn:active {
    transform: scale(0.92) !important;
    background: rgba(0, 0, 0, 0.62) !important;
}

.cvc-pause-play-btn svg,
.cvc-pause-mute-btn svg {
    display: block !important;
    flex: 0 0 auto !important;
}

.cvc-pause-play-btn svg {
    width: 28px !important;
    height: 28px !important;
    fill: currentColor !important;
    stroke: none !important;
    transform: translateX(1px) !important;
}

.cvc-pause-play-btn svg path,
.cvc-pause-play-btn svg rect {
    fill: currentColor !important;
    stroke: none !important;
}

.cvc-pause-mute-btn svg {
    width: 36px !important;
    height: 31px !important;
    fill: currentColor !important;
    stroke: none !important;
}

.cvc-pause-mute-btn svg path:first-child {
    fill: currentColor !important;
}

.cvc-pause-mute-btn svg path:not(:first-child) {
    fill: none !important;
    stroke: currentColor !important;
}

@media (max-width: 480px) {
    .cvc-pause-indicator {
        gap: 12px !important;
    }

    .cvc-pause-play-btn,
    .cvc-pause-mute-btn {
        width: 62px !important;
        height: 62px !important;
    }

    .cvc-pause-play-btn svg {
        width: 26px !important;
        height: 26px !important;
    }

    .cvc-pause-mute-btn svg {
        width: 34px !important;
        height: 29px !important;
    }
}

.cvc-pause-play-btn,
.cvc-pause-mute-btn {
    width: 62px !important;
    height: 62px !important;
}

.cvc-pause-play-btn svg {
    width: 25px !important;
    height: 25px !important;
}

.cvc-pause-mute-btn svg {
    width: 33px !important;
    height: 28px !important;
}

@media (max-width: 480px) {
    .cvc-pause-play-btn,
    .cvc-pause-mute-btn {
        width: 58px !important;
        height: 58px !important;
    }

    .cvc-pause-play-btn svg {
        width: 24px !important;
        height: 24px !important;
    }

    .cvc-pause-mute-btn svg {
        width: 31px !important;
        height: 27px !important;
    }
}




/* =========================================================
   COPUCHA PLAY — MP4 PROPIO CON CONTROLES IGUALES A YOUTUBE
   Audio arriba + Play centrado + sin volumen
========================================================= */

/* Ocultar cualquier volumen MP4 si quedó creado antes */
.cvc-native-volume-panel,
.cvc-native-volume-range {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
}

/* Capa general de controles MP4 */
.cvc-pause-indicator {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;

    width: 90px !important;
    height: 150px !important;

    transform: translate(-50%, -50%) scale(0.96) !important;

    display: block !important;

    z-index: 30 !important;

    opacity: 0 !important;
    pointer-events: none !important;

    transition:
        opacity 0.18s ease,
        transform 0.18s ease !important;
}

/* Cuando el video está pausado */
.cvc-pause-indicator.show {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translate(-50%, -50%) scale(1) !important;
}

/* Si existe contenedor interno, lo dejamos como capa */
.cvc-pause-main-controls {
    position: relative !important;

    width: 90px !important;
    height: 150px !important;

    display: block !important;

    padding: 0 !important;
    margin: 0 !important;
}

/* =========================================================
   BOTÓN PLAY / PAUSE — GRANDE Y CENTRADO
========================================================= */

.cvc-pause-play-btn {
    position: absolute !important;
    left: 50% !important;
    top: 76px !important;

    width: 64px !important;
    height: 64px !important;

    transform: translate(-50%, -50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: rgba(0, 0, 0, 0.58) !important;
    color: #ffffff !important;

    cursor: pointer !important;
    pointer-events: auto !important;

    backdrop-filter: blur(10px) !important;

    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.42),
        0 0 0 1px rgba(255, 255, 255, 0.07) !important;

    z-index: 3 !important;

    transition:
        transform 0.15s ease,
        background 0.15s ease !important;
}

.cvc-pause-play-btn:active {
    transform: translate(-50%, -50%) scale(0.92) !important;
    background: rgba(0, 0, 0, 0.70) !important;
}

.cvc-pause-play-btn svg {
    width: 25px !important;
    height: 25px !important;

    display: block !important;

    fill: currentColor !important;
    stroke: none !important;

    transform: translateX(1px) !important;
}

.cvc-pause-play-btn svg path,
.cvc-pause-play-btn svg rect {
    fill: currentColor !important;
    stroke: none !important;
}

/* =========================================================
   BOTÓN AUDIO — ARRIBA DEL PLAY
========================================================= */

.cvc-pause-mute-btn {
    position: absolute !important;
    left: 50% !important;
    top: 6px !important;

    width: 34px !important;
    height: 34px !important;

    transform: translateX(-50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: rgba(0, 0, 0, 0.54) !important;
    color: #ffffff !important;

    cursor: pointer !important;
    pointer-events: auto !important;

    backdrop-filter: blur(8px) !important;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.36),
        0 0 0 1px rgba(255, 255, 255, 0.07) !important;

    z-index: 4 !important;

    transition:
        transform 0.15s ease,
        background 0.15s ease !important;
}

.cvc-pause-mute-btn:active {
    transform: translateX(-50%) scale(0.92) !important;
    background: rgba(0, 0, 0, 0.68) !important;
}

.cvc-pause-mute-btn svg {
    width: 18px !important;
    height: 18px !important;

    display: block !important;

    fill: currentColor !important;
    stroke: none !important;
}

.cvc-pause-mute-btn svg path:first-child {
    fill: currentColor !important;
}

.cvc-pause-mute-btn svg path:not(:first-child) {
    fill: none !important;
    stroke: currentColor !important;
}

/* =========================================================
   MÓVIL
========================================================= */

@media (max-width: 480px) {
    .cvc-pause-indicator {
        width: 84px !important;
        height: 142px !important;
    }

    .cvc-pause-main-controls {
        width: 84px !important;
        height: 142px !important;
    }

    .cvc-pause-play-btn {
        width: 60px !important;
        height: 60px !important;
        top: 74px !important;
    }

    .cvc-pause-play-btn svg {
        width: 23px !important;
        height: 23px !important;
    }

    .cvc-pause-mute-btn {
        width: 32px !important;
        height: 32px !important;
        top: 4px !important;
    }

    .cvc-pause-mute-btn svg {
        width: 17px !important;
        height: 17px !important;
    }
}

/* CVC_TIKTOK_PLAY_NATIVE_CORRECTED_V2_START */

/* =========================================================
   ESTILO TIKTOK CORREGIDO
   MP4 propio
========================================================= */

body .cvc-pause-play-btn {
    position: relative !important;

    width: clamp(56px, 7vh, 64px) !important;
    min-width: clamp(56px, 7vh, 64px) !important;
    max-width: clamp(56px, 7vh, 64px) !important;

    height: clamp(56px, 7vh, 64px) !important;
    min-height: clamp(56px, 7vh, 64px) !important;
    max-height: clamp(56px, 7vh, 64px) !important;

    flex:
        0 0
        clamp(56px, 7vh, 64px) !important;

    aspect-ratio: 1 / 1 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-style: none !important;
    border-radius: 99999px !important;

    background: rgba(22, 24, 35, 0.60) !important;
    background-image: none !important;

    color: #ffffff !important;

    box-shadow: none !important;
    outline: none !important;

    overflow: hidden !important;

    cursor: pointer !important;
    touch-action: manipulation !important;

    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-user-drag: none !important;

    appearance: none !important;
    -webkit-appearance: none !important;

    transform: none !important;

    transition:
        background-color 0.12s ease,
        opacity 0.12s ease,
        filter 0.12s ease !important;
}

/* Ocultar SVG anterior */
body .cvc-pause-play-btn > svg {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    opacity: 0 !important;
    visibility: hidden !important;

    pointer-events: none !important;

    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-user-drag: none !important;
}

/* Triángulo play */
body .cvc-pause-play-btn::before {
    content: "" !important;

    position: absolute !important;

    left: 50% !important;
    top: 50% !important;

    width: 40% !important;
    height: 46% !important;

    transform:
        translate(-42%, -50%) !important;

    background: #ffffff !important;

    clip-path:
        polygon(
            0 0,
            100% 50%,
            0 100%
        ) !important;

    -webkit-clip-path:
        polygon(
            0 0,
            100% 50%,
            0 100%
        ) !important;

    border: 0 !important;
    border-radius: 1px !important;

    filter:
        drop-shadow(
            0 1px 2px rgba(0, 0, 0, 0.24)
        ) !important;

    pointer-events: none !important;
}

/* Pausa */
body .cvc-pause-play-btn[aria-label^="Pausar"]::before {
    width: 30% !important;
    height: 42% !important;

    transform:
        translate(-50%, -50%) !important;

    background:
        linear-gradient(
            to right,
            #ffffff 0%,
            #ffffff 31%,
            transparent 31%,
            transparent 69%,
            #ffffff 69%,
            #ffffff 100%
        ) !important;

    clip-path: none !important;
    -webkit-clip-path: none !important;

    border-radius: 1px !important;
}

body .cvc-pause-play-btn:active {
    background:
        rgba(22, 24, 35, 0.76) !important;

    transform: none !important;
    filter: brightness(0.96) !important;
}

body .cvc-pause-play-btn:focus-visible {
    outline:
        2px solid rgba(255, 255, 255, 0.82) !important;

    outline-offset: 3px !important;
}

/* CVC_TIKTOK_PLAY_NATIVE_CORRECTED_V2_END */

/* CVC_MP4_MEDIA_RECT_CENTER_V4_START */

/* =========================================================
   INDICADOR AJUSTADO AL ÁREA VISIBLE DEL VIDEO
========================================================= */

body.page-template-page-videos
.cvc-item
.cvc-pause-indicator.cvc-media-rect-centered {
    position: absolute !important;

    inset: auto !important;

    left:
        var(
            --cvc-mp4-media-left,
            0px
        ) !important;

    top:
        var(
            --cvc-mp4-media-top,
            0px
        ) !important;

    width:
        var(
            --cvc-mp4-media-width,
            100%
        ) !important;

    height:
        var(
            --cvc-mp4-media-height,
            100%
        ) !important;

    right: auto !important;
    bottom: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;

    box-sizing: border-box !important;

    pointer-events: none !important;
}

/*
 * La caja principal ocupa exactamente
 * el área visible calculada del video.
 */
body.page-template-page-videos
.cvc-pause-indicator.cvc-media-rect-centered
.cvc-pause-main-controls {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;

    pointer-events: none !important;
}

/*
 * El botón se centra dentro del área visible,
 * no dentro del item completo.
 */
body.page-template-page-videos
.cvc-pause-indicator.cvc-media-rect-centered
.cvc-pause-play-btn {
    position: absolute !important;

    left: 50% !important;
    top: 50% !important;

    right: auto !important;
    bottom: auto !important;

    margin: 0 !important;

    transform:
        translate(-50%, -50%) !important;

    transform-origin:
        center center !important;

    z-index: 20 !important;

    pointer-events: auto !important;
}

body.page-template-page-videos
.cvc-pause-indicator.cvc-media-rect-centered
.cvc-pause-play-btn:hover,

body.page-template-page-videos
.cvc-pause-indicator.cvc-media-rect-centered
.cvc-pause-play-btn:focus,

body.page-template-page-videos
.cvc-pause-indicator.cvc-media-rect-centered
.cvc-pause-play-btn:active {
    left: 50% !important;
    top: 50% !important;

    margin: 0 !important;

    transform:
        translate(-50%, -50%) !important;
}

/*
 * Audio alineado sobre el centro real.
 */
body.page-template-page-videos
.cvc-pause-indicator.cvc-media-rect-centered
.cvc-pause-mute-btn {
    position: absolute !important;

    left: 50% !important;
    top: calc(50% - 72px) !important;

    right: auto !important;
    bottom: auto !important;

    margin: 0 !important;

    transform:
        translateX(-50%) !important;

    z-index: 21 !important;

    pointer-events: auto !important;
}

/* CVC_MP4_MEDIA_RECT_CENTER_V4_END */