/*
Theme Name: Mekongzon Skynez v5.0 (Unified Core)
Theme URI: https://mekongzon.example
Author: Mekongzon
Author URI: https://mekongzon.example
Description: Unified Skynez WebApp: 3 columns (15/60/25), Chart 62/38, Skynez Action Board, Right Dock (Chat/Forecast/Strategy/Insight). OpenAI API direct integration. Customizer for logo/text/font/slogan. i18n & auto dark/light.
Version: 5.0
License: GPLv3
Text Domain: mekongzon-skynez
Tags: webapp, dashboard, ai, trading, mekongzon, skynez
*/
:root{--brand:#0a7cff;--brand-2:#66aaff;--bg:#ffffff;--surface:#f6f8fc;--text:#0f172a;--muted:#64748b;--border:#e5e7eb;--header:60px;--adminbar:0px;--gap:14px;--radius:12px;--radius-lg:16px;--shadow:0 4px 16px rgba(0,0,0,.05);--font-ui:"Mekongzon Sans",system-ui,Segoe UI,Roboto,Arial,sans-serif}
@media (prefers-color-scheme: dark){:root{--brand:#66aaff;--bg:#0b0f14;--surface:#0f141b;--text:#e5e7eb;--muted:#9aa4b2;--border:#243043;--shadow:0 4px 16px rgba(0,0,0,.35)}}
*,*::before,*::after{box-sizing:border-box}html,body{height:100vh;width:100%;margin:0;padding:0;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font-ui)}
.app-header{position:fixed;top:var(--adminbar,0);left:0;right:0;height:var(--header);display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:linear-gradient(180deg,#ffffff,#fbfdff);border-bottom:1px solid var(--border);box-shadow:0 6px 14px rgba(0,0,0,.05);z-index:100}
@media (prefers-color-scheme: dark){.app-header{background:linear-gradient(180deg,#0f141b,#0d1117)}}
.app-header .left{display:flex;align-items:center;gap:12px;min-width:240px}
.app-header .logo-box{display:flex;align-items:center;gap:10px}
.app-header .logo{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--brand);color:#fff;font-weight:800}
.app-header .title{font-weight:800;letter-spacing:.2px;white-space:nowrap}
.app-header .context{font-size:12px;color:var(--muted);padding:4px 8px;border:1px solid var(--border);border-radius:999px}
.app-header .center{flex:1;display:flex;align-items:center;justify-content:center}
.search-wrap{flex:1;max-width:980px;margin-left:calc(15% + var(--gap));margin-right:calc(25% + var(--gap));display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:8px 12px}
.search-wrap input{border:none;outline:none;background:transparent;color:var(--text);width:100%;font-size:15px}
.app-header .right{display:flex;align-items:center;gap:8px}
.pill{padding:7px 10px;border:1px solid var(--border);border-radius:10px;background:var(--bg)}
.iconbtn{border:1px solid var(--border);background:var(--bg);border-radius:10px;padding:6px 10px;cursor:pointer}
.iconbtn:hover{border-color:var(--brand);background:rgba(10,124,255,.06)}
.admin-bar .app-header{top:32px}@media (max-width:782px){.admin-bar .app-header{top:46px}}
.app-workspace{position:fixed;top:calc(var(--header) + var(--adminbar, 0));left:0;right:0;bottom:0;display:grid;grid-template-columns:15% 60% 25%;gap:var(--gap);padding:var(--gap);background:var(--surface);height:calc(100vh - var(--header) - var(--adminbar, 0));overflow:hidden}
.app-col{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);min-height:0;min-width:0;display:flex;flex-direction:column;overflow:hidden}
.sidebar{overflow-y:auto;display:flex;flex-direction:column}
.sidebar .brand{padding:12px;display:flex;gap:10px;align-items:center;border-bottom:1px solid var(--border)}
.sidebar .brand .logo-mini{width:28px;height:28px;border-radius:8px;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800}
.sidebar .brand .txt{font-weight:800}
.sidebar .group{padding:10px 12px;font-weight:800;color:var(--muted);border-bottom:1px solid var(--border)}
.nav{display:grid;gap:6px;padding:10px}
.nav a{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;text-decoration:none;color:inherit;background:var(--bg);transition:.2s ease}
.nav a:hover{border-color:var(--brand);background:rgba(10,124,255,.06)}
.sidebar-footer{margin-top:auto;padding:12px;border-top:1px solid var(--border);background:var(--bg)}
.sidebar-footer .row{display:flex;gap:8px;margin-bottom:10px}
.sidebar-footer-menu{list-style:none;margin:0 0 8px 0;padding:0;display:grid;gap:6px}
.sidebar-footer-menu a{color:var(--muted);text-decoration:none;font-size:13px}
.sidebar-footer-menu a:hover{color:var(--text)}
.copy{font-size:12px;color:var(--muted)}
.main{display:grid;grid-template-rows:62fr 38fr;gap:10px;min-height:0;padding:0;background:transparent;border:none;box-shadow:none}
.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);min-height:0}
.card-header{padding:10px 12px;border-bottom:1px solid var(--border);font-weight:800;display:flex;align-items:center;justify-content:space-between}
.card-body{height:100%;padding:0}
.chart-wrap{height:100%;width:100%;overflow:hidden;background:var(--surface);border-radius:var(--radius);box-shadow:inset 0 0 0 1px var(--border);padding:6px}
.chart-wrap iframe{width:100%;height:100%;border:0;display:block}
.action-board{display:flex;flex-direction:column;height:100%}
.action-tabs{display:flex;gap:6px;padding:10px;border-bottom:1px solid var(--border);background:var(--bg)}
.action-tabs button{flex:1;border:1px solid var(--border);background:var(--surface);padding:8px 10px;border-radius:10px;font-weight:600;cursor:pointer}
.action-tabs button.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.action-body{flex:1;overflow:auto;padding:10px}
.action-footer{padding:8px 10px;border-top:1px solid var(--border);color:var(--muted);font-size:12px}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:8px 10px;border-bottom:1px dashed var(--border);text-align:left}.table th{color:var(--muted);font-weight:800}
.skynez{display:flex;flex-direction:column;border-radius:var(--radius-lg);background:var(--bg);border:1px solid var(--border);box-shadow:0 6px 20px rgba(0,0,0,.05);overflow:hidden}
.skynez-head{padding:12px 12px;border-bottom:1px solid var(--border);font-weight:800;display:flex;align-items:center;justify-content:space-between}
.skynez-tabs{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--border)}
.skynez-tabs button{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:8px 0;font-weight:600;cursor:pointer;transition:.2s ease}
.skynez-tabs button.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.skynez-body{flex:1;overflow:auto;padding:12px;display:none}
.skynez-body.active{display:block}
.msg{display:flex;gap:10px;margin-bottom:8px}
.msg .avatar{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff;font-size:.8rem;flex:0 0 26px}
.msg.user .avatar{background:#888}
.bubble{border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:var(--bg);max-width:75%}
.msg.user .bubble{margin-left:auto;background:var(--brand);color:#fff;border-color:transparent}
.skynez-input{border-top:1px solid var(--border);background:var(--surface);display:flex;align-items:center;gap:8px;padding:10px 12px}
.skynez-input input{flex:1;border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:transparent;color:var(--text);outline:none}
.skynez-input button{border:none;background:var(--brand);color:#fff;padding:10px 14px;border-radius:10px;font-weight:700;cursor:pointer}
@media (max-width:1200px){.app-workspace{grid-template-columns:0 65% 35%}.sidebar{display:none}.app-header .center .search-wrap{margin-left:var(--gap);margin-right:calc(35% + var(--gap))}}
@media (max-width:900px){.app-workspace{grid-template-columns:100% 0 0}.skynez{display:none}.app-header .center .search-wrap{margin:0 12px}}
