/* ============================================================
   ChatLink — Main Stylesheet (Entry Point)
   ------------------------------------------------------------
   Imports all modular stylesheets in cascade order:
   1. Variables  → design tokens
   2. Base        → document resets
   3. Components  → reusable UI pieces
   4. Sections    → page-section styling
   5. Utilities   → animations, reveal, scrollbar
   ============================================================ */

/* 1. Design Tokens */
@import url('variables/variables.css');

/* 2. Base */
@import url('base/base.css');

/* 3. Components */
@import url('components/glass-buttons.css');
@import url('components/phone-frame.css');
@import url('components/cards.css');
@import url('components/faq-avatar.css');
@import url('components/preloader.css');
@import url('components/fullscreen-menu.css');
@import url('components/orbit.css');
@import url('components/snackbar.css');

/* 4. Sections */
@import url('sections/sections.css');

/* 5. Utilities */
@import url('utilities/utilities.css');

.apk-toast{position:fixed;top:84px;left:50%;transform:translate(-50%,-140%);z-index:60;display:flex;align-items:center;gap:12px;padding:12px 20px 12px 14px;width:max-content;max-width:calc(100% - 32px);background:rgba(17,17,29,.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(124,77,255,.35);border-radius:9999px;box-shadow:0 10px 40px rgba(124,77,255,.25);opacity:0;pointer-events:none;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .4s ease}
.apk-toast.is-show{transform:translate(-50%,0);opacity:1}
.apk-toast__icon{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#9e73ff,#7C4DFF);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.apk-toast__icon svg{width:18px;height:18px}
.apk-toast__icon path{stroke-dasharray:30;stroke-dashoffset:30}
.apk-toast.is-show .apk-toast__icon path{animation:apkTick .5s .25s ease forwards}
.apk-toast__text{display:flex;flex-direction:column;line-height:1.25;font-family:"Space Grotesk",Inter,sans-serif}
.apk-toast__text strong{font-size:14px;font-weight:600;color:#fff}
.apk-toast__text small{font-size:12px;color:rgba(255,255,255,.6)}
@keyframes apkTick{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.apk-toast,.apk-toast__icon path{transition:none;animation:none!important;stroke-dashoffset:0}}

.theme-toggle{display:inline-flex;align-items:center;gap:12px;padding:8px 18px 8px 8px;border-radius:9999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;font-family:"Space Grotesk",Inter,sans-serif;font-size:13px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:background .3s,border-color .3s}
.theme-toggle:hover{border-color:rgba(124,77,255,.6)}
.theme-toggle__track{position:relative;width:56px;height:30px;border-radius:9999px;background:rgba(124,77,255,.25);flex-shrink:0}
.theme-toggle__knob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#9e73ff,#7C4DFF);display:flex;align-items:center;justify-content:center;color:#fff;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.theme-toggle__knob svg{position:absolute;width:14px;height:14px;transition:opacity .3s,transform .5s cubic-bezier(.22,1,.36,1)}
.theme-toggle .icon-sun{opacity:0;transform:rotate(-90deg) scale(.5)}
[data-theme="light"] .theme-toggle__knob{transform:translateX(26px)}
[data-theme="light"] .theme-toggle .icon-moon{opacity:0;transform:rotate(90deg) scale(.5)}
[data-theme="light"] .theme-toggle .icon-sun{opacity:1;transform:rotate(0) scale(1)}

::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}
::view-transition-new(root){z-index:2}
html.theme-anim,html.theme-anim *,html.theme-anim *::before,html.theme-anim *::after{transition:background-color .5s ease,color .5s ease,border-color .5s ease,fill .5s ease,stroke .5s ease,box-shadow .5s ease!important}

html[data-theme="light"]{color-scheme:light;--ink:#F6F4FF;--ink2:#FFFFFF;--ink3:#FFFFFF;--text-primary:#0A0A12;--text-muted:rgba(10,10,18,.65);--text-faint:rgba(10,10,18,.5);--glass-bg:rgba(255,255,255,.72);--glass-border:rgba(10,10,18,.08);--glass-border-strong:rgba(10,10,18,.15);--gradient-phone:linear-gradient(145deg,#29283a,#11111d)}
[data-theme="light"] body{background:#F6F4FF;color:#0A0A12}

[data-theme="light"] .text-white{color:#0A0A12}
[data-theme="light"] .text-white\/90,[data-theme="light"] .text-white\/80{color:rgba(10,10,18,.85)}
[data-theme="light"] .text-white\/70{color:rgba(10,10,18,.75)}
[data-theme="light"] .text-white\/60{color:rgba(10,10,18,.65)}
[data-theme="light"] .text-white\/50{color:rgba(10,10,18,.55)}
[data-theme="light"] .text-white\/40{color:rgba(10,10,18,.5)}
[data-theme="light"] .text-brand-300,[data-theme="light"] .text-brand-400{color:#5a2fd1}
[data-theme="light"] .hover\:text-white:hover{color:#0A0A12}
[data-theme="light"] .text-ink{color:#0A0A12}
[data-theme="light"] .border-white\/5{border-color:rgba(10,10,18,.08)}
[data-theme="light"] .border-white\/10{border-color:rgba(10,10,18,.12)}
[data-theme="light"] .bg-white\/10,[data-theme="light"] .bg-white\/5{background-color:rgba(10,10,18,.06)}
[data-theme="light"] .bg-ink{background-color:#FFFFFF}
[data-theme="light"] .bg-ink2,[data-theme="light"] .bg-ink3{background-color:#FFFFFF}
[data-theme="light"] .border-ink{border-color:#F6F4FF}
[data-theme="light"] .from-ink{--tw-gradient-from:#F6F4FF var(--tw-gradient-from-position);--tw-gradient-to:rgba(246,244,255,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}

[data-theme="light"] .glass{background:rgba(255,255,255,.72);border-color:rgba(124,77,255,.15);box-shadow:0 8px 30px rgba(90,47,209,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
[data-theme="light"] .feature-card:hover{box-shadow:0 14px 40px rgba(124,77,255,.18)}
[data-theme="light"] .hero-bg{background:radial-gradient(60% 50% at 80% 10%,rgba(124,77,255,.18),transparent 70%),radial-gradient(50% 40% at 10% 90%,rgba(158,115,255,.15),transparent 70%),#F6F4FF}
[data-theme="light"] .grid-bg{background-image:linear-gradient(rgba(10,10,18,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(10,10,18,.05) 1px,transparent 1px)}
[data-theme="light"] .gradient-text{background-image:linear-gradient(90deg,#5a2fd1,#7C4DFF,#9e73ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
[data-theme="light"] .free-card{background:#fff;border:1px solid rgba(124,77,255,.2);box-shadow:0 20px 60px rgba(90,47,209,.12)}
[data-theme="light"] .btn-ghost{background:#fff;color:#0A0A12;border:1px solid rgba(10,10,18,.15)}
[data-theme="light"] .btn-ghost:hover{border-color:#7C4DFF}
[data-theme="light"] header img[alt="ChatLink"],[data-theme="light"] footer img[alt="ChatLink"]{background:#7C4DFF;border-radius:12px;padding:5px}
[data-theme="light"] .orbit-node__btn{background:rgba(255,255,255,.85);border-color:rgba(124,77,255,.3);color:#5a2fd1;box-shadow:0 8px 24px rgba(124,77,255,.2)}
[data-theme="light"] .orbit-node__btn svg{stroke:#5a2fd1}
[data-theme="light"] .phone-frame{background:linear-gradient(145deg,#29283a,#11111d);box-shadow:0 28px 60px rgba(30,20,60,.2),0 0 0 1px rgba(90,47,209,.12)}
[data-theme="light"] .menu-btn,[data-theme="light"] .menu-close{border-color:rgba(10,10,18,.15);color:#0A0A12;background:rgba(255,255,255,.6)}
[data-theme="light"] .preloader{background:#F6F4FF;color:#0A0A12}
[data-theme="light"] .preloader__counter,[data-theme="light"] .preloader__credit-title{color:#0A0A12}
[data-theme="light"] .preloader__counter::after{color:#5a2fd1}
[data-theme="light"] .preloader__credit-sub{color:rgba(10,10,18,.6)}
[data-theme="light"] .preloader__bar{background:rgba(10,10,18,.1)}
[data-theme="light"] .scroll-progress{box-shadow:0 0 12px rgba(124,77,255,.35)}
[data-theme="light"] .fullscreen-menu{background:radial-gradient(60% 50% at 90% 0%,rgba(124,77,255,.2),transparent 70%),#F6F4FF}
[data-theme="light"] .menu-link{border-color:rgba(10,10,18,.1)}
[data-theme="light"] .menu-link__index{color:#5a2fd1}
[data-theme="light"] .menu-link__text{color:#0A0A12;background:none;-webkit-text-fill-color:#0A0A12}
[data-theme="light"] .menu-link:hover .menu-link__text,[data-theme="light"] .menu-link--cta .menu-link__text{background:linear-gradient(90deg,#5a2fd1,#7C4DFF);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
[data-theme="light"] .theme-toggle{border-color:rgba(10,10,18,.15);background:rgba(255,255,255,.7);color:#0A0A12}
[data-theme="light"] .apk-toast{background:rgba(255,255,255,.9);border-color:rgba(124,77,255,.35)}
[data-theme="light"] .apk-toast__text strong{color:#0A0A12}
[data-theme="light"] .apk-toast__text small{color:rgba(10,10,18,.6)}
[data-theme="light"] .on-brand,[data-theme="light"] .on-brand *{color:#fff}
[data-theme="light"] .on-brand .text-ink,[data-theme="light"] .on-brand .text-ink *{color:#0A0A12}

@media (prefers-reduced-motion:reduce){
   ::view-transition-old(root),::view-transition-new(root){animation:none!important}
   html[data-theme],html[data-theme] *,html[data-theme] *::before,html[data-theme] *::after{transition:none!important}
   .theme-toggle__knob,.theme-toggle__knob svg{transition:none!important}
}
