/* Shared visual language. Legacy selectors are scoped to the admin page. */
.access-page #server-connection-update-btn{align-self:center}
.admin-page #modalDialog .remoter-secondary{overflow-wrap:anywhere}
.admin-page #modalDialog .modal-body>div:has(.remoters-list){padding-bottom:100px}
.admin-page #modalFooter button:disabled{background:#e8edf4;color:#748296;cursor:not-allowed;border-color:var(--line)}
.admin-page #modalDialog.admin-main-modal:has(.form-section){max-width:1000px!important}
.admin-page #modalDialog.admin-main-modal:has(.router-layout){max-width:1200px!important}
.admin-page #modalDialog .modal-body input:not([type=checkbox]),.admin-page #modalDialog .modal-body select,.admin-page #modalDialog .modal-body textarea{font:14px/1.5 'Segoe UI',Arial,sans-serif;margin:0;padding:9px 12px;border:1px solid #c8d2df;border-radius:7px;min-height:42px}
.admin-page #modalDialog .modal-body ul.form-grid{padding:0;margin:0}
.admin-page #modalDialog .modal-body .form-grid label{margin:0 0 6px}
.admin-page #modalDialog .modal-body .form-section{padding:18px;margin:0 0 16px}
.admin-page #modalDialog .modal-body .form-section h2{margin:0 0 16px}
.admin-page #modalDialog .modal-body .router-preview textarea{font:12px/1.65 Consolas,monospace;margin-top:12px}
.access-page .server-status{display:grid;grid-template-columns:1fr auto;gap:8px 16px;padding:18px 24px}
.access-page .server-status .fieldset-title{display:none}
.access-page .server-status .row{margin:0;flex-wrap:wrap}
.access-page .server-status .row:has(#autorization-message){grid-column:1/-1}
.access-page .server-status #server-connection-update-btn{grid-column:2;grid-row:1;background:white;color:var(--blue);border-color:var(--line)}
.login-page{padding:64px 20px}.login-page #login{max-width:420px;margin:auto;padding:28px;background:white;border:1px solid var(--line);border-radius:12px}.login-page fieldset{padding:0;border:0}.login-page p{margin:10px 0}.login-page button{width:100%;margin-top:14px}.login-page h2{margin-bottom:24px}
:root{--ink:#203047;--muted:#607086;--line:#dce3ed;--blue:#2563eb;--surface:#f3f6fa;--radius:12px}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--surface);font:15px/1.5 'Segoe UI',Arial,sans-serif}
button,input,select,textarea{font:inherit}a{color:var(--blue)}h1{font-size:26px;line-height:1.25;margin:6px 0 0;letter-spacing:-.5px}h2{font-size:18px;margin:0 0 18px}p{line-height:1.5}
input:not([type=checkbox]),select,textarea{width:100%;min-width:0;border:1px solid #c8d2df;border-radius:7px;padding:10px 12px;background:#fff;color:var(--ink);min-height:42px}
textarea{resize:vertical}input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue)}input:focus,select:focus,textarea:focus{outline:2px solid #93b4fc;outline-offset:1px;border-color:var(--blue)}
button,.client-download-button,.admin-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid transparent;border-radius:7px;padding:10px 16px;min-height:42px;background:var(--blue);color:white;font-weight:600;text-decoration:none;cursor:pointer;line-height:1.3}
button:hover,.client-download-button:hover{filter:brightness(.95)}button:disabled{background:#e8edf4;color:#748296;cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #93b4fc;outline-offset:3px}
[hidden]{display:none!important}.section-help{color:var(--muted);font-size:13px;margin:6px 0 18px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1px;color:var(--blue)}
.access-page{padding:48px 24px}.access-page .container{max-width:800px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:16px;padding:32px;box-shadow:0 8px 32px #26395808}
.client-download{display:grid;grid-template-columns:1fr;gap:20px;padding:24px;background:#eef4ff;border:1px solid #ccdafa;border-radius:var(--radius);margin-bottom:24px}.client-download-title{margin:0 0 8px;font-size:18px;font-weight:650}.client-download-text{color:var(--muted);font-size:14px;margin:0;max-width:590px}.client-download-button{justify-self:start}
.fieldset{border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:20px}.fieldset:last-of-type{margin-bottom:0}.fieldset-title{font-size:18px;font-weight:650;margin-bottom:16px}.row{margin:12px 0;display:flex;gap:12px;align-items:center}.input-group{display:grid;grid-template-columns:140px minmax(120px,1fr) 170px;gap:14px;align-items:start;width:100%}.input-group>label{padding-top:10px;font-size:14px}.input-wrapper{position:relative}.input-container{min-width:0}.input-group>button{width:100%}
.toggle-password-btn{position:absolute;right:4px;top:4px;width:34px;min-height:34px;padding:6px;background:transparent;color:var(--muted)}.error-feedback{display:none;color:#b42332;font-size:13px;margin-top:6px}.error{border-color:#b42332!important}.alert{display:none;padding:12px 16px;border-radius:8px;margin:16px 0;overflow-wrap:anywhere}.alert-success,.text-success{background:#e6f5ed;color:#167245}.alert-danger,.text-danger{background:#fff0ef;color:#b42332}.status-text{display:none;border-radius:5px;padding:4px 9px;font-size:13px;font-weight:600}.admin-btn{background:white;color:var(--blue);border-color:var(--line)}
.access-page .modal{display:none;position:fixed;inset:0;background:#16243b66;z-index:100}.access-page .modal-content{position:relative;width:340px;max-width:calc(100% - 32px);margin:20vh auto;padding:28px;background:white;border-radius:var(--radius);text-align:center}.access-page .close{position:absolute;right:14px;top:4px;font-size:28px;cursor:pointer}
.app-header{max-width:1440px;margin:auto;min-height:86px;padding:20px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}.app-brand{text-decoration:none;color:var(--ink);font-size:23px;font-weight:700}.app-brand span{font-size:13px;color:var(--muted);font-weight:400;margin-left:18px}.app-header nav{display:flex;align-items:center;gap:22px}.app-header nav a{text-decoration:none;font-size:14px}.app-header nav button{background:transparent;color:var(--muted);border:1px solid var(--line)}
.admin-page .modal-wrap:before,.admin-page .modal-overlay{display:none!important}.admin-page .modal-open:checked~.modal-wrap #modalDialog{position:relative;left:auto;top:auto;transform:none;margin:0 auto 24px;width:calc(100% - 48px)!important;max-width:1384px;height:calc(100dvh - 112px);max-height:none;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 20px #20304706;display:flex;flex-direction:column}
.admin-page #modalDialog:has(.form-section){max-width:1000px}.admin-page #modalDialog:has(.router-layout){max-width:1200px}.admin-page #modalDialog .modal-header{position:relative;background:#fff;padding:20px 24px 14px;border-bottom:1px solid var(--line);flex:none}.admin-page .modal-header-text{padding:0;font-size:13px;color:var(--muted)}.admin-page .modal-header h3{font-size:22px;margin:10px 0 0;line-height:1.3}.admin-page .modal-header hr{display:none}.admin-page .modal .btn-lastModal{font-size:14px;right:24px;top:16px;border:1px solid var(--line);border-radius:6px;padding:6px 12px;color:var(--blue)}.admin-page .modal .btn-close{display:none}
.admin-page #modalDialog .modal-body{padding:24px;background:#f8fafc;min-height:0;max-height:none;overflow:auto;flex:1}.admin-page .tabMenu{display:flex;gap:8px;margin:14px 0 0!important;justify-content:flex-start}.admin-page .tabLinksMenu{width:auto;min-width:120px;font-size:14px;min-height:40px;padding:8px 18px;background:white;color:var(--muted);border:1px solid var(--line)}.admin-page .tabLinksMenu.active{background:#eaf1ff;color:#1d4ed8;border-color:#c1d3fc}
.admin-page .modal-footer{padding:16px 24px;background:white;border-top:1px solid var(--line);flex:none;display:flex;gap:12px;justify-content:flex-end}.admin-page .modal-footer:empty{display:none}.admin-page .modal-footer ul{display:flex;gap:12px;align-items:center;justify-content:flex-end;width:100%!important;margin:0!important;padding:0;list-style:none}.admin-page .modal-footer li{float:none!important;padding:0!important}.admin-page .modal-footer li.delete-action{order:-1;margin-right:auto}
.admin-page .btn-color{font:600 14px/1.4 'Segoe UI',Arial,sans-serif;min-height:40px;width:auto;min-width:0;border-radius:7px;padding:10px 18px;border:1px solid transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.admin-page .btn-green,.admin-page .btn-blue{background:var(--blue);color:white}.admin-page .btn-red{background:#fff;border-color:var(--line);color:var(--muted)}.admin-page .btn-DarkOrange{background:#fff;color:#b42332;border-color:#f1c6ca}
.remoters-toolbar-title{font-size:21px;font-weight:650}.remoters-toolbar{margin-bottom:16px}.remoters-add-button{font:600 14px 'Segoe UI',sans-serif;background:var(--blue);color:#fff;border:none;padding:11px 16px;border-radius:7px}.employee-search{display:block;max-width:380px;font-size:13px;color:var(--muted);margin-bottom:20px}.employee-search input{margin-top:5px}
.admin-page .remoters-list{border:1px solid var(--line);border-radius:9px;overflow:visible;background:white}.admin-page .remoters-list-header,.admin-page .remoters-list-row{grid-template-columns:minmax(170px,1.35fr) 140px minmax(180px,1.25fr) minmax(150px,1fr) 155px;gap:18px;align-items:center;padding:16px 20px}.admin-page .remoters-list-header{font-size:12px;text-transform:none;letter-spacing:0;background:#eef2f7;border-radius:9px 9px 0 0;color:#506178}.admin-page .remoters-list-row{min-height:90px}.admin-page .remoter-note,.admin-page .remoters-list-header>div:nth-child(3){display:none}.admin-page .remoter-rdp{font-size:13px}.admin-page .remoters-list-row .remoter-name{font-size:15px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}.admin-page .remoter-secondary{font-size:12px;white-space:normal;line-height:1.45;overflow:visible;color:var(--muted)}.admin-page .remoter-access{font-size:14px}.admin-page .remoter-field-value.empty{color:#a45124}
.admin-page .remoter-row-actions{display:flex;gap:8px;align-items:start}.admin-page .remoter-action,.row-menu summary{font:500 13px/1.4 'Segoe UI',Arial,sans-serif;border:1px solid var(--line);border-radius:6px;background:white;color:var(--ink);padding:8px 10px;min-height:36px;cursor:pointer}.row-menu{position:relative}.row-menu-items{position:absolute;right:0;top:42px;z-index:10;min-width:165px;padding:6px;background:white;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px #20304720}.row-menu-items .remoter-action{display:block;width:100%;text-align:left;border:0;margin:2px 0}.row-menu-items .remoter-action:hover{background:#eef4ff}.remoters-list-row:last-child .row-menu-items{top:auto;bottom:42px}
.form-section{background:white;border:1px solid var(--line);border-radius:10px;padding:22px;margin-bottom:18px}.form-section h2,.form-section summary{font-size:17px;font-weight:650;margin:0 0 16px}.form-section summary{cursor:pointer;margin:0}.form-section[open] summary{margin-bottom:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0;padding:0;list-style:none}.form-grid>li{padding:0!important;min-width:0}.full-width{grid-column:1/-1}.form-grid label{font-size:14px;font-weight:600!important;display:inline-block;margin-bottom:6px}.form-grid span,.form-grid p{font-size:13px;color:var(--muted)!important}.form-grid textarea{font:14px/1.5 'Segoe UI',sans-serif!important}.form-grid input,.form-grid select{margin:0}.form-grid li>span{display:block;margin:0 0 8px}.form-grid li>br{display:none}.form-grid p{margin-top:8px!important}.form-grid li:has(#input_allMikrotik){display:flex;align-items:center;gap:12px}.form-grid #input_allMikrotik{order:-1}.form-grid li:has(#input_clientMode) select{max-width:380px;display:block}
.channel-selectors{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;padding:20px;background:white;border:1px solid var(--line);border-radius:10px;margin-bottom:20px}.channel-selectors label{font-size:14px;font-weight:600}.channel-selectors select{display:block;margin-top:6px}.channel-selectors p{grid-column:1/-1;font-size:13px;color:var(--muted)}.router-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px}.router-fields{list-style:none;margin:0;padding:20px;background:white;border:1px solid var(--line);border-radius:10px}.router-fields li{padding:0!important;margin-bottom:16px}.router-fields li:last-child{margin:0}.router-fields label{display:block;font-size:14px;font-weight:600!important;margin-bottom:6px}.router-fields span{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}.router-fields br{display:none}.router-preview{padding:20px;background:white;border:1px solid var(--line);border-radius:10px}.router-preview label{font-size:15px}.router-preview textarea{font:12px/1.65 Consolas,monospace!important;margin-top:12px;min-height:300px;height:calc(100% - 110px);background:#f5f7fb}.router-preview .section-help{margin-top:12px!important}
.settings-page{max-width:1150px;margin:32px auto;padding:0 24px}.settings-page fieldset,.settings-page #office{background:white;border:1px solid var(--line);border-radius:10px;padding:22px;margin:20px 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.settings-page legend{font-size:18px;font-weight:650}.settings-page label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600;min-width:0}.settings-page small,.settings-page fieldset>p,.settings-page fieldset>textarea{grid-column:1/-1;color:var(--muted)}.settings-page fieldset>button{justify-self:start;background:white;border:1px solid #f1c6ca;color:#b42332}.settings-page #message{white-space:pre-wrap}.settings-page #add{background:white;color:var(--blue);border-color:var(--line);margin-right:12px}.tableCard{font-size:14px}.tableCard th,.tableCard td{padding:12px!important}
@media(max-width:1100px){.admin-page .remoters-list-header,.admin-page .remoters-list-row{grid-template-columns:minmax(140px,1fr) 130px minmax(155px,1fr) 145px;gap:14px}.admin-page .remoter-rdp,.admin-page .remoters-list-header>div:nth-child(5){display:none}.router-layout{grid-template-columns:1fr}.router-preview textarea{height:280px}.settings-page fieldset,.settings-page #office{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.access-page{padding:16px}.access-page .container{padding:20px}h1{font-size:23px}.fieldset,.client-download{padding:18px}.input-group{grid-template-columns:1fr;gap:8px}.input-group>label{padding:0}.input-group>button{margin-bottom:8px}.access-page .container>div:first-child{flex-wrap:wrap;gap:16px}.app-header{padding:16px;align-items:start;flex-direction:column;gap:12px}.app-header nav{gap:14px;flex-wrap:wrap}.app-brand span{display:block;margin:0}.admin-page .modal-open:checked~.modal-wrap #modalDialog{width:calc(100% - 24px)!important;height:calc(100dvh - 160px);margin-bottom:12px}.admin-page #modalDialog .modal-body{padding:12px}.admin-page #modalDialog .modal-header{padding:16px}.admin-page .modal-header h3{font-size:20px}.admin-page .modal-header-text{max-width:65%}.admin-page .remoters-list-header{display:none}.admin-page .remoters-list-row{grid-template-columns:1fr 1fr;padding:16px;gap:12px}.admin-page .remoter-row-actions{grid-column:auto;flex-wrap:wrap}.remoters-toolbar{align-items:start;flex-direction:column}.form-grid,.channel-selectors{grid-template-columns:1fr}.form-section{padding:16px}.admin-page .modal-footer{padding:12px}.admin-page .modal-footer ul{flex-wrap:wrap;gap:8px}.admin-page .btn-color{padding:9px 12px}.settings-page fieldset,.settings-page #office{grid-template-columns:1fr}.settings-page{padding:0 16px}.client-download-button{width:100%}}
