/* ============================================================
   Tema Moderno — aparência de app React (shadcn-like)
   Fonte Inter servida localmente (assets/fonts/inter)
   Carregado depois do tailwind.css e antes do custom.css,
   funcionando como camada de polimento sem quebrar utilitários.
   ============================================================ */

/* ---------- Fonte Inter (local) ---------- */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/inter/inter-latin-400-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/inter/inter-latin-500-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/inter/inter-latin-600-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/inter/inter-latin-700-normal.woff2') format('woff2');
}

/* ---------- Tokens ---------- */
:root {
    --m-radius: 0.75rem;
    --m-radius-sm: 0.5rem;
    --m-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
    --m-shadow: 0 1px 3px rgba(16, 24, 40, 0.08), 0 4px 12px rgba(16, 24, 40, 0.06);
    --m-shadow-lg: 0 8px 24px rgba(16, 24, 40, 0.12);
    --m-ring: var(--primary-color, #8b53ff);
    --m-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ---------- Base ---------- */
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
    font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11'; /* alternates da Inter: visual mais "produto" */
}

::selection {
    background: var(--primary-light, #a374ff);
    color: #fff;
}

/* ---------- Scrollbar discreta (estilo apps modernos) ---------- */
*::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
*::-webkit-scrollbar-track {
    background: transparent;
}
*::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.35);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
    background-color: rgba(100, 116, 139, 0.55);
    background-clip: padding-box;
}

/* ---------- Interações suaves ---------- */
a, button, [role="button"], .cursor-pointer {
    transition: background-color var(--m-transition),
                color var(--m-transition),
                border-color var(--m-transition),
                box-shadow var(--m-transition),
                opacity var(--m-transition),
                transform var(--m-transition);
}

button:active, [role="button"]:active {
    transform: scale(0.98);
}

/* ---------- Formulários ---------- */
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="date"], input[type="datetime-local"],
input[type="time"], input[type="search"], input[type="url"], input[type="tel"],
select, textarea {
    border-radius: var(--m-radius-sm);
    transition: border-color var(--m-transition), box-shadow var(--m-transition);
}

input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, a:focus-visible {
    outline: 2px solid transparent;
    outline-offset: 2px;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--m-ring);
}
html.dark input:focus-visible, html.dark select:focus-visible,
html.dark textarea:focus-visible, html.dark button:focus-visible,
html.dark a:focus-visible {
    box-shadow: 0 0 0 2px #1f2937, 0 0 0 4px var(--m-ring);
}

/* ---------- Cards / superfícies ---------- */
/* Suaviza sombras padrão do Tailwind para o look "flutuante" do shadcn */
.shadow {
    box-shadow: var(--m-shadow) !important;
}
.shadow-md {
    box-shadow: var(--m-shadow) !important;
}
.shadow-lg {
    box-shadow: var(--m-shadow-lg) !important;
}

/* Cantos um pouco mais generosos nos contêineres comuns */
.rounded-lg {
    border-radius: var(--m-radius) !important;
}
.rounded-xl {
    border-radius: 1rem !important;
}

/* ---------- Tabelas ---------- */
tbody tr {
    transition: background-color var(--m-transition);
}

/* ---------- SweetAlert2 alinhado ao tema ---------- */
.swal2-popup {
    border-radius: 1rem !important;
    font-family: inherit !important;
    box-shadow: var(--m-shadow-lg) !important;
}
.swal2-styled.swal2-confirm {
    border-radius: var(--m-radius-sm) !important;
    background-color: var(--primary-color, #8b53ff) !important;
}
.swal2-styled.swal2-confirm:focus {
    box-shadow: 0 0 0 3px var(--primary-lighter, #c9adff) !important;
}

/* ---------- Animação de entrada sutil do conteúdo ---------- */
@keyframes m-fade-up {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}
main {
    animation: m-fade-up 220ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
    main { animation: none; }
    a, button, [role="button"] { transition: none; }
}
