/* kinodom.live | movie / series navigation and home section | v1.0.0
   Standalone additive styles, loaded after the site's existing stylesheet. */
.kd-header .kd-nav.kd-nav-switches {
    display:flex;
    position:static;
    align-items:center;
    justify-content:center;
    align-self:stretch;
    margin-left:auto;
    gap:16px;
    padding:0;
    border:0;
    border-radius:0;
    box-shadow:none;
    background:transparent;
    backdrop-filter:none;
    min-width:0;
}
.kd-header .kd-nav.kd-nav-switches .kd-nav-switch {
    position:relative;
    width:80px;
    height:100%;
    padding:7px 2px 5px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    color:rgba(245,247,255,.84);
    font-weight:700;
    font-size:12px;
    line-height:1.1;
    letter-spacing:.03em;
    text-decoration:none;
    transition:color .2s ease;
}
.kd-header .kd-nav.kd-nav-switches .kd-nav-switch::after { display:none;content:none; }
.kd-nav-switch-icon {
    display:grid;
    place-items:center;
    flex:none;
    width:40px;
    height:37px;
    border:1px solid rgba(239,240,255,.27);
    border-radius:12px;
    background:rgba(12,12,24,.32);
    color:#e9ebf7;
    box-shadow:inset 0 1px rgba(255,255,255,.055),0 5px 16px rgba(0,0,0,.12);
    transition:background .22s,border-color .22s,box-shadow .22s,transform .22s;
}
.kd-nav-switch-icon svg {width:19px;height:19px;display:block;}
.kd-nav-switch-label {white-space:nowrap;}
.kd-header .kd-nav.kd-nav-switches .kd-nav-switch:hover,
.kd-header .kd-nav.kd-nav-switches .kd-nav-switch.active {color:#fff;}
.kd-nav-switch:hover .kd-nav-switch-icon,
.kd-nav-switch.active .kd-nav-switch-icon {
    transform:translateY(-2px);
    border-color:rgba(60,207,255,.7);
    background:linear-gradient(145deg,rgba(24,125,169,.24),rgba(68,35,108,.2));
    box-shadow:0 0 0 3px rgba(45,198,250,.06),0 10px 25px rgba(0,0,0,.19);
}
.kd-nav-switch.active .kd-nav-switch-label {color:#9beaff;}
.kd-header .kd-header-actions {margin-left:4px;align-items:center;}
.kd-header .kd-icon-btn {transition:background .2s,border-color .2s,transform .2s;}
.kd-header .kd-icon-btn:hover {transform:translateY(-1px);background:rgba(37,197,255,.14);border-color:rgba(75,204,255,.48);}
.kd-header .kd-nav-switch:focus-visible,
.kd-header .kd-icon-btn:focus-visible {outline:2px solid #57d8ff;outline-offset:3px;}
.kd-header .kd-menu-btn {display:none!important;}
.kd-home-series {position:relative;}
.kd-home-series .kd-section-head h2 {display:flex;align-items:center;gap:10px;}
.kd-home-series .kd-section-head h2::before {content:"";display:block;width:4px;height:26px;border-radius:9px;background:linear-gradient(180deg,#17d5ff,#776af5);}
@media(max-width:900px){
  .kd-header .kd-nav.kd-nav-switches {display:flex!important;left:auto;right:auto;top:auto;}
}
@media(max-width:640px){
  .kd-header {gap:5px!important;padding-left:12px!important;padding-right:12px!important;}
  .kd-header .kd-nav.kd-nav-switches {gap:2px;margin-left:auto;}
  .kd-header .kd-nav.kd-nav-switches .kd-nav-switch {width:61px;font-size:10px;padding:4px 0 3px;gap:4px;}
  .kd-nav-switch-icon {width:34px;height:33px;border-radius:10px;}
  .kd-nav-switch-icon svg {width:17px;height:17px;}
  .kd-header .kd-header-actions {gap:4px!important;margin-left:3px;}
  .kd-header .kd-icon-btn {width:35px;height:35px;}
  .kd-header .kd-logo {gap:5px;font-size:18px;}
}
@media(max-width:460px){
  .kd-header .kd-logo-name {display:none;}
  .kd-header .kd-logo-mark {flex:none;}
}
@media(max-width:350px){
  .kd-header .kd-nav.kd-nav-switches .kd-nav-switch {width:54px;font-size:9px;}
  .kd-header .kd-header-actions .kd-icon-btn {width:32px;height:32px;}
}
@media(prefers-reduced-motion:reduce){
  .kd-nav-switch,.kd-nav-switch-icon,.kd-header .kd-icon-btn {transition:none!important;}
}
html[data-theme="light"] .kd-nav-switch-icon {
  color:#1c293e;background:rgba(255,255,255,.7);border-color:rgba(20,40,70,.2);
}
html[data-theme="light"] .kd-header .kd-nav.kd-nav-switches .kd-nav-switch {color:#24334c;}
html[data-theme="light"] .kd-header .kd-nav.kd-nav-switches .kd-nav-switch.active .kd-nav-switch-label {color:#087da7;}

/* Keep the prominent site brand readable next to the icon navigation. */
.kd-header .kd-nav.kd-nav-switches .kd-nav-switch:not(.active):hover .kd-nav-switch-label{color:#b8efff;}
html[data-theme="light"] .kd-header .kd-nav.kd-nav-switches .kd-nav-switch:not(.active):hover .kd-nav-switch-label {color:#087da7;}
@media(max-width:640px){.kd-header .kd-nav.kd-nav-switches .kd-nav-switch {line-height:1.15!important}}
