/* =============================================================================
   NEO COLOR PRINT — estilos próprios
   Paleta: branco (#FFFFFF), creme (#FDF0E0) e laranja (#EB650E) · Inter
   ============================================================================= */

:root {
    --ncp-brand: #EB650E;
    --ncp-brand-dark: #C9510A;
    --ncp-creme: #FDF0E0;
    --ncp-ink: #1F1B16;
    --ncp-ink-soft: #4B433A;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    /* Trava de segurança contra rolagem horizontal acidental.
       `clip` (em vez de `hidden`) não cria um contentor de rolagem e por isso
       não quebra o `position: sticky` do cabeçalho. */
    overflow-x: clip;
}

body {
    overflow-x: hidden;
    background-color: #ffffff;
}

/* Foco visível e acessível */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--ncp-brand);
    outline-offset: 2px;
    border-radius: 0.5rem;
}

/* Remover o contorno nativo dos campos de pesquisa */
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

/* ---------------------------------------------------------------- Rolagem */
* {
    scrollbar-width: thin;
    scrollbar-color: #E7E1D8 transparent;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #E7E1D8;
    border: 3px solid transparent;
    border-radius: 9999px;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #C4BBAF;
}

/* Rolagem horizontal sem barra visível */
.ncp-sem-barra {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.ncp-sem-barra::-webkit-scrollbar {
    display: none;
}

/* Atalhos rápidos do cabeçalho (mobile) */
.ncp-atalhos {
    display: flex;
    align-items: center;
    overflow-x: auto;
    padding-bottom: 0.625rem;
}

/* ---------------------------------------------------------------- Swiper */
.ncp-slider {
    padding: 4px 4px 40px;
    margin: -4px -4px -40px;
}

.ncp-slider .swiper-slide {
    height: auto;
    display: flex;
}

.ncp-slider .swiper-slide > * {
    width: 100%;
}

.swiper-pagination-bullet {
    background: #C4BBAF;
    opacity: 1;
    width: 7px;
    height: 7px;
}

.swiper-pagination-bullet-active {
    background: var(--ncp-brand);
    width: 20px;
    border-radius: 9999px;
}

/* ---------------------------------------------------------------- Cabeçalho */
[data-ncp-cabecalho].ncp-cabecalho-solido {
    box-shadow: 0 10px 30px -18px rgba(31, 27, 22, .28);
}

/* Em ecrãs muito estreitos (≤ 359px) o cabeçalho mostra apenas o símbolo da
   marca: o letreiro não caberia sem empurrar os botões para fora do ecrã. */
@media (max-width: 359px) {
    [data-ncp-cabecalho] .ncp-marca-letreiro {
        display: none;
    }
}

/* A barra do cabeçalho nunca deve criar rolagem horizontal */
[data-ncp-cabecalho] .ncp-cabecalho-linha {
    min-width: 0;
    max-width: 100%;
}

/* ---------------------------------------------------------------- Cartões de serviço */
.ncp-cartao-servico img,
.ncp-cartao-servico svg {
    transition: transform .5s ease;
}

/* ---------------------------------------------------------------- Animação de entrada */
.js .ncp-anim {
    opacity: 0;
}

.js .ncp-anim.ncp-anim-visivel {
    opacity: 1;
}

/* Entradas com Animate.css — invisíveis até entrarem no ecrã */
.js [data-ncp-anim]:not([data-ncp-animado]) {
    opacity: 0;
}

/* ---------------------------------------------------------------- Produtos e pedido */
.ncp-cartao-produto img {
    will-change: transform;
}

.ncp-cartao-produto {
    transform: translateZ(0);
}

/* Botão com brilho a passar (chama a atenção para as acções principais) */
.ncp-brilho {
    position: relative;
    overflow: hidden;
}

.ncp-brilho::after {
    content: '';
    position: absolute;
    top: -10%;
    bottom: -10%;
    left: -60%;
    width: 45%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
}

.ncp-brilho:hover::after,
.ncp-brilho:focus-visible::after {
    animation: ncp-brilho .9s ease;
}

@keyframes ncp-brilho {
    0% {
        left: -60%;
    }
    100% {
        left: 120%;
    }
}

/* Botão flutuante do pedido */
.ncp-fab-pedido {
    animation: ncp-flutuar-suave 5s ease-in-out infinite;
}

@keyframes ncp-flutuar-suave {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-6px);
    }
}

/* Botão principal a pulsar de leve */
.ncp-btn-pulsar {
    animation: ncp-pulsar 2.6s ease-in-out infinite;
}

@keyframes ncp-pulsar {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(235, 101, 14, .45);
    }
    60% {
        box-shadow: 0 0 0 14px rgba(235, 101, 14, 0);
    }
}

/* Painel lateral do pedido */
[data-ncp-pedido-painel] .ncp-pedido-item {
    transition: border-color .25s ease, box-shadow .25s ease;
}

[data-ncp-pedido-painel] .ncp-pedido-item:hover {
    border-color: #FBAC78;
    box-shadow: 0 10px 30px -14px rgba(31, 27, 22, .18);
}

@media (prefers-reduced-motion: reduce) {
    .ncp-anim,
    .js .ncp-anim,
    .js [data-ncp-anim] {
        opacity: 1 !important;
        transition: none !important;
        transform: none !important;
    }

    html {
        scroll-behavior: auto;
    }

    .animate-deslizar-infinito {
        animation: none !important;
    }
}

/* ---------------------------------------------------------------- FAQ */
.ncp-faq summary::-webkit-details-marker {
    display: none;
}

.ncp-faq summary {
    list-style: none;
}

.ncp-faq[open] summary {
    color: var(--ncp-brand);
}

/* ---------------------------------------------------------------- Conversa (chat) */
.ncp-conversa {
    background-image:
        radial-gradient(circle at 1px 1px, rgba(31, 27, 22, .06) 1px, transparent 0);
    background-size: 16px 16px;
}

.ncp-balao-entrada {
    animation: ncp-balao-entrada .26s ease-out both;
}

@keyframes ncp-balao-entrada {
    0% {
        opacity: 0;
        transform: translateY(6px) scale(.98);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Indicador «a escrever» */
.ncp-a-escrever span {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 1.5px;
    border-radius: 9999px;
    background-color: #C4BBAF;
    animation: ncp-a-escrever 1.2s infinite ease-in-out;
}

.ncp-a-escrever span:nth-child(2) { animation-delay: .16s; }
.ncp-a-escrever span:nth-child(3) { animation-delay: .32s; }

@keyframes ncp-a-escrever {
    0%, 80%, 100% { transform: translateY(0); opacity: .5; }
    40% { transform: translateY(-4px); opacity: 1; }
}

/* Botão «Ouvir» de cada resposta do assistente */
.ncp-balao-ouvir {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    border-radius: 9999px;
    border: 1px solid #E7E1D8;
    background-color: #fff;
    padding: .0625rem .4375rem;
    font-size: 10px;
    font-weight: 600;
    color: #6C6257;
    transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}

.ncp-balao-ouvir:hover {
    border-color: #FBAC78;
    background-color: #FFF4EC;
    color: var(--ncp-brand-dark);
}

/* ---------------------------------------------------------------- Modo de voz */
.ncp-voz-orb {
    position: relative;
}

.ncp-voz-anel {
    position: absolute;
    inset: 0;
    border-radius: 9999px;
    border: 2px solid rgba(235, 101, 14, .55);
    animation: ncp-voz-anel 3s ease-out infinite;
}

.ncp-voz-nucleo {
    background: linear-gradient(135deg, #F48945, #EB650E);
    box-shadow: 0 0 0 6px rgba(255, 255, 255, .10);
    animation: ncp-voz-respira 3.6s ease-in-out infinite;
}

[data-ncp-vista-voz][data-estado="a-ouvir"] .ncp-voz-nucleo {
    background: linear-gradient(135deg, #FFCDAB, #EB650E);
    animation-duration: 1.6s;
}

[data-ncp-vista-voz][data-estado="a-falar"] .ncp-voz-nucleo {
    background: linear-gradient(135deg, #FDF0E0, #FBAC78);
    color: #5C2404;
}

.ncp-voz-onda {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 26px;
}

.ncp-voz-onda span {
    width: 4px;
    height: 7px;
    border-radius: 9999px;
    background-color: rgba(253, 240, 224, .65);
    animation: ncp-voz-onda 1.1s ease-in-out infinite;
}

[data-ncp-vista-voz][data-estado="inativo"] .ncp-voz-onda span {
    animation-play-state: paused;
    opacity: .35;
}

.ncp-voz-onda span:nth-child(2) { animation-delay: .08s; }
.ncp-voz-onda span:nth-child(3) { animation-delay: .16s; }
.ncp-voz-onda span:nth-child(4) { animation-delay: .24s; }
.ncp-voz-onda span:nth-child(5) { animation-delay: .32s; }
.ncp-voz-onda span:nth-child(6) { animation-delay: .4s; }
.ncp-voz-onda span:nth-child(7) { animation-delay: .48s; }
.ncp-voz-onda span:nth-child(8) { animation-delay: .56s; }
.ncp-voz-onda span:nth-child(9) { animation-delay: .64s; }

.ncp-voz-mic.ncp-voz-mic-activo {
    background-color: #FDF0E0;
    box-shadow: 0 0 0 10px rgba(235, 101, 14, .25);
}

@keyframes ncp-voz-anel {
    0% {
        transform: scale(.62);
        opacity: .85;
    }
    75%, 100% {
        transform: scale(1.2);
        opacity: 0;
    }
}

@keyframes ncp-voz-respira {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.07); }
}

@keyframes ncp-voz-onda {
    0%, 100% {
        height: 7px;
        opacity: .45;
    }
    50% {
        height: 20px;
        opacity: 1;
    }
}

/* ---------------------------------------------------------------- Impressão */
@media print {
    header,
    footer,
    #ncp-atendimento,
    #ncp-menu-mobile,
    [data-ncp-topo] {
        display: none !important;
    }

    body {
        background: #fff;
    }
}