/* ==============================================================================
   ESTILOS VISUALES Y IDENTIDAD OFICIAL - CoopeDigital
   Azul Marino Escolar, Pizarra, Tacto Móvil y Elevación Moderna
   ============================================================================== */

@layer base {
    html {
        -webkit-tap-highlight-color: transparent;
        font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    }
}

/* Fondo temático Azul Marino Escolar con Doodles de Pizarra */
.bg-school-canvas {
    background-color: #0d1e38;
    background-image: 
        radial-gradient(circle at 85% 15%, rgba(30, 75, 135, 0.85) 0%, rgba(13, 30, 56, 0.95) 60%, #091528 100%),
        url('../assets/chalk-doodles.svg');
    background-repeat: repeat;
    background-size: auto, 500px 500px;
}

/* Sello Digital Oficial "RECIBIDO" */
.stamp-recibido {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    color: #15803d;
    background-color: rgba(240, 253, 244, 0.92);
    border: 2px dashed #16a34a;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transform: rotate(-6deg);
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.15);
    user-select: none;
}

/* Botón táctil móvil de alta presencia */
.btn-tactil {
    touch-action: manipulation;
    transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-tactil:active {
    transform: scale(0.98);
}

/* Evita zoom molesto en inputs en Safari iOS manteniendo accesibilidad */
@media screen and (max-width: 768px) {
    input, select, textarea {
        font-size: 16px !important;
    }
}

/* Scrollbar sutil para listas */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.4);
    border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(148, 163, 184, 0.7);
}