/*
Theme Name: KinoCUT
Theme URI: https://kinocut.synology.me
Author: Kino
Description: Donker, snel en responsive thema voor het Kino-portaal en het CoreUtilityTool-overzicht. Geen externe lettertypes of scripts.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: kinocut
*/

:root{
  --bg:#0a0d14; --bg2:#0f1420; --card:#131a29; --card2:#18213a; --line:#243049;
  --tx:#e8ecf3; --mu:#8d98ad; --acc:#4c7dff; --acc2:#ff3cac; --ok:#2fd27a; --wr:#ffb020; --fo:#ff5a5a;
  --r:14px; --sh:0 10px 30px rgba(0,0,0,.35);
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:radial-gradient(1200px 600px at 80% -10%,rgba(76,125,255,.18),transparent 60%),radial-gradient(900px 500px at -10% 10%,rgba(255,60,172,.12),transparent 60%),var(--bg);background-attachment:fixed;color:var(--tx);font:16px/1.6 var(--font);min-height:100vh;display:flex;flex-direction:column}
a{color:var(--acc);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3,h4{line-height:1.25;letter-spacing:-.01em;margin:1.4em 0 .6em}
h1{font-size:clamp(1.6rem,3.5vw,2.4rem)}h2{font-size:clamp(1.25rem,2.4vw,1.6rem)}h3{font-size:1.1rem}
img{max-width:100%;height:auto}
code{background:var(--card2);padding:.1em .4em;border-radius:6px;font-size:.9em}
hr{border:0;border-top:1px solid var(--line);margin:24px 0}

/* Header */
.k-head{position:sticky;top:0;z-index:50;background:rgba(10,13,20,.82);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.k-head::after{content:"";display:block;height:2px;background:linear-gradient(90deg,var(--acc),var(--acc2))}
.k-bar{max-width:1400px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.k-logo{font-weight:800;font-size:1.25rem;letter-spacing:.02em;color:var(--tx)!important;text-decoration:none!important;display:flex;align-items:center;gap:10px}
.k-logo span{background:linear-gradient(90deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.k-dot{width:12px;height:12px;border-radius:50%;background:var(--acc2);box-shadow:0 0 12px var(--acc2)}
.k-nav{order:2;margin-left:auto;display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.k-nav a{color:var(--mu);padding:6px 12px;border-radius:999px;font-size:.92rem}
.k-nav a:hover,.k-nav a.on{color:var(--tx);background:var(--card2);text-decoration:none}
.k-lang{order:3;display:flex;gap:2px;font-size:.8rem;font-weight:600;letter-spacing:.04em}
.k-lang a{color:var(--mu);padding:4px 7px;border-radius:8px}
.k-lang a:hover{color:var(--tx);text-decoration:none;background:var(--card2)}
.k-lang a.on{color:var(--tx);background:var(--card2);box-shadow:inset 0 0 0 1px var(--line)}
.kp-tr-note{background:#fcf0c3;color:#1d2327}
.k-menu-btn{order:4;display:none;background:var(--card2);border:1px solid var(--line);color:var(--tx);border-radius:10px;padding:6px 12px;font-size:1rem}

/* Layout */
.k-main{flex:1;width:100%;max-width:1400px;margin:0 auto;padding:24px 16px 48px}
.k-page{background:transparent}
.k-page>.k-title{margin-top:.2em}
.k-narrow{max-width:860px}
.k-foot{border-top:1px solid var(--line);color:var(--mu);font-size:.88rem}
.k-foot .k-bar{justify-content:space-between}
.k-foot a{color:var(--mu)}

/* Cards (plugin elements) */
body .kp-card{background:linear-gradient(180deg,var(--card),var(--bg2));border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;box-shadow:var(--sh);color:var(--tx)}
body .kp-wrap{max-width:none}
body .kp-top{color:var(--mu)}
body .kp-ok{background:rgba(47,210,122,.12);border:1px solid rgba(47,210,122,.4);color:var(--tx)}
body .kp-err{background:rgba(255,90,90,.12);border:1px solid rgba(255,90,90,.4);color:var(--tx)}
body .kp-badge{background:var(--card2);color:var(--tx);border:1px solid var(--line)}
body .kp-verstuurd,body .kp-getekend_artiest,body .kp-getekend_organisator{background:rgba(255,176,32,.15);border-color:rgba(255,176,32,.5)}
body .kp-volledig{background:rgba(47,210,122,.15);border-color:rgba(47,210,122,.5)}
body .kp-btn{background:linear-gradient(90deg,var(--acc),#7a5cff);color:#fff!important;border-radius:10px;font-weight:600;box-shadow:0 6px 18px rgba(76,125,255,.35)}
body .kp-btn:hover{filter:brightness(1.1);text-decoration:none}
body .kp-btn-sec{background:var(--card2);box-shadow:none}
body .kp-legal{color:var(--mu)}
body .kp-doc{background:#f7f8fa;color:#1b1f24}
body .kp-doc h2,body .kp-doc h3{color:#1b1f24}

/* Overview tabs + filters */
body .kp-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
body .kp-tabs .nav-tab{background:var(--card);border:1px solid var(--line);color:var(--mu);border-radius:999px;padding:6px 14px;font-size:.9rem;margin:0}
body .kp-tabs .nav-tab:hover{color:var(--tx);text-decoration:none}
body .kp-tabs .nav-tab-active{background:linear-gradient(90deg,var(--acc),var(--acc2));border-color:transparent;color:#fff}
body .kp-ov-filters{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}
body .kp-ov-filters label{color:var(--mu);font-size:.92rem;display:inline-flex;gap:6px;align-items:center;margin:0}
input[type=text],input[type=search],input[type=email],input[type=password],input[type=date],select,textarea{background:var(--bg2);color:var(--tx);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font:inherit;max-width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acc);outline-offset:1px;border-color:transparent}
input[type=checkbox]{accent-color:var(--acc2);width:16px;height:16px}
button,input[type=submit]{font:inherit;cursor:pointer}
#kp-ov-q{min-width:min(320px,100%)}
body .kp-muted{color:var(--mu)}

/* Tables */
body .kp-scroll{padding:0;overflow:auto;max-height:70vh}
body .kp-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem}
body .kp-table th{position:sticky;top:0;z-index:1;background:var(--card2);color:var(--mu);font-weight:600;text-transform:uppercase;font-size:.72rem;letter-spacing:.06em;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
body .kp-table td{padding:9px 12px;border-bottom:1px solid rgba(36,48,73,.6);vertical-align:top}
body .kp-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.015)}
body .kp-table tbody tr:hover td{background:rgba(76,125,255,.10)}
body .kp-table td.k-pill-ja{color:var(--ok);font-weight:600}
body .kp-table td.k-pill-nee{color:var(--fo)}

/* Login form */
#loginform p{margin:0 0 12px}#loginform label{display:block;color:var(--mu);font-size:.9rem;margin-bottom:4px}
#loginform input[type=text],#loginform input[type=password]{width:100%}
#loginform .login-remember label{display:flex;gap:8px;align-items:center}
#loginform input[type=submit]{background:linear-gradient(90deg,var(--acc),#7a5cff);color:#fff;border:0;border-radius:10px;padding:10px 22px;font-weight:600}

/* Legal pages */
.k-content table{border-collapse:collapse;width:100%}.k-content th,.k-content td{border-bottom:1px solid var(--line);padding:8px;text-align:left}
.k-content ul,.k-content ol{padding-left:1.3em}

/* Cookie bar */
body #kp-cookie{background:var(--card2);border:1px solid var(--line);box-shadow:var(--sh)}

/* Mobile */
@media (max-width:760px){
  .k-menu-btn{display:block}
  .k-lang{margin-left:auto}
  .k-lang a{padding:4px 5px}
  .k-nav{order:5;margin-left:0;display:none;width:100%;flex-direction:column;align-items:stretch}
  .k-nav.open{display:flex}
  .k-nav a{padding:10px 12px}
  .k-main{padding:16px 12px 40px}
  body .kp-card{padding:14px}
  body .kp-scroll{max-height:none;overflow:visible;background:transparent;border:0;box-shadow:none}
  body .kp-table thead{display:none}
  body .kp-table,body .kp-table tbody,body .kp-table tr,body .kp-table td{display:block;width:100%}
  body .kp-table tr{background:linear-gradient(180deg,var(--card),var(--bg2));border:1px solid var(--line);border-radius:12px;margin:0 0 10px;padding:6px 0;box-shadow:var(--sh)}
  body .kp-table tbody tr:nth-child(even) td,body .kp-table tbody tr:hover td{background:transparent}
  body .kp-table td{display:flex;justify-content:space-between;gap:12px;border:0;padding:5px 14px;text-align:right}
  body .kp-table td::before{content:attr(data-label);color:var(--mu);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;text-align:left;flex:0 0 40%}
  body .kp-table td:first-child{font-weight:700;font-size:1rem}
  body .kp-table td:empty{display:none}
}
@media print{.k-head,.k-foot,#kp-cookie{display:none}body{background:#fff;color:#000}}
