/*
 * Bora Cortar — Camada visual & motion
 * Inspirada em experiências digitais lúdicas, preservando toda a lógica existente.
 * Arquivo propositalmente isolado: pode ser removido sem afetar PHP, banco ou regras.
 */

:root {
    --bc-brand: #20d7b4;
    --bc-brand-rgb: 32, 215, 180;
    --bc-brand-deep: #0eaa90;
    --bc-brand-soft: #8ff7e2;
    --bc-sky: #63c7ff;
    --bc-lime: #c9ff63;
    --bc-violet: #ae91ff;
    --bc-ink: #070908;
    --bc-ink-2: #0d1110;
    --bc-card: rgba(15, 19, 18, .82);
    --bc-card-solid: #111615;
    --bc-line: rgba(255,255,255,.09);
    --bc-line-strong: rgba(255,255,255,.15);
    --bc-text: #f7fbfa;
    --bc-muted: #929c99;
    --bc-ease: cubic-bezier(.2,.75,.2,1);
    --bc-spring: cubic-bezier(.16,1,.3,1);
    --bc-shadow: 0 28px 90px rgba(0,0,0,.38);
}

html {
    background: var(--bc-ink);
    scroll-behavior: smooth;
}

body.bc-enhanced {
    background-color: var(--bc-ink) !important;
    color: var(--bc-text);
    overflow-x: hidden;
    isolation: isolate;
}

body.bc-enhanced::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -3;
    pointer-events: none;
    background:
        radial-gradient(circle at 8% 2%, rgba(var(--bc-brand-rgb),.13), transparent 27rem),
        radial-gradient(circle at 94% 12%, rgba(99,199,255,.08), transparent 24rem),
        radial-gradient(circle at 72% 88%, rgba(174,145,255,.055), transparent 28rem),
        #070908;
}

body.bc-enhanced::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 9998;
    pointer-events: none;
    opacity: .14;
    mix-blend-mode: soft-light;
    background-image: radial-gradient(rgba(255,255,255,.45) .55px, transparent .7px);
    background-size: 7px 7px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.6), transparent 90%);
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.6), transparent 90%);
}

::selection {
    background: var(--bc-brand) !important;
    color: #03110e !important;
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #070908; }
::-webkit-scrollbar-thumb {
    background: #27302e;
    border-radius: 999px;
    border: 2px solid #070908;
}
::-webkit-scrollbar-thumb:hover { background: var(--bc-brand); }

/* ---------- Brand color normalization ---------- */
body.bc-brand-ui .text-amber-200,
body.bc-brand-ui .text-amber-300,
body.bc-brand-ui .text-amber-400,
body.bc-brand-ui .text-amber-500 { color: var(--bc-brand) !important; }

body.bc-brand-ui .bg-amber-500 { background-color: var(--bc-brand) !important; }
body.bc-brand-ui .hover\:bg-amber-400:hover { background-color: var(--bc-brand-soft) !important; }
body.bc-brand-ui .hover\:text-amber-300:hover { color: var(--bc-brand-soft) !important; }
body.bc-brand-ui [class*="border-amber-500"] { border-color: rgba(var(--bc-brand-rgb),.24) !important; }
body.bc-brand-ui [class*="bg-amber-500/"] { background-color: rgba(var(--bc-brand-rgb),.10) !important; }
body.bc-brand-ui [class*="shadow-amber-500"] { --tw-shadow-color: rgba(var(--bc-brand-rgb),.18) !important; }
body.bc-brand-ui [class*="from-amber-"] { --tw-gradient-from: rgba(var(--bc-brand-rgb),.24) var(--tw-gradient-from-position) !important; }
body.bc-brand-ui [class*="via-amber-"] { --tw-gradient-via: rgba(var(--bc-brand-rgb),.16) var(--tw-gradient-via-position) !important; }
body.bc-brand-ui [class*="to-orange-"] { --tw-gradient-to: rgba(99,199,255,.30) var(--tw-gradient-to-position) !important; }

/* ---------- Shared premium surfaces ---------- */
body.bc-enhanced .glass {
    background:
        linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.012) 42%),
        rgba(12,16,15,.77) !important;
    border-color: var(--bc-line) !important;
    box-shadow: 0 25px 70px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
    backdrop-filter: blur(22px) saturate(125%);
    -webkit-backdrop-filter: blur(22px) saturate(125%);
}

body.bc-enhanced .bc-motion-surface {
    position: relative;
    isolation: isolate;
    transform-style: preserve-3d;
    will-change: transform;
}

body.bc-enhanced .bc-motion-surface::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    opacity: 0;
    transition: opacity .35s ease;
    background: radial-gradient(
        420px circle at var(--bc-mx, 50%) var(--bc-my, 50%),
        rgba(var(--bc-brand-rgb), .12),
        transparent 48%
    );
}

body.bc-enhanced .bc-motion-surface:hover::before { opacity: 1; }
body.bc-enhanced .bc-motion-surface > * { position: relative; z-index: 1; }

body.bc-enhanced .bc-auto-reveal {
    opacity: 0;
    transform: translateY(26px) scale(.985);
    filter: blur(5px);
    transition:
        opacity .75s var(--bc-ease),
        transform .85s var(--bc-spring),
        filter .65s ease;
}
body.bc-enhanced .bc-auto-reveal.bc-inview {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
}

body.bc-enhanced button,
body.bc-enhanced a,
body.bc-enhanced input,
body.bc-enhanced select,
body.bc-enhanced textarea {
    -webkit-tap-highlight-color: transparent;
}

body.bc-enhanced a[class*="bg-"],
body.bc-enhanced button[class*="bg-"],
body.bc-enhanced .bc-cta {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    transition:
        translate .24s var(--bc-spring),
        scale .22s var(--bc-spring),
        box-shadow .28s ease,
        background-color .25s ease,
        border-color .25s ease,
        color .25s ease !important;
}

body.bc-enhanced a[class*="bg-"]::after,
body.bc-enhanced button[class*="bg-"]::after,
body.bc-enhanced .bc-cta::after {
    content: "";
    position: absolute;
    inset: -120% auto -120% -45%;
    width: 34%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent);
    translate: -220% 0;
    transition: translate .7s var(--bc-spring);
    pointer-events: none;
    z-index: 4;
}

body.bc-enhanced a[class*="bg-"]:hover::after,
body.bc-enhanced button[class*="bg-"]:hover::after,
body.bc-enhanced .bc-cta:hover::after { translate: 520% 0; }

body.bc-enhanced a[class*="bg-"]:active,
body.bc-enhanced button[class*="bg-"]:active { scale: .975; }

/* ---------- Home / landing ---------- */
body.bc-page-index header {
    padding: 12px 12px 0;
    pointer-events: none;
}

body.bc-page-index header nav {
    pointer-events: auto;
    width: min(1240px, 100%);
    margin: 0 auto;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: 20px;
    background: rgba(8,11,10,.66) !important;
    box-shadow: 0 16px 55px rgba(0,0,0,.20);
    backdrop-filter: blur(24px) saturate(135%);
    -webkit-backdrop-filter: blur(24px) saturate(135%);
    transition: background .35s ease, box-shadow .35s ease, transform .35s var(--bc-spring), border-color .35s ease;
}

body.bc-page-index.bc-scrolled header nav {
    background: rgba(8,11,10,.90) !important;
    border-color: rgba(var(--bc-brand-rgb),.15) !important;
    box-shadow: 0 18px 55px rgba(0,0,0,.34), 0 0 0 1px rgba(var(--bc-brand-rgb),.03);
    transform: translateY(-2px) scale(.994);
}

body.bc-page-index header nav a:not([class*="bg-"]) {
    position: relative;
}
body.bc-page-index header nav a:not([class*="bg-"])::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -5px;
    height: 2px;
    border-radius: 99px;
    background: var(--bc-brand);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .28s var(--bc-spring);
}
body.bc-page-index header nav a:not([class*="bg-"]):hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

body.bc-page-index main > section:first-child {
    min-height: min(940px, 100svh);
    display: flex;
    align-items: center;
}

body.bc-page-index .hero-grid {
    opacity: .68;
    background-image:
        linear-gradient(rgba(var(--bc-brand-rgb),.043) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--bc-brand-rgb),.043) 1px, transparent 1px) !important;
    background-size: 46px 46px !important;
}

body.bc-page-index main > section:first-child::before,
body.bc-page-index main > section:first-child::after {
    content: "";
    position: absolute;
    pointer-events: none;
    border-radius: 999px;
    filter: blur(4px);
    opacity: .8;
}
body.bc-page-index main > section:first-child::before {
    width: 100px;
    height: 100px;
    border: 1px solid rgba(var(--bc-brand-rgb),.30);
    top: 22%;
    left: 4%;
    animation: bcOrbit 10s ease-in-out infinite;
}
body.bc-page-index main > section:first-child::after {
    width: 18px;
    height: 18px;
    background: var(--bc-lime);
    box-shadow: 0 0 36px rgba(201,255,99,.28);
    right: 8%;
    top: 28%;
    animation: bcFloatDot 6.5s ease-in-out infinite;
}

@keyframes bcOrbit {
    0%,100% { transform: translate3d(0,0,0) rotate(0deg); }
    50% { transform: translate3d(18px,26px,0) rotate(9deg); }
}
@keyframes bcFloatDot {
    0%,100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(25px) scale(.82); }
}

body.bc-page-index h1,
body.bc-page-index h2 {
    text-wrap: balance;
}

body.bc-page-index h1 {
    text-shadow: 0 12px 50px rgba(0,0,0,.40);
}
body.bc-page-index h1 span.text-transparent {
    background-image: linear-gradient(100deg, #d9fff7 0%, var(--bc-brand) 48%, var(--bc-sky) 100%) !important;
    filter: drop-shadow(0 10px 32px rgba(var(--bc-brand-rgb),.14));
}

body.bc-page-index main > section {
    position: relative;
}

body.bc-page-index main > section:not(:first-child)::before {
    content: "";
    position: absolute;
    width: min(280px, 36vw);
    aspect-ratio: 1;
    border-radius: 999px;
    right: -12%;
    top: 5%;
    background: radial-gradient(circle, rgba(var(--bc-brand-rgb),.06), transparent 65%);
    pointer-events: none;
}

body.bc-page-index .feature-card,
body.bc-page-index .counter-card {
    border-radius: 28px !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.20);
    transition:
        translate .36s var(--bc-spring),
        rotate .36s var(--bc-spring),
        border-color .3s ease,
        box-shadow .3s ease !important;
}
body.bc-page-index .feature-card:hover,
body.bc-page-index .counter-card:hover {
    translate: 0 -8px;
    border-color: rgba(var(--bc-brand-rgb),.22) !important;
    box-shadow: 0 30px 85px rgba(0,0,0,.34), 0 0 0 1px rgba(var(--bc-brand-rgb),.04);
}
body.bc-page-index .feature-card:nth-child(3n+1):hover { rotate: -.45deg; }
body.bc-page-index .feature-card:nth-child(3n+2):hover { rotate: .45deg; }

body.bc-page-index .icon-box {
    border-radius: 16px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

body.bc-page-index .phone {
    border-color: rgba(var(--bc-brand-rgb),.16) !important;
    box-shadow: 0 36px 95px rgba(0,0,0,.55), 0 0 95px rgba(var(--bc-brand-rgb),.08) !important;
}

body.bc-page-index .shine::after {
    background: linear-gradient(90deg, transparent, rgba(143,247,226,.16), rgba(255,255,255,.12), transparent) !important;
}

body.bc-page-index footer {
    background: #050706 !important;
}

/* Existing reveal classes receive a softer, more playful motion. */
body.bc-page-index .reveal,
body.bc-page-index .reveal-left,
body.bc-page-index .reveal-right {
    filter: blur(5px);
    transition:
        opacity .9s var(--bc-ease),
        transform .95s var(--bc-spring),
        filter .75s ease !important;
}
body.bc-page-index .reveal.visible,
body.bc-page-index .reveal-left.visible,
body.bc-page-index .reveal-right.visible {
    filter: blur(0);
}

/* ---------- Auth / standalone cards ---------- */
body.bc-auth-page {
    min-height: 100svh;
    background:
        radial-gradient(circle at 10% 8%, rgba(var(--bc-brand-rgb),.19), transparent 28rem),
        radial-gradient(circle at 92% 88%, rgba(99,199,255,.10), transparent 26rem),
        #070908 !important;
}

body.bc-auth-page .login-card,
body.bc-auth-page .cadastro-card,
body.bc-auth-page > .bg-zinc-950,
body.bc-auth-page > .bg-zinc-900,
body.bc-auth-page .max-w-md.bg-zinc-950,
body.bc-auth-page .max-w-md.bg-zinc-900 {
    border-color: rgba(255,255,255,.10) !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.012) 48%),
        rgba(12,16,15,.88) !important;
    box-shadow: 0 34px 100px rgba(0,0,0,.46), 0 0 0 1px rgba(var(--bc-brand-rgb),.02) !important;
    backdrop-filter: blur(24px) saturate(130%);
    -webkit-backdrop-filter: blur(24px) saturate(130%);
    animation: bcCardEnter .8s var(--bc-spring) both;
}

@keyframes bcCardEnter {
    from { opacity: 0; transform: translateY(24px) scale(.975); filter: blur(7px); }
    to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

body.bc-auth-page .login-card::before,
body.bc-auth-page .cadastro-card::before {
    background: linear-gradient(90deg, transparent, var(--bc-brand), var(--bc-sky), transparent) !important;
    height: 2px !important;
}

body.bc-auth-page .login-card::after,
body.bc-auth-page .cadastro-card::after {
    content: "";
    position: absolute;
    width: 170px;
    aspect-ratio: 1;
    right: -100px;
    bottom: -105px;
    border-radius: 999px;
    border: 1px solid rgba(var(--bc-brand-rgb),.16);
    box-shadow: inset 0 0 45px rgba(var(--bc-brand-rgb),.05);
    pointer-events: none;
}

body.bc-auth-page input:not([type="checkbox"]):not([type="radio"]),
body.bc-auth-page select,
body.bc-auth-page textarea,
body.bc-checkout-page input:not([type="checkbox"]):not([type="radio"]) {
    background: rgba(4,7,6,.70) !important;
    border-color: rgba(255,255,255,.10) !important;
    border-radius: 15px !important;
    transition: border-color .2s ease, box-shadow .25s ease, background .2s ease, translate .2s ease !important;
}
body.bc-auth-page input:focus,
body.bc-auth-page select:focus,
body.bc-auth-page textarea:focus,
body.bc-checkout-page input:focus {
    border-color: rgba(var(--bc-brand-rgb),.65) !important;
    box-shadow: 0 0 0 4px rgba(var(--bc-brand-rgb),.10), 0 12px 35px rgba(0,0,0,.18) !important;
    background: rgba(5,10,8,.92) !important;
    translate: 0 -1px;
}

body.bc-auth-page .login-icon,
body.bc-auth-page [class*="bg-amber-500/10"] {
    background: rgba(var(--bc-brand-rgb),.10) !important;
    color: var(--bc-brand) !important;
    border-color: rgba(var(--bc-brand-rgb),.20) !important;
}

body.bc-auth-page .login-button,
body.bc-auth-page button[type="submit"][class*="bg-amber"],
body.bc-auth-page a[class*="bg-amber"] {
    background: var(--bc-brand) !important;
    color: #03120f !important;
    box-shadow: 0 16px 40px rgba(var(--bc-brand-rgb),.17) !important;
}
body.bc-auth-page .login-button:hover,
body.bc-auth-page button[type="submit"][class*="bg-amber"]:hover,
body.bc-auth-page a[class*="bg-amber"]:hover {
    background: var(--bc-brand-soft) !important;
    box-shadow: 0 20px 48px rgba(var(--bc-brand-rgb),.24) !important;
}

/* ---------- Public barber booking: keep each shop's dynamic primary color ---------- */
body.bc-page-agenda {
    background-color: inherit !important;
}
body.bc-page-agenda::before,
body.bc-page-agenda::after { display: none; }
body.bc-page-agenda > .max-w-md {
    box-shadow: 0 0 90px rgba(0,0,0,.40) !important;
}
body.bc-page-agenda header {
    border-bottom-color: rgba(255,255,255,.07) !important;
    backdrop-filter: blur(22px) saturate(125%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(125%) !important;
}
body.bc-page-agenda .etapa-ativa {
    animation: bcStepIn .52s var(--bc-spring) both !important;
}
@keyframes bcStepIn {
    from { opacity:0; transform: translateY(18px) scale(.99); filter: blur(4px); }
    to { opacity:1; transform: translateY(0) scale(1); filter: blur(0); }
}
body.bc-page-agenda form [class*="bg-zinc-900"] {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
body.bc-page-agenda form div[class*="cursor-pointer"] {
    transition: translate .24s var(--bc-spring), border-color .22s ease, background-color .22s ease, box-shadow .22s ease !important;
}
body.bc-page-agenda form div[class*="cursor-pointer"]:hover {
    translate: 0 -2px;
    box-shadow: 0 15px 38px rgba(0,0,0,.20);
}

/* ---------- Admin / dashboards: motion without touching behavior ---------- */
body.bc-app-page {
    --bc-accent: var(--bc-brand) !important;
    --bc-accent-soft: rgba(var(--bc-brand-rgb),.11) !important;
    --bc-pink: var(--bc-brand) !important;
    --bc-pink-soft: rgba(var(--bc-brand-rgb),.11) !important;
    --bc-bg: #060908 !important;
    --bc-surface: #0c1110 !important;
    --bc-surface-2: #111716 !important;
    --bc-surface-3: #161d1b !important;
    --bc-panel: rgba(15,20,18,.84) !important;
    --bc-panel-solid: #101614 !important;
    --bc-panel-deep: #090d0c !important;
}

body.bc-app-page header {
    backdrop-filter: blur(22px) saturate(130%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(130%) !important;
}

body.bc-app-page .aba-conteudo.aba-ativa {
    animation: bcPanelIn .42s var(--bc-spring) both !important;
}
@keyframes bcPanelIn {
    from { opacity: 0; translate: 0 10px; filter: blur(3px); }
    to { opacity: 1; translate: 0 0; filter: blur(0); }
}

body.bc-app-page button,
body.bc-app-page a,
body.bc-app-page [onclick] {
    transition: translate .20s var(--bc-spring), scale .18s var(--bc-spring), border-color .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease !important;
}
body.bc-app-page button:hover,
body.bc-app-page a[class*="rounded"]:hover,
body.bc-app-page [onclick][class*="rounded"]:hover { translate: 0 -1px; }
body.bc-app-page button:active,
body.bc-app-page [onclick][class*="rounded"]:active { scale: .98; }

body.bc-app-page input:focus,
body.bc-app-page select:focus,
body.bc-app-page textarea:focus {
    border-color: rgba(var(--bc-brand-rgb),.55) !important;
    box-shadow: 0 0 0 3px rgba(var(--bc-brand-rgb),.08) !important;
}

body.bc-app-page ::-webkit-scrollbar-thumb:hover { background: var(--bc-brand) !important; }

/* ---------- Payment / subscription ---------- */
body.bc-checkout-page {
    background:
        radial-gradient(circle at 50% -10%, rgba(var(--bc-brand-rgb),.16), transparent 27rem),
        #070908 !important;
}
body.bc-checkout-page main > div,
body.bc-checkout-page .modal > div {
    background:
        linear-gradient(145deg, rgba(255,255,255,.05), transparent 48%),
        #0d1211 !important;
    border-color: rgba(255,255,255,.10) !important;
    box-shadow: var(--bc-shadow) !important;
}
body.bc-checkout-page [class*="text-amber"],
body.bc-checkout-page [class*="text-rose"] { color: var(--bc-brand) !important; }
body.bc-checkout-page [class*="bg-amber-500"],
body.bc-checkout-page [class*="bg-rose-500"] {
    background-color: var(--bc-brand) !important;
    color: #03120f !important;
}
body.bc-checkout-page [class*="border-amber-500"],
body.bc-checkout-page [class*="border-rose-500"] { border-color: rgba(var(--bc-brand-rgb),.24) !important; }

/* ---------- Motion cursor aura (desktop only) ---------- */
.bc-cursor-aura {
    position: fixed;
    width: 240px;
    height: 240px;
    left: 0;
    top: 0;
    pointer-events: none;
    z-index: -1;
    border-radius: 50%;
    opacity: 0;
    filter: blur(14px);
    background: radial-gradient(circle, rgba(var(--bc-brand-rgb),.09), transparent 66%);
    transform: translate3d(-50%,-50%,0);
    transition: opacity .35s ease;
}
body.bc-cursor-active .bc-cursor-aura { opacity: 1; }

/* ---------- Accessibility & mobile ---------- */
@media (max-width: 767px) {
    body.bc-page-index header { padding: 8px 8px 0; }
    body.bc-page-index header nav { border-radius: 17px; }
    body.bc-page-index main > section:first-child { min-height: auto; }
    body.bc-page-index main > section:first-child::before { width: 58px; height: 58px; left: -18px; }
    body.bc-page-index main > section:first-child::after { right: 5%; top: 20%; }
    body.bc-page-index .feature-card:hover,
    body.bc-page-index .counter-card:hover { translate: 0 0; rotate: 0deg; }

    body.bc-page-agenda > .max-w-md {
        border-left: 0 !important;
        border-right: 0 !important;
        box-shadow: none !important;
    }

    .bc-cursor-aura { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    body.bc-enhanced *,
    body.bc-enhanced *::before,
    body.bc-enhanced *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
    body.bc-enhanced .bc-auto-reveal {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
    .bc-cursor-aura { display: none !important; }
}
