/*
 * ============================================================
 *  GRIFUS — ATUALIZAÇÃO VISUAL CIRÚRGICA
 *  Arquivo: grifus-visual-upgrade.css
 *  Versão:  1.0
 *  Regras:
 *    - Apenas CSS, sem alteração de PHP/HTML
 *    - Sem mudança de fontes
 *    - Sem quebra de layout mobile existente
 *    - Sem conflito com plugins
 *    - Sem CSS de colunas ou layout global
 *    - Arredondamento estratégico (não exagerado)
 *    - Sem efeitos chamativos
 * ============================================================
 */

/* ============================================================
   1. VARIÁVEIS DE DESIGN (CSS Custom Properties)
   ============================================================ */
:root {
    --gr-radius-sm:  4px;
    --gr-radius-md:  6px;
    --gr-radius-lg:  8px;
    --gr-radius-xl:  10px;
    --gr-shadow-card: 0 2px 8px rgba(0, 0, 0, 0.25), 0 1px 3px rgba(0, 0, 0, 0.15);
    --gr-shadow-box:  0 2px 12px rgba(0, 0, 0, 0.3), 0 1px 4px rgba(0, 0, 0, 0.1);
    --gr-transition:  all 0.18s ease-in-out;
    --gr-border-subtle: rgba(255, 255, 255, 0.05);
}

/* ============================================================
   2. CAIXAS PRINCIPAIS (.box) — cantos arredondados + sombra
   ============================================================ */
#contenedor .contenido .box {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
    box-shadow: var(--gr-shadow-box);
}

/* Header interno das caixas — separador mais suave */
#contenedor .contenido .header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.35);
    background: rgba(0, 0, 0, 0.08);
}

/* ============================================================
   3. CARDS DE FILMES (.items .item) — poster com cantos
   ============================================================ */
.items .item .image {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
    /* overflow:hidden já existia, reforçamos com radius */
}

/* Suaviza a transição do hover no poster */
.items .item .image img {
    transition: var(--gr-transition);
    will-change: filter;
}

/* Badge IMDb no card — cantos mais arredondados */
.items .item .image span.imdb {
    border-radius: var(--gr-radius-sm);
    backdrop-filter: blur(2px);
    background: rgba(0, 0, 0, 0.82);
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Badge de qualidade (calidad2) — já tem radius, refinamos */
span.calidad2 {
    border-radius: 0 0 var(--gr-radius-sm) var(--gr-radius-sm);
    letter-spacing: 0.03em;
}

/* Painel de hover (.boxinfo) — cantos arredondados */
.items .item .boxinfo {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

/* Título dentro do boxinfo */
.items .item .boxinfo span.tt {
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
}

/* ============================================================
   4. CARD ITEM_2 (lista horizontal) — imagem com cantos
   ============================================================ */
.item_2 .item .image img {
    border-radius: var(--gr-radius-sm);
}

/* ============================================================
   5. PÁGINA SINGLE — SBOX (poster + dados do filme)
   ============================================================ */
#single .s_left .sbox {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
    box-shadow: var(--gr-shadow-box);
}

/* Poster do filme na página single — cantos arredondados seguros */
#single .s_left .sbox .imagen {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

#single .s_left .sbox .imagen img {
    border-radius: var(--gr-radius-md);
    display: block;
    width: 100%;
    height: auto;
}

/* Badge IMDb na página single */
.imdb_r .a span {
    border-radius: var(--gr-radius-sm);
}

/* Tags de metadados (.data p.meta span) */
.data p.meta span {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* Tags de metatags — refinamento */
.metatags a {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* ============================================================
   6. MENU DE ABAS DO SINGLE (.itemmenu)
   ============================================================ */
.itemmenu {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

.itemmenu ul li:first-child a {
    border-radius: var(--gr-radius-md) 0 0 var(--gr-radius-md);
}

.itemmenu ul li:last-child a {
    border-radius: 0 var(--gr-radius-md) var(--gr-radius-md) 0;
}

/* ============================================================
   7. TABELA DE DOWNLOADS (.sbox .descargas)
   ============================================================ */
.sbox .descargas {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, 0.2);
}

/* Cabeçalho da tabela de downloads */
.sbox .descargas .pver li.ver {
    background-color: rgba(0, 0, 0, 0.18);
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
}

/* Linhas da tabela de downloads */
.sbox .descargas .pver li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    transition: background-color 0.15s ease;
}

.sbox .descargas .pver li:hover {
    background-color: rgba(255, 255, 255, 0.03);
}

/* ============================================================
   8. BLOCO DE ENLACES/DOWNLOADS ACF (.enlaces_box)
   ============================================================ */
.enlaces_box {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

.enlaces_box ul.enlaces {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

/* Linha de cabeçalho dos enlaces */
.enlaces_box ul.enlaces li.elemento.cabe {
    border-radius: var(--gr-radius-md) var(--gr-radius-md) 0 0;
    background: rgba(0, 0, 0, 0.2);
}

/* Linhas de download/ver online */
.enlaces_box ul.enlaces li.elemento {
    transition: background-color 0.15s ease;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.enlaces_box ul.enlaces li.elemento:hover {
    background-color: rgba(255, 255, 255, 0.04);
}

.enlaces_box ul.enlaces li.elemento:last-child {
    border-bottom: 0;
    border-radius: 0 0 var(--gr-radius-md) var(--gr-radius-md);
}

/* ============================================================
   9. COMENTÁRIOS — acabamento mais elegante
   ============================================================ */

/* Container geral de comentários */
.comentarios {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
}

/* Cada comentário individual */
.commentlist li .comment-body {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

/* Texto do comentário */
.commentlist .comment-body p {
    border-radius: 0 0 var(--gr-radius-sm) var(--gr-radius-sm);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* Avatar do comentário */
.commentlist .avatar {
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.08);
}

/* Botão de resposta */
.commentlist .reply a {
    border-radius: var(--gr-radius-sm);
    padding: 3px 10px;
    transition: var(--gr-transition);
    font-size: 12px;
}

/* Formulário de comentário — inputs */
#commentform input[type=text],
#commentform textarea {
    border-radius: var(--gr-radius-sm);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#commentform input[type=text]:focus,
#commentform textarea:focus {
    box-shadow: 0 0 0 2px rgba(1, 151, 240, 0.2);
}

/* Botão de enviar comentário */
#commentform p.form-submit .submit {
    border-radius: var(--gr-radius-md);
    transition: var(--gr-transition);
    letter-spacing: 0.02em;
}

/* Título da seção de comentários */
.themeform h3.heading {
    border-radius: var(--gr-radius-sm);
    overflow: hidden;
}

.themeform h3.heading span {
    border-radius: var(--gr-radius-sm);
}

/* Navegação de comentários */
.comments-nav a {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* ============================================================
   10. SIDEBAR — refinamento visual
   ============================================================ */

/* Caixas da sidebar no single */
#single .s_right .categorias,
#single .s_right .filtro_y {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
    box-shadow: var(--gr-shadow-card);
    border: 1px solid rgba(0, 0, 0, 0.15);
}

/* Badges de contagem na sidebar */
.categorias li span {
    border-radius: var(--gr-radius-sm);
}

/* ============================================================
   11. SIDEBAR DE TV SHOWS (.sidebartv)
   ============================================================ */
.sidebartv .tvitemrel {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.sidebartv .tvitemrel:hover {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
}

/* Imagem do item relacionado TV */
.sidebartv .tvitemrel .imagetvrel {
    border-radius: var(--gr-radius-md) 0 0 var(--gr-radius-md);
    overflow: hidden;
}

/* Badge de rating na sidebar TV */
.sidebartv .tvitemrel .datatvrel span.rating {
    border-radius: var(--gr-radius-sm);
}

/* ============================================================
   12. SLIDER HOME (.slider_home_box)
   ============================================================ */
.slider_home_box .slider {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

/* ============================================================
   13. BLOCO DE NOTÍCIAS HOME (.news_home)
   ============================================================ */
.news_home .noticias {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
}

/* ============================================================
   14. ABAS ITESLID (home — filmes/séries)
   ============================================================ */
.iteslid {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

/* ============================================================
   15. EPISÓDIOS DE SÉRIES (ul.episodios)
   ============================================================ */
ul.episodios {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

/* Número do episódio */
ul.episodios li .numerando {
    border-radius: var(--gr-radius-sm) 0 0 var(--gr-radius-sm);
}

/* Badge de número da temporada */
.se-q span.nun {
    border-radius: var(--gr-radius-sm);
}

/* ============================================================
   16. PLAYER NAV (.player_nav / .navplayer2)
   ============================================================ */
.player_nav {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

.navplayer2 {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

/* ============================================================
   17. MODAL DE LOGIN/REGISTRO (.white_content)
   ============================================================ */
.white_content {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
}

/* ============================================================
   18. AVISO / NOTAS (.aviso, .notes, .sbox .aviso2)
   ============================================================ */
.aviso {
    border-radius: var(--gr-radius-md);
}

.notes {
    border-radius: var(--gr-radius-md);
}

.sbox .aviso2 {
    border-radius: var(--gr-radius-md);
}

/* ============================================================
   19. PAGINAÇÃO — botões mais arredondados
   ============================================================ */
#paginador a,
#paginador span,
.paginador a,
.paginador span {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* ============================================================
   20. BOTÃO DE BUSCA AVANÇADA
   ============================================================ */
a.busqueda_avanzada {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* ============================================================
   21. FORMULÁRIO DE BUSCA AVANÇADA
   ============================================================ */
form.wp-advanced-search input[type=text] {
    border-radius: var(--gr-radius-sm);
}

form.wp-advanced-search input[type=submit] {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

form.wp-advanced-search select {
    border-radius: var(--gr-radius-sm);
}

form.wp-advanced-search .wpas-field .wpas-checkbox-container {
    border-radius: var(--gr-radius-sm);
}

/* ============================================================
   22. BOTÕES SOCIAIS (Facebook / Twitter)
   ============================================================ */
a.ssocial {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

a.ssocial:first-child {
    border-radius: var(--gr-radius-sm) 0 0 var(--gr-radius-sm);
}

a.ssocial:last-child {
    border-radius: 0 var(--gr-radius-sm) var(--gr-radius-sm) 0;
}

/* ============================================================
   23. BOTÃO "VER MAIS" DE SÉRIES (a.mastv)
   ============================================================ */
a.mastv {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* ============================================================
   24. GALERIA DE BACKDROPS (#backdrops)
   ============================================================ */
#backdrops .galeria_img img {
    border-radius: var(--gr-radius-sm);
    overflow: hidden;
    transition: opacity 0.15s ease;
}

/* ============================================================
   25. RESULTADOS DE BUSCA (#resultados)
   ============================================================ */
#resultados .resultado {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

#resultados .resultado:hover {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25);
}

/* ============================================================
   26. FORMULÁRIO DE REPORT (.reportform)
   ============================================================ */
.reportform input[type=text],
.reportform textarea,
.reportform select {
    border-radius: var(--gr-radius-sm);
}

.reportform input[type=submit] {
    border-radius: var(--gr-radius-sm);
    transition: var(--gr-transition);
}

/* ============================================================
   27. HEADER — sub-menu dropdown
   ============================================================ */
#header .navegador .caja .menu ul li ul.sub-menu {
    border-radius: 0 0 var(--gr-radius-sm) var(--gr-radius-sm);
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* ============================================================
   28. NO CONTENT — caixa de conteúdo vazio
   ============================================================ */
#contenedor .contenido .no_contenido {
    border-radius: var(--gr-radius-lg);
    overflow: hidden;
}

/* ============================================================
   29. CAPA SLIDER RELACIONADOS (.slider_box)
   ============================================================ */
.slider_box {
    border-radius: var(--gr-radius-md);
    overflow: hidden;
}

/* Imagem dos relacionados */
.slider_box .item .imagens {
    border-radius: var(--gr-radius-sm);
    overflow: hidden;
}

.slider_box .item .imagens img {
    border-radius: var(--gr-radius-sm);
}

/* ============================================================
   30. REFINAMENTOS DE TRANSIÇÃO GLOBAL
       (apenas em elementos interativos, sem afetar layout)
   ============================================================ */
#header .navegador .caja .menu li a {
    transition: color 0.15s ease, background-color 0.15s ease;
}

.categorias li a {
    transition: color 0.15s ease;
}

.metatags a {
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

/* ============================================================
   31. SCROLLBAR PERSONALIZADA — refinamento suave
   ============================================================ */
::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(100, 120, 150, 0.4);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 120, 150, 0.65);
}

/* ============================================================
   32. PROTEÇÃO MOBILE — garantir que nenhuma regra acima
       quebre o layout responsivo existente
   ============================================================ */
@media (max-width: 768px) {
    /* Remover overflow:hidden de containers que podem
       causar corte em mobile */
    #contenedor .contenido .box {
        border-radius: var(--gr-radius-sm);
        overflow: visible;
    }

    .items .item .image {
        border-radius: var(--gr-radius-sm);
        overflow: hidden; /* manter para imagens */
    }

    #single .s_left .sbox {
        border-radius: var(--gr-radius-sm);
        overflow: visible;
    }

    #single .s_right .categorias,
    #single .s_right .filtro_y {
        border-radius: var(--gr-radius-sm);
        overflow: visible;
    }

    .news_home .noticias {
        border-radius: var(--gr-radius-sm);
        overflow: visible;
    }

    .comentarios {
        border-radius: var(--gr-radius-sm);
        overflow: visible;
    }
}

/* ============================================================
   FIM DO ARQUIVO grifus-visual-upgrade.css
   ============================================================ */
