/* INKR Creative shared light/dark theme — build b19. */

html{
  color-scheme:light;
}

html[data-theme="dark"]{
  color-scheme:dark;
  --ink:#F7F5F0;
  --slate:#C1BDB2;
  --paper:#111217;
  --fog:#383A42;
  --white:#1C1E24;
  --charcoal:var(--slate);
  --ok:#55D6A8;
  --warn:#F2BE69;
}

body,
header.site-nav,
.mobile-menu,
.service-list,
.service-row,
.work-card,
.contact-form-wrap,
.chat-panel,
.wz,
.formside,
.pt-nav,
.pt-tabs,
.pt-card,
.drawer{
  transition:background-color .28s ease, border-color .28s ease, color .28s ease;
}

.theme-toggle{
  position:relative;
  display:inline-grid;
  place-items:center;
  width:42px;
  height:42px;
  flex:0 0 42px;
  padding:0;
  border:1px solid var(--fog);
  border-radius:50%;
  background:var(--white);
  color:var(--ink);
  cursor:pointer;
  overflow:hidden;
  box-shadow:0 4px 14px rgba(20,21,26,.09);
  -webkit-tap-highlight-color:transparent;
  transition:transform .18s ease, background-color .28s ease, border-color .28s ease,
             color .28s ease, box-shadow .18s ease;
}

.theme-toggle:hover{
  transform:translateY(-1px);
  border-color:var(--teal);
  box-shadow:0 7px 18px rgba(0,184,217,.18);
}

.theme-toggle:active{transform:translateY(0) scale(.96);}
.theme-toggle svg{
  position:absolute;
  width:20px;
  height:20px;
  transition:opacity .22s ease, transform .3s cubic-bezier(.16,.8,.24,1);
}

.theme-icon-sun{
  color:var(--coral);
  opacity:0;
  transform:rotate(-70deg) scale(.55);
}

.theme-icon-moon{
  color:var(--teal);
  opacity:1;
  transform:rotate(0) scale(1);
}

html[data-theme="dark"] .theme-icon-sun{
  opacity:1;
  transform:rotate(0) scale(1);
}

html[data-theme="dark"] .theme-icon-moon{
  opacity:0;
  transform:rotate(70deg) scale(.55);
}

.nav-row .theme-toggle{margin-left:12px;}
.pt-user .theme-toggle{margin-right:2px;}
.login-theme-toggle{position:fixed;top:20px;right:20px;z-index:10;}

/* Public site */
html[data-theme="dark"] .bg-anim,
html[data-theme="dark"] .mobile-menu{
  background:#111217;
}

html[data-theme="dark"] .bg-blob{mix-blend-mode:screen;opacity:.42;}
html[data-theme="dark"] .bg-grain{opacity:.025;filter:invert(1);}

html[data-theme="dark"] header.site-nav{
  background:rgba(17,18,23,.78);
  border-bottom-color:rgba(247,245,240,.12);
  box-shadow:0 1px 0 rgba(247,245,240,.04),0 8px 28px rgba(0,0,0,.18);
}

html[data-theme="dark"] .services .section-head::before,
html[data-theme="dark"] .hero-inner::before,
html[data-theme="dark"] .page-head-inner::before,
html[data-theme="dark"] .work .section-head::before,
html[data-theme="dark"] .contact-copy::before,
html[data-theme="dark"] .story .wrap::before{
  background:radial-gradient(ellipse at 30% 50%,rgba(17,18,23,.92) 34%,rgba(17,18,23,0) 82%);
}

html[data-theme="dark"] .contact,
html[data-theme="dark"] .story,
html[data-theme="dark"] .mv{background:rgba(17,18,23,.86);}
html[data-theme="dark"] .work{background:rgba(24,26,32,.9);}

html[data-theme="dark"]{
  --glass-fill:rgba(28,30,36,.72);
  --glass-fill-hi:rgba(36,39,46,.82);
  --glass-rim:rgba(247,245,240,.14);
  --glass-shadow:0 10px 34px rgba(0,0,0,.24);
  --glass-shadow-hi:0 18px 48px rgba(0,0,0,.32);
  --glass-inset:inset 0 1px 0 rgba(247,245,240,.10),inset 0 -1px 0 rgba(0,0,0,.18);
}

html[data-theme="dark"] .service-list,
html[data-theme="dark"] .work-card,
html[data-theme="dark"] .contact-form-wrap,
html[data-theme="dark"] .mv-card,
html[data-theme="dark"] .chat-panel{
  background:var(--glass-fill);
  border-color:var(--glass-rim);
}

html[data-theme="dark"] .service-list::before,
html[data-theme="dark"] .work-card::before,
html[data-theme="dark"] .contact-form-wrap::before,
html[data-theme="dark"] .mv-card::before{
  background:linear-gradient(135deg,rgba(247,245,240,.12),rgba(247,245,240,.025) 18%,transparent 40%);
}

html[data-theme="dark"] .contact-form-wrap .f-field input,
html[data-theme="dark"] .contact-form-wrap .f-field textarea,
html[data-theme="dark"] .chat-form input{
  background:rgba(17,18,23,.88);
  border-color:rgba(247,245,240,.14);
  color:var(--ink);
}

html[data-theme="dark"] .contact-form-wrap .f-field input:focus,
html[data-theme="dark"] .contact-form-wrap .f-field textarea:focus{
  background:#17191F;
  border-color:var(--teal);
}

html[data-theme="dark"] .chat-form,
html[data-theme="dark"] .wz-foot{background:rgba(17,18,23,.72);border-color:var(--fog);}
html[data-theme="dark"] .msg.bot,
html[data-theme="dark"] .f-choice span{background:var(--white);border-color:var(--fog);}
html[data-theme="dark"] .wz{background:rgba(17,18,23,.94);}

/* Keep signature Ink Black surfaces dark rather than allowing token inversion. */
html[data-theme="dark"] footer.site-footer,
html[data-theme="dark"] .chat-head,
html[data-theme="dark"] .wz-head{
  background:rgba(10,11,15,.92);
  color:#F7F5F0;
}

html[data-theme="dark"] footer.site-footer .section-label,
html[data-theme="dark"] footer.site-footer em,
html[data-theme="dark"] .chat-head .chat-head-txt span,
html[data-theme="dark"] .wz-kicker{color:#66E1F2;}

html[data-theme="dark"] .footer-links,
html[data-theme="dark"] .footer-copyright{color:rgba(247,245,240,.62);}
html[data-theme="dark"] .nav-toggle:hover{background:rgba(247,245,240,.08);}

/* Login */
html[data-theme="dark"] .brandside{background:#0B0C10;color:#F7F5F0;}
html[data-theme="dark"] .brandside-mid p{color:rgba(247,245,240,.72);}
html[data-theme="dark"] .formside{background:#111217;}
html[data-theme="dark"] .field input{background:var(--white);color:var(--ink);}
html[data-theme="dark"] .field input::placeholder{color:#7F817F;}
html[data-theme="dark"] .notice.err{color:#FF8D78;}
html[data-theme="dark"] .notice.info{color:#66E1F2;}

/* Portal */
html[data-theme="dark"] .bg-anim{background:#111217;}
html[data-theme="dark"] .pt-nav,
html[data-theme="dark"] .pt-tabs{background:rgba(17,18,23,.88);}
html[data-theme="dark"] .pt-tab:hover{background:rgba(247,245,240,.07);}
html[data-theme="dark"] .pt-chip{color:#66E1F2;}
html[data-theme="dark"] .pt-chip.bad{color:#FF8D78;}
html[data-theme="dark"] .uploader-drop{background:rgba(28,30,36,.72);}
html[data-theme="dark"] .file:hover{box-shadow:0 10px 24px rgba(0,0,0,.28);}
html[data-theme="dark"] .drawer-head,
html[data-theme="dark"] .drawer-preview,
html[data-theme="dark"] .demo-bar{
  background:#0B0C10;
  color:#F7F5F0;
}
html[data-theme="dark"] .drawer-head{color:#F7F5F0;}
html[data-theme="dark"] .drawer-preview{background:linear-gradient(135deg,#0B0C10,#242730);}
html[data-theme="dark"] .bubble.me,
html[data-theme="dark"] .card-face,
html[data-theme="dark"] .file-ico{
  background:#0B0C10;
  color:#F7F5F0;
}
html[data-theme="dark"] .bubble.me .bubble-meta,
html[data-theme="dark"] .card-exp{color:rgba(247,245,240,.58);}

@media (max-width:760px){
  .nav-row .theme-toggle{margin-left:auto;}
  .nav-cta{display:none;}
  .theme-toggle{width:40px;height:40px;flex-basis:40px;}
}

@media (max-width:900px){
  html[data-theme="dark"] .service-list,
  html[data-theme="dark"] .work-card,
  html[data-theme="dark"] .contact-form-wrap,
  html[data-theme="dark"] .chat-panel,
  html[data-theme="dark"] .mv-card{background:rgba(28,30,36,.82);}
}

@media (prefers-reduced-motion:reduce){
  .theme-toggle,
  .theme-toggle svg{transition:none;}
}
