/* extras do painel (por cima do theme.css copiado do visual de referencia) */
#toastsBox{position:fixed;right:16px;bottom:16px;z-index:11000;display:flex;flex-direction:column;gap:8px;max-width:420px}
.olt-toast{padding:10px 14px;border-radius:4px;color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.25);font-size:14px;animation:oltin .2s}
.olt-toast.ok{background:#3c9a3c}.olt-toast.err{background:#c9302c}.olt-toast.info{background:#264f7b}
@keyframes oltin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.text-yellow{color:#e0a800}.text-grey{color:#999}
.font-size-20{font-size:20px}
.pill-btn{display:inline-block;padding:2px 10px;border-radius:12px;border:1px solid #cfd6da;margin-right:4px;cursor:pointer;user-select:none;font-size:13px}
.pill-btn.on{background:#264f7b;border-color:#264f7b;color:#fff}
.mode-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.mode-card{border:2px solid #d5dbe0;border-radius:6px;padding:12px 14px;cursor:pointer;transition:.15s;background:transparent}
.mode-card:hover{border-color:#7f9bbd}.mode-card.sel{border-color:#264f7b;box-shadow:0 0 0 3px rgba(38,79,123,.18)}
.mode-card h4{margin:0 0 4px;font-size:16px}.mode-card small{display:block;opacity:.75;line-height:1.35}
html.smartolt-night .mode-card{border-color:rgba(255,255,255,.14)}
html.smartolt-night .mode-card.sel{border-color:#5aa0ee;box-shadow:0 0 0 3px rgba(90,160,238,.2)}
html.smartolt-night .pill-btn{border-color:rgba(255,255,255,.2)}
.cmd-preview{font-family:Consolas,Menlo,monospace;font-size:12px;white-space:pre-wrap;word-break:break-all;max-height:260px;overflow:auto;border:1px solid #dde2e6;border-radius:4px;padding:8px 10px;background:rgba(0,0,0,.03)}
html.smartolt-night .cmd-preview{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.step-ok{color:#3c9a3c}.step-err{color:#c9302c}
.step-row td{vertical-align:top;font-family:Consolas,Menlo,monospace;font-size:12px;word-break:break-all}
.cli-out{font-family:Consolas,Menlo,monospace;font-size:12px;white-space:pre;overflow:auto;max-height:480px;background:#0b1220;color:#d6e2f0;padding:10px;border-radius:4px}
.hidden-mode{display:none}
.kv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;margin-bottom:14px}
.kv-grid .kv{border:1px solid #e2e6ea;border-radius:4px;padding:8px 10px}
.kv-grid .kv b{display:block;font-size:12px;opacity:.7;font-weight:normal}
.kv-grid .kv span{font-size:17px;font-weight:bold}
html.smartolt-night .kv-grid .kv{border-color:rgba(255,255,255,.1);background:#0f1a2e}
.onu-row-offline td{opacity:.78}
@media (max-width:700px){.mode-cards{grid-template-columns:1fr}}

/* ---- ajustes de organizacao (corrigem o que o tema salvo nao traz) ---- */
.dropdown-menu{display:none}
.open>.dropdown-menu{display:block}
.content-wrap{padding-top:22px}
.navbar-nav>li>.dropdown-menu a{display:block;padding:6px 18px;white-space:nowrap}
/* painel de status/sinal da ONU: altura automatica (no original o JS expandia) */
#onu_status_wrapper,#signal_wrapper{max-width:470px;width:100%}
#onu_status_wrapper{height:auto;min-height:36px;flex-wrap:wrap}
#signal_wrapper{height:auto;display:block;padding:8px;margin-bottom:16px}
.onu-wrapper dl.dl-horizontal dd{margin-bottom:10px;min-height:22px}
.onu-wrapper{padding-top:4px}
.onu-wrapper>.col-sm-6{margin-bottom:6px}
/* botoes/labels que o tema nao define */
.btn-danger{background:#c9302c;border-color:#b52b27;color:#fff!important}
.btn-danger:hover{background:#a52522}
.label-warning{background:#c77c0e}.label-default{background:#6b7780}.label-success{background:#3c9a3c}
.label{display:inline-block;padding:.25em .6em;font-size:75%;font-weight:700;color:#fff;line-height:1;text-align:center;border-radius:.25em}
.alert{padding:10px 14px;border-radius:4px;margin-bottom:12px;border:1px solid transparent}
.alert-success{background:rgba(60,154,60,.15);border-color:#3c9a3c}
.alert-danger{background:rgba(201,48,44,.15);border-color:#c9302c}
.alert-warning{background:rgba(199,124,14,.15);border-color:#c77c0e}
.table td.nowrap,.nowrap{white-space:nowrap}
.badge{background:#c9302c;color:#fff;border-radius:10px;padding:2px 7px;font-size:12px}
.form-control{max-width:100%}
.modal-content{color:inherit}
html.smartolt-night .modal-content{background:#0f1a2e;border-color:rgba(255,255,255,.15)}
.mode-cards+dl.dl-horizontal dd{min-height:34px}

.add-vlan-grp{display:flex;gap:6px;align-items:center}.add-vlan-grp input{width:90px}
.table>tbody>tr>td{vertical-align:middle}

.content-wrap .row{margin-left:0;margin-right:0}
.content-wrap .row>.table{margin-bottom:18px}

/* seletor de OLT na navbar */
.navbar-olt{padding:8px 10px}.navbar-olt select{height:34px;min-width:150px;max-width:220px}
.nowrap{white-space:nowrap}.btn-sm{padding:3px 10px!important;font-size:13px}
.checkbox-inline{margin-left:10px}

.navbar-olt select{padding:2px 10px;line-height:28px;height:34px;font-size:14px}

/* ---- modais do Bootstrap (o tema salvo nao traz a base: sem isto o modal "escondido" cobre a tela e bloqueia todos os cliques) ---- */
.modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:1050;overflow:hidden;outline:0;-webkit-overflow-scrolling:touch}
.modal-open{overflow:hidden}
.modal-open .modal{overflow-x:hidden;overflow-y:auto}
.modal.fade{opacity:0;transition:opacity .15s linear}
.modal.in{opacity:1}
.modal-dialog{position:relative;width:auto;margin:10px}
@media (min-width:768px){.modal-dialog{width:600px;margin:40px auto}}
.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1040;background:#000}
.modal-backdrop.fade{opacity:0}.modal-backdrop.in{opacity:.55}
.modal-content{position:relative;background-clip:padding-box;border:1px solid rgba(0,0,0,.2);border-radius:6px;box-shadow:0 5px 25px rgba(0,0,0,.5);outline:0;background:#fff;color:#222}
html.smartolt-night .modal-content{background:#0f1a2e;color:#e6edf5;border-color:rgba(255,255,255,.15)}
.modal-header{padding:14px 18px;border-bottom:1px solid rgba(128,128,128,.25)}
.modal-title{margin:0;font-size:18px}
.modal-body{position:relative;padding:18px}
.modal-footer{padding:14px 18px;text-align:right;border-top:1px solid rgba(128,128,128,.25)}
.modal-footer .btn+.btn{margin-left:6px}
.modal .close{float:right;font-size:24px;font-weight:700;line-height:1;color:inherit;opacity:.55;background:transparent;border:0;cursor:pointer}
.modal .close:hover{opacity:1}
.modal label{display:block;margin-bottom:4px;font-weight:600}
.modal .form-group{margin-bottom:12px}