/* JS TECH SOLUTION visual layer. Routes, API calls, permissions and controls are unchanged. */
:root { --js-navy:#0b2035; --js-navy-light:#183b57; --js-blue:#147cb4; --js-ice:#bce9fa; --js-text:#243b50; --js-muted:#697f91; --js-border:#dce5ed; --js-surface:#f3f7fa; }
.jstech-theme body, .jstech-theme button, .jstech-theme input, .jstech-theme textarea, .jstech-theme #app .main-container { font-family:"Malgun Gothic","맑은 고딕","Segoe UI",Arial,sans-serif; }
.jstech-theme body { color:var(--js-text); background:var(--js-surface); }
.jstech-theme .navbar { background:var(--js-navy)!important; border-bottom:1px solid #29465e!important; box-shadow:0 3px 14px #0b20351a; }
.jstech-theme .navbar > .left-menu > .left-menu-logo { background:url(brand-logo.svg) center/contain no-repeat; }
.jstech-theme .navbar > .left-menu > .left-menu-logo > use { opacity:0; }
.jstech-theme .navbar .right-menu { color:#fff; }
.jstech-theme .el-button { border-radius:7px; font-weight:500; }
.jstech-theme .el-button--primary:not(.is-disabled) { color:#fff; background:var(--js-blue); border-color:var(--js-blue); }
.jstech-theme .el-button--primary:not(.is-disabled):hover { background:#11689a; border-color:#11689a; }
.jstech-theme .el-button--primary.is-plain:not(.is-disabled) { color:#11689a; background:#eaf5fb; border-color:#b7daed; }
.jstech-theme .el-button--text { color:var(--js-blue); }
.jstech-theme .el-input__inner, .jstech-theme .el-textarea__inner { border-color:var(--js-border); border-radius:6px; color:var(--js-text); }
.jstech-theme .el-input__inner:focus, .jstech-theme .el-textarea__inner:focus { border-color:var(--js-blue); }
.jstech-theme .el-input.is-disabled .el-input__inner { color:#8795a2; }
.jstech-theme .el-table { color:var(--js-text); border-color:var(--js-border); }
.jstech-theme .el-table th, .jstech-theme .el-table th.is-leaf { background:#edf4f8; color:#365269; border-color:var(--js-border); }
.jstech-theme #app .el-table th.is-leaf, .jstech-theme #app .el-table th.is-leaf .cell { background:#edf4f8!important; color:#365269!important; }
.jstech-theme .el-table td { border-color:#e8eef3; }
.jstech-theme .el-table--enable-row-hover .el-table__body tr:hover > td { background:#f1f8fc; }
.jstech-theme .el-dialog, .jstech-theme .el-message-box { border-radius:12px; box-shadow:0 16px 60px #0b203533; }
.jstech-theme .el-dialog__header { border-bottom:1px solid #e8eef3; }
.jstech-theme .el-card { border-radius:10px; border-color:var(--js-border); box-shadow:0 3px 12px #0b203508; }
.jstech-theme .el-card__header { border-color:#e8eef3; }
.jstech-theme .el-tabs__item.is-active, .jstech-theme .el-tabs__item:hover, .jstech-theme .el-pager li.active { color:var(--js-blue); }
.jstech-theme .el-tabs__active-bar { background:var(--js-blue); }
.jstech-theme .el-checkbox__input.is-checked .el-checkbox__inner, .jstech-theme .el-radio__input.is-checked .el-radio__inner { background:var(--js-blue); border-color:var(--js-blue); }
.jstech-theme .el-checkbox__input.is-checked + .el-checkbox__label, .jstech-theme .el-radio__input.is-checked + .el-radio__label { color:var(--js-blue); }
.jstech-theme .el-pagination { color:var(--js-muted); }
.jstech-theme button:focus-visible, .jstech-theme a:focus-visible, .jstech-theme input:focus-visible { outline:2px solid #4db6e2; outline-offset:3px; }

/* Management dashboard: preserve original navigation sizes and collapse behavior. */
.jstech-dashboard #app .sidebar-container, .jstech-dashboard #app .sidebar-container .el-menu { background:var(--js-navy)!important; }
.jstech-dashboard #app .sidebar-container .el-menu-item, .jstech-dashboard #app .sidebar-container .el-submenu__title { background:transparent!important; color:#dce9f3!important; }
.jstech-dashboard #app .sidebar-container .el-menu-item:hover, .jstech-dashboard #app .sidebar-container .el-submenu__title:hover { background:#173b55!important; }
.jstech-dashboard #app .sidebar-container .el-menu-item.is-active { background:#204b68!important; color:var(--js-ice)!important; box-shadow:inset 3px 0 var(--js-ice); }
.jstech-dashboard #app .main-container { background:var(--js-surface); }
.jstech-dashboard .navbar > .left-menu > .left-menu-logo { width:180px!important; height:52px!important; margin-top:8px!important; }
.jstech-dashboard .navbar > .left-menu > a .left-menu-logo { width:200px!important; height:56px!important; margin-top:7px!important; background:url(brand-logo.svg) center/contain no-repeat; }
.jstech-dashboard .navbar > .left-menu > a .left-menu-logo use { opacity:0; }
.jstech-dashboard .navbar.nb-bar { background:white!important; box-shadow:none; border-color:var(--js-border)!important; }
.jstech-dashboard .dashboard-container .app-container { background:linear-gradient(125deg,#102a40,#173c57)!important; padding:24px; }
.jstech-dashboard .dashboard-container .app-container:before { content:"제이에스테크솔루션  /  통합 관리 대시보드"; display:block; color:#e6f5fd; font-size:20px; font-weight:600; letter-spacing:-.5px; margin:0 0 22px; }
.jstech-dashboard .dashboard-container .card-panel { background:#1c425d!important; border:1px solid #3d627b; border-radius:12px; color:#c5e9fa!important; }
.jstech-dashboard .dashboard-container .card-panel-text { font-size:18px!important; color:#bedcec!important; }
.jstech-dashboard .dashboard-container .card-panel-text-nub { color:white!important; font-size:36px!important; }
.jstech-dashboard .dashboard-container .bar-charts, .jstech-dashboard .dashboard-container .heatmap-charts { background:#102b45!important; border:1px solid #47667c!important; border-radius:10px; }
.jstech-dashboard .dashboard-container .bar-charts-title, .jstech-dashboard .dashboard-container .heatmap-charts-title { color:#d9edf8!important; font-weight:500; }
.jstech-dashboard .dashboard-container .el-button--default { background:#234a65; color:#e0f2fc; border-color:#60849d; }

/* Console: original links and device controls retain their hit areas. */
.jstech-console .navbar > .left-menu { width:190px; }
.jstech-console .navbar > .left-menu > .left-menu-logo { width:170px!important; height:66px!important; margin:10px 10px 0!important; }
.jstech-console #app .navbar > .sidebar-container { background:transparent!important; }
.jstech-console .sidebar > a { background:#20445f; border-radius:9px 9px 0 0; }
.jstech-console .sidebar > a:hover { background:#2b5571; }
.jstech-console .sidebar > a .el-menu-item { background:transparent!important; }
.jstech-console .sidebar > a.router-link-active { background:var(--js-surface); }
.jstech-console .sidebar .el-menu-item.is-active { background:var(--js-surface)!important; color:var(--js-blue)!important; }
.jstech-console #app .sidebar-container.el-menu--collapse .el-menu-item { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:6px!important; line-height:normal; }
.jstech-console #app .sidebar-container.el-menu--collapse .el-menu-item > span { display:block!important; visibility:visible!important; width:auto!important; height:auto!important; font-size:11px; line-height:16px; margin-top:4px; }
.jstech-console .d-content-container { background:transparent!important; }
.jstech-console .d-content-table { border-color:var(--js-border)!important; border-radius:10px; background:#fff!important; }
.jstech-console .d-content-cox { border-radius:10px 10px 0 0; background:#eaf2f7; }
.jstech-console .sub-navbarnavbar { background:#183b57; }

/* Login surfaces. Existing form fields, validation, language and consent remain. */
.jstech-dashboard .login-container { background:radial-gradient(ellipse at 20% 10%,#204f6d 0,transparent 50%),linear-gradient(135deg,#071725,#153852)!important; overflow:auto; }
.jstech-dashboard .login-container .login-form { width:min(480px,calc(100% - 40px))!important; padding:38px!important; margin:9vh auto 90px!important; background:#102b43; border:1px solid #3a566b; border-radius:18px; box-shadow:0 28px 70px #0004; }
.jstech-dashboard .login-container .title-logo .left-menu-logo { width:300px!important; max-width:100%; height:90px!important; background:url(brand-logo.svg) center/contain no-repeat; }
.jstech-dashboard .login-container .title-logo .left-menu-logo use { opacity:0; }
.jstech-dashboard .login-container .title-container .title { font-size:22px; color:#d8effa; }
.jstech-dashboard .login-container .el-form-item { background:#ffffff0a!important; border:1px solid #496176; border-radius:8px; }
.jstech-dashboard .login-container .el-input input { color:#fff; }
.jstech-dashboard .login-container .el-form-item:has(input[name="verCode"]) { width:calc(100% - 125px)!important; }
.jstech-dashboard .login-container .el-form-item:has(input[name="verCode"]) .el-input { width:calc(100% - 36px)!important; }
.jstech-dashboard .login-container .el-form-item:has(input[name="verCode"]) .el-col { width:115px!important; right:-125px!important; }
.jstech-dashboard .login-container .el-form-item:has(input[name="verCode"]) img { max-width:100%; }
.jstech-dashboard .login-container .copyright { color:#b3c9d8; }
.jstech-console .m-container[data-v-a9f69106] { margin:0; }
.jstech-console .m-container .grid-content { background:radial-gradient(ellipse at 25% 15%,#22516f,transparent 55%),linear-gradient(145deg,#071725,#163b56)!important; }
.jstech-console .m-container .grid-content .ince-container { position:relative; width:78%; max-width:520px; height:460px; background:url(brand-logo.svg) top left/300px 106px no-repeat!important; }
.jstech-console .m-container .grid-content .ince-container:before { content:"배움의 공간을\A비추는 빛과 소리"; white-space:pre-line; position:absolute; top:150px; left:0; font-size:clamp(28px,3.2vw,48px); line-height:1.5; font-weight:700; letter-spacing:-1.4px; color:white; }
.jstech-console .m-container .grid-content .ince-container:after { content:"제이에스테크솔루션\A영상 · 음향 · 통합제어"; white-space:pre-line; position:absolute; top:330px; left:0; padding-top:24px; border-top:1px solid #7fb6d5; width:100%; font-size:17px; line-height:1.9; letter-spacing:1px; color:var(--js-ice); }
.jstech-console .m-container .grid-logo { background:#f1f6fa!important; }
.jstech-console .m-container .grid-logo .logo-content-from { width:min(440px,calc(50vw - 48px))!important; height:auto!important; min-height:550px; padding:24px 32px; margin:0!important; border:1px solid #dce7ef!important; border-radius:18px!important; box-shadow:0 18px 55px #12345112!important; }
.jstech-console .m-container .grid-logo .form-login-tiele { width:100%!important; height:96px!important; margin:0 auto 30px!important; border-radius:10px; background:var(--js-navy) url(brand-logo.svg) center/260px 90px no-repeat!important; }
.jstech-console .m-container .grid-logo .form-login-inline { margin:0!important; }
.jstech-console .m-container .grid-logo .form-login-item { margin-top:22px!important; }
.jstech-console .m-container .grid-logo .form-login-item-title { color:#304e65!important; font-size:14px!important; }
.jstech-console .m-container .grid-logo .form-login-item-input { margin-top:9px!important; }
.jstech-console .m-container .grid-logo .form-login-item-input .el-input__inner { height:46px; line-height:46px; font-size:15px; background:#fafcfd; }
.jstech-console .m-container .grid-logo .form-login-button-login { width:100%!important; height:46px!important; border-radius:8px!important; margin-top:6px; font-size:16px; }
.jstech-console .m-container .grid-logo .privacy { margin:22px 0 16px!important; }
.jstech-console .m-container .grid-logo .language { margin:10px auto 0!important; }
.jstech-console .m-container .grid-logo .circle, .jstech-console .m-container .grid-logo .circle1 { background:none!important; box-shadow:none!important; }
@media (max-width:767px) {
 .jstech-console .m-container .grid-content { height:300px!important; min-height:300px!important; }
 .jstech-console .m-container .grid-content .ince-container { height:260px; background-size:230px 80px!important; }
 .jstech-console .m-container .grid-content .ince-container:before { top:100px; font-size:27px; }
 .jstech-console .m-container .grid-content .ince-container:after { top:200px; font-size:13px; padding-top:14px; content:"제이에스테크솔루션 · 통합제어"; }
 .jstech-console .m-container .grid-logo { height:auto!important; min-height:620px; padding:28px 16px; }
 .jstech-console .m-container .grid-logo .logo-content-from { width:min(440px,calc(100vw - 32px))!important; }
}