/**
 * OVERRIDE CSS - Trámites para Villa del Totoral
 * Archivo: /templates/villatotoral/assets/css/views/tramites.css
 * 
 * Ajustes tipográficos específicos para el template villatotoral.
 * Sobrescribe los tamaños de fuente del CSS base (/css/views/tramites.css)
 * que resultan demasiado pequeños con la escala html { font-size: 62.5% }
 */

/* ===========================================
   LISTADO DE CATEGORÍAS DE TRÁMITES
   =========================================== */

/* Título de categoría - Aumentado para mejor legibilidad */
#tramites .tramites .titulo_categoria {
    font-size: 1.8rem; /* 18px - antes 1.6rem */
}

#tramite_ampliado .datos-item-tramite .item a {
    color: inherit;
    text-decoration: none;
    font-size: inherit;
}
/* Items de la lista de trámites - Aumentado significativamente */
#tramites .tramites .lista_subtramites_list li {
    font-size: 1.4rem; /* 14px - antes 0.95rem (9.5px) */
    line-height: 1.5;
}

/* Enlaces de trámites - Aumentado para mejor legibilidad */
#tramites .subtramite_item {
    font-size: 1.6rem; 
}

/* Botón "Ver más" - Aumentado */
#tramites .ver-mas a {
    font-size: 1.3rem; /* 13px - antes 1.1rem (11px) */
}

#tramites .ver-mas a:hover {
    font-size: 1.3rem; /* Mantener consistencia en hover */
}

/* Botón detalle - Aumentado */
#tramites .btn-detalle {
    font-size: 1.2rem; 
}

#tramites .btn-detalle i {
    font-size: 1rem;
}

/* ===========================================
   BUSCADOR DE TRÁMITES - Estilo Portada
   =========================================== */

/* Contenedor principal con fondo naranja/durazno */
#tramites .buscador-tramites {
    padding: 4rem 2rem;
    margin-bottom: 2rem;
}

/* Contenedor del formulario */
#tramites .buscador-tramites .form-busqueda-tramites {
    width: 100%;
    max-width: 650px;
    margin: 0 auto;
}

/* Input-group con estilo pill azul */
#tramites .buscador-tramites .form-busqueda-tramites .input-group,
#tramites .buscador-tramites .form-busqueda-tramites .busqueda-wrapper {
    display: flex !important;
    align-items: center;
    border: 0.2rem solid var(--color-primary) !important;
    border-radius: 8rem !important; /* Pill shape */
    padding: 0.5rem 1.5rem !important;
    background-color: #fff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.3s ease;
    position: relative;
}

#tramites .buscador-tramites .form-busqueda-tramites .input-group:hover,
#tramites .buscador-tramites .form-busqueda-tramites .busqueda-wrapper:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
}

#tramites .buscador-tramites .form-busqueda-tramites .input-group:focus-within,
#tramites .buscador-tramites .form-busqueda-tramites .busqueda-wrapper:focus-within {
    border-color: var(--color-primary) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
}

/* Input de búsqueda - Sin bordes, integrado */
#tramites .buscador-tramites .form-busqueda-tramites .form-control {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    flex: 1;
    font-size: 1.4rem !important; /* 14px */
    padding: 0.4rem 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}

#tramites .buscador-tramites .form-busqueda-tramites .form-control:focus {
    border: none !important;
    box-shadow: none !important;
}

#tramites .buscador-tramites .form-busqueda-tramites .form-control::placeholder {
    color: var(--negro, #232323);
    opacity: 1;
}

/* Botón de búsqueda - Circular azul con solo icono */
#tramites .buscador-tramites .form-busqueda-tramites .btn,
#tramites .buscador-tramites .form-busqueda-tramites .btn.btn-primary,
#tramites .buscador-tramites .form-busqueda-tramites button[type="submit"] {
    background-color: var(--color-primary) !important;
    border: none !important;
    outline: none !important;
    color: var(--color-blanco) !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 3rem !important; /* 30px */
    height: 3rem !important; /* 30px */
    min-width: 3rem !important;
    min-height: 3rem !important;
    border-radius: 50% !important; /* Circular */
    margin-left: 0.5rem;
    padding: 0 !important;
    flex-shrink: 0;
    transition: all 0.3s ease;
    font-size: 0 !important; /* Oculta el texto "Buscar" */
}

#tramites .buscador-tramites .form-busqueda-tramites .btn:hover,
#tramites .buscador-tramites .form-busqueda-tramites .btn.btn-primary:hover,
#tramites .buscador-tramites .form-busqueda-tramites button[type="submit"]:hover {
    background-color: var(--color-secondary) !important;
}

#tramites .buscador-tramites .form-busqueda-tramites .btn i,
#tramites .buscador-tramites .form-busqueda-tramites button[type="submit"] i {
    font-size: 1.1rem !important; /* 11px - Mantiene el icono visible */
    color: var(--blanco, #ffffff) !important;
}

/* Tipo de contenido en sugerencias */
#tramites .tipo_contenido {
    font-size: 1.1rem; /* 11px - antes 1rem */
}

/* Categoría badge */
#tramites .categoria-badge {
    font-size: 1.1rem; /* 11px - antes 1rem */
}

/* Título de resultado en búsqueda */
#tramites .titulo_resultado {
    font-size: 1.4rem; /* 14px - antes 1.2rem */
}

/* Flecha en sugerencias */
#tramites .contenedor-sugerencia::after {
    font-size: 1.3rem; /* 13px - antes 1.2rem */
}

/* ===========================================
   TRÁMITES POR CATEGORÍA
   =========================================== */

/* Título de trámite en cards */
.tramite_portada_categoria .titulo-tramite {
    font-size: 1.6rem; /* 16px - antes 1.25rem (12.5px) */
}

/* Botón detalle en cards */
.tramite_portada_categoria .card-tramite .btn-detalle {
    font-size: 1.3rem; /* 13px - antes 0.95rem (9.5px) */
}

.tramite_portada_categoria .card-tramite .btn-detalle i {
    font-size: 1.1rem; /* 11px - antes 0.8rem (8px) */
}

/* ===========================================
   TRÁMITE AMPLIADO
   =========================================== */

/* Items del trámite ampliado */
#tramite_ampliado .datos-item-tramite .item {
    font-size: 1.4rem; /* 14px - antes 1.2rem */
}

#tramite_ampliado .datos-item-tramite .item_dato {
    font-size: 1.5rem; /* 15px - antes 1.3rem */
}

#tramite_ampliado .datos-item-tramite .item_vinculo_web {
    font-size: 1.4rem; /* 14px - antes 1.2rem */
}

/* Pasos del trámite */
#tramite_ampliado .contenedor_pasos_tramites .titulo_pasos {
    font-size: 1.6rem; /* 16px - antes 1.4rem */
}

#tramite_ampliado .contenedor_paso {
    font-size: 1.4rem; /* 14px - antes 1.2rem */
}

#tramite_ampliado .numero_paso {
    font-size: 1.6rem; /* 16px - antes 1.4rem */
}

/* Detalle del trámite */
#tramite_ampliado .detalle_tramite {
    font-size: 1.6rem; /* 16px - antes 1.4rem */
}

/* ===========================================
   RESULTADOS DE BÚSQUEDA
   =========================================== */

/* Enlaces de resultados de búsqueda */
#tramites .resultado-card {
    text-decoration: none;
}

/* Ajustes de tipografía para resultado-card (escala 62.5%) */
#tramites .resultado-icono {
    font-size: 2.5rem; /* 25px */
}

#tramites .resultado-tipo {
    font-size: 1.1rem; /* 11px */
}

#tramites .resultado-titulo {
    font-size: 1.3rem; /* 13px */
}

/* ===========================================
   RESPONSIVE - MOBILE
   =========================================== */

@media (max-width: 768px) {
    /* Mantener legibilidad en móvil */
    #tramites .subtramite_item {
        font-size: 1.4rem; /* 14px */
    }
    
    #tramite_ampliado .datos-item-tramite .item {
        font-size: 1.5rem; /* 15px */
    }
    
    #tramite_ampliado .datos-item-tramite .item_dato {
        font-size: 1.8rem; /* 18px */
    }
    
    .tramites .titulo_categoria {
        font-size: 1.8rem; /* 18px */
    }
    
    .tramites .subtramite_item {
        font-size: 1.6rem; /* 16px */
    }
    
    #tramites .icono-sugerencia {
        font-size: 1.8rem; /* 18px */
    }
    
    #tramites .tipo_contenido {
        font-size: 1.2rem; /* 12px */
    }
    
    #tramites .titulo_resultado {
        font-size: 1.4rem; /* 14px */
    }

    #tramites .resultado-tipo {
        font-size: 1rem; /* 10px */
    }

    #tramites .resultado-titulo {
        font-size: 1.2rem; /* 12px */
    }

    /* Buscador responsive */
    #tramites .buscador-tramites {
        padding: 3rem 1.5rem;
    }

    #tramites .buscador-tramites .form-busqueda-tramites .input-group,
    #tramites .buscador-tramites .form-busqueda-tramites .busqueda-wrapper {
        padding: 0.5rem 1.2rem !important;
    }

    #tramites .buscador-tramites .form-busqueda-tramites .form-control {
        font-size: 1.4rem !important; /* 14px */
    }
}

@media (max-width: 575.98px) {
    /* Ajustes para móviles pequeños */
    #tramites .card-head .titulo_categoria {
        font-size: 1.9rem; /* 19px - antes 1.7rem */
    }

    /* Buscador en móviles pequeños */
    #tramites .buscador-tramites {
        padding: 2rem 1rem;
    }

    #tramites .buscador-tramites .form-busqueda-tramites .form-control {
        font-size: 1.3rem !important; /* 13px */
    }
}