:root{--bg:#081219;--panel:#0f1b22;--panel2:#172830;--line:#29404b;--text:#edf4f6;--muted:#8ca0aa;--green:#17d6a0;--red:#ff6675}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(145deg,#071017,#0d2028);color:var(--text);font-family:Inter,Arial,sans-serif}
button,input,select,textarea{font:inherit}.btn{background:var(--panel2);border:1px solid var(--line);color:var(--text);padding:9px 12px;border-radius:9px;cursor:pointer}.primary{background:var(--green);color:#002d21;border:none;font-weight:800}
input,select,textarea{width:100%;padding:10px;border-radius:9px;border:1px solid var(--line);background:#0a151b;color:var(--text);margin:5px 0 10px}
.login{max-width:420px;margin:10vh auto;background:var(--panel);padding:28px;border-radius:18px;border:1px solid var(--line)}.top{height:60px;background:#0e1d24;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px}.top-right{display:flex;gap:10px;align-items:center}.shell{height:100vh;display:flex;flex-direction:column}.workspace{display:grid;grid-template-columns:340px 1fr 310px;flex:1;min-height:0}.sidebar{background:#0c181f;border-right:1px solid var(--line);overflow:auto}.sidehead{padding:12px;background:#10212a;position:sticky;top:0}.row{padding:12px;border-bottom:1px solid #1e333d;cursor:pointer}.row:hover{background:#12242c}.chat{display:flex;flex-direction:column}.messages{flex:1;overflow:auto;padding:20px}.bubble{max-width:70%;background:#172830;padding:9px 11px;border-radius:10px;margin:6px 0}.out{margin-left:auto;background:#075e54}.send{display:flex;gap:8px;padding:10px;background:#10212a}.send textarea{margin:0}.info{background:#0c181f;border-left:1px solid var(--line);padding:14px;overflow:auto}.card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px;margin:12px 0}.kv{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #20353f}.muted{color:var(--muted)}.admin{max-width:1250px;margin:auto;padding:18px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.stat{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}.stat span{display:block;color:var(--muted);font-size:12px}.stat b{font-size:26px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.note{background:#132730;padding:8px;border-radius:8px;margin:6px 0}.badge{font-size:10px;border:1px solid var(--line);border-radius:999px;padding:2px 6px}.empty{margin:auto;color:var(--muted);text-align:center}pre{white-space:pre-wrap;background:#071015;padding:10px;border-radius:8px}
@media(max-width:1000px){.workspace{grid-template-columns:300px 1fr}.info{display:none}.stats{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}}

/* ===== Personalizacao por usuario ===== */
:root{
  --ui-accent:#17d6a0;
  --ui-bg:#081219;
  --ui-panel:#0f1b22;
  --ui-panel2:#172830;
  --ui-line:#29404b;
  --ui-text:#edf4f6;
  --ui-muted:#8ca0aa;
  --ui-radius:13px;
  --ui-scale:1;
  --ui-gap:12px;
}
html{font-size:calc(16px * var(--ui-scale))}
body{background:var(--ui-bg);color:var(--ui-text)}
.top,.card,.stat,.sidebar,.info,.login,.bubble,.btn,input,select,textarea{border-radius:var(--ui-radius)}
.card,.stat,.login{background:var(--ui-panel)}
.btn{background:var(--ui-panel2);border-color:var(--ui-line)}
.btn.primary{background:var(--ui-accent)}
input,select,textarea{background:color-mix(in srgb,var(--ui-bg) 88%,white 12%);border-color:var(--ui-line)}
.logo-wrap{display:flex;align-items:center;gap:10px}.app-logo{height:36px;max-width:180px;object-fit:contain}
.theme-button{white-space:nowrap}
.theme-panel{
  position:fixed;top:68px;right:16px;z-index:1000;width:320px;max-width:calc(100vw - 32px);
  background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:var(--ui-radius);
  padding:14px;box-shadow:0 18px 60px #0009;display:none
}
.theme-panel.open{display:block}
.theme-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.theme-row{margin:10px 0}.theme-row label{display:block;font-size:12px;color:var(--ui-muted);margin-bottom:4px}
.color-row{display:grid;grid-template-columns:1fr 44px;gap:8px;align-items:center}
.color-row input[type=color]{padding:2px;height:38px;margin:0}
.compact .row{padding:8px}.compact .card{padding:10px}.compact .top{height:54px}
.spacious .row{padding:16px}.spacious .card{padding:18px}.spacious .top{height:70px}


/* ===== AUTOPEÇAS IDENTIDADE VISUAL ===== */
.brand-admin-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:16px}
.brand-preview{min-height:180px;display:flex;align-items:center;justify-content:center;background:var(--ui-bg,#081219);border:1px dashed var(--ui-line,#29404b);border-radius:var(--ui-radius,13px);padding:18px}
.brand-preview img{max-width:100%;max-height:110px;object-fit:contain}
.brand-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.brand-fields .full{grid-column:1/-1}
@media(max-width:850px){.brand-admin-grid,.brand-fields{grid-template-columns:1fr}.brand-fields .full{grid-column:auto}}

/* ===== AUTOPEÇAS TEMA GLOBAL COMPLETO ===== */

:root{
  --ui-accent:#17d6a0;
  --ui-bg:#081219;
  --ui-bg-2:#0b171e;
  --ui-panel:#0f1b22;
  --ui-panel-2:#172830;
  --ui-top:#0e1d24;
  --ui-sidebar:#0c181f;
  --ui-line:#29404b;
  --ui-text:#edf4f6;
  --ui-muted:#8ca0aa;
  --ui-radius:13px;
}

html,
body{
  background:var(--ui-bg) !important;
  color:var(--ui-text) !important;
}

body{
  background:
    linear-gradient(
      145deg,
      var(--ui-bg),
      var(--ui-bg-2)
    ) !important;
}

/* LOGIN */
.login{
  background:var(--ui-panel) !important;
  border-color:var(--ui-line) !important;
  color:var(--ui-text) !important;
}

/* TOPO */
.top{
  background:var(--ui-top) !important;
  border-color:var(--ui-line) !important;
  color:var(--ui-text) !important;
}

/* CARDS */
.card,
.stat{
  background:var(--ui-panel) !important;
  border-color:var(--ui-line) !important;
  color:var(--ui-text) !important;
}

/* SIDEBAR */
.sidebar,
.info{
  background:var(--ui-sidebar) !important;
  border-color:var(--ui-line) !important;
}

.sidehead,
.chathead,
.send{
  background:var(--ui-panel-2) !important;
  border-color:var(--ui-line) !important;
}

/* CHAT */
.chat,
.messages,
.workspace,
.shell,
.admin{
  background:var(--ui-bg) !important;
}

.bubble{
  background:var(--ui-panel-2) !important;
  color:var(--ui-text) !important;
}

.bubble.out{
  background:var(--ui-accent) !important;
  color:#001b16 !important;
}

/* LINHAS */
.row{
  border-color:var(--ui-line) !important;
}

.row:hover{
  background:var(--ui-panel-2) !important;
}

/* CAMPOS */
input,
select,
textarea{
  background:var(--ui-bg-2) !important;
  color:var(--ui-text) !important;
  border-color:var(--ui-line) !important;
}

/* BOTÕES */
.btn{
  background:var(--ui-panel-2) !important;
  border-color:var(--ui-line) !important;
  color:var(--ui-text) !important;
}

.btn.primary{
  background:var(--ui-accent) !important;
  color:#001b16 !important;
}

/* BADGES */
.badge{
  border-color:var(--ui-line) !important;
  color:var(--ui-text) !important;
}

/* TEXTO SECUNDÁRIO */
.muted,
.sub,
.small{
  color:var(--ui-muted) !important;
}

/* NOTAS */
.note{
  background:var(--ui-panel-2) !important;
  border-color:var(--ui-accent) !important;
}

/* PRE */
pre{
  background:var(--ui-bg-2) !important;
  color:var(--ui-text) !important;
}

/* PERSONALIZADOR */
.theme-panel{
  background:var(--ui-panel) !important;
  border-color:var(--ui-line) !important;
}

.brand-preview{
  background:var(--ui-bg) !important;
  border-color:var(--ui-line) !important;
}

/* BORDAS GLOBAIS */
.login,
.card,
.stat,
.btn,
input,
select,
textarea,
.bubble,
.note,
.theme-panel,
.brand-preview{
  border-radius:var(--ui-radius) !important;
}


/* ===== PATCH CARD PRETO RESTANTE ===== */

/* containers/painéis internos */
.panel,
.box,
.content,
.content-card,
.dashboard-card,
.admin-card,
.user-card,
.settings-card,
.inbox-card,
.conversation-card,
.queue-card,
.detail-card,
.details,
.modal,
.modal-content,
.dropdown,
.menu,
.table-wrap,
section {
    background: var(--ui-panel) !important;
    border-color: var(--ui-line) !important;
    color: var(--ui-text) !important;
}

/* partes internas dos cards */
.card > div,
.panel > div,
.info > div {
    border-color: var(--ui-line) !important;
}

/* tabelas */
table,
thead,
tbody,
tr,
td,
th {
    border-color: var(--ui-line) !important;
}

thead,
th {
    background: var(--ui-panel-2) !important;
}

tbody,
td {
    background: transparent !important;
}

tr:hover td {
    background: var(--ui-panel-2) !important;
}

/* blocos de código/status */
pre,
code {
    background: var(--ui-bg-2) !important;
    color: var(--ui-text) !important;
}

/* remove preto fixo de alguns overlays */
.modal-content,
.dropdown,
.menu {
    box-shadow: 0 12px 40px rgba(0,0,0,.25);
}

/* acompanha arredondamento escolhido */
.panel,
.box,
.content-card,
.dashboard-card,
.admin-card,
.user-card,
.settings-card,
.inbox-card,
.conversation-card,
.queue-card,
.detail-card,
.modal-content,
.dropdown,
.menu,
.table-wrap {
    border-radius: var(--ui-radius) !important;
}


/* ===== AUTOPEÇAS LOGO GLOBAL DISCRETA ===== */
.global-brand-logo{
  position:fixed;
  top:12px;
  left:14px;
  z-index:900;
  display:flex;
  align-items:center;
  gap:9px;
  max-width:230px;
  padding:5px 8px;
  border-radius:10px;
  background:color-mix(in srgb,var(--ui-panel,#0f1b22) 70%,transparent);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  opacity:.88;
  pointer-events:none;
}
.global-brand-logo img{
  display:block;
  width:auto;
  height:30px;
  max-width:145px;
  object-fit:contain;
}
.global-brand-logo .global-brand-name{
  max-width:120px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--ui-text,#edf4f6);
}
body.login-mode .global-brand-logo{
  top:22px;
  left:50%;
  transform:translateX(-50%);
  flex-direction:column;
  max-width:280px;
  padding:8px 12px;
}
body.login-mode .global-brand-logo img{
  height:46px;
  max-width:220px;
}
body.login-mode .global-brand-logo .global-brand-name{
  max-width:240px;
  font-size:13px;
}
@media(max-width:700px){
  .global-brand-logo{
    top:8px;
    left:8px;
    padding:4px 6px;
  }
  .global-brand-logo img{
    height:25px;
    max-width:105px;
  }
  .global-brand-logo .global-brand-name{
    display:none;
  }
}
/* ===== SALVAR IDENTIDADE ===== */
.branding-savebar{
 position:sticky;bottom:0;z-index:20;display:flex;align-items:center;
 gap:12px;margin-top:18px;padding:14px 0 5px;
 background:linear-gradient(to bottom,transparent,var(--ui-panel,#0f1b22) 30%);
}
.branding-save-btn{min-width:200px;min-height:46px;font-weight:800}
.branding-save-btn:disabled{opacity:.65;cursor:wait}
.branding-save-msg{font-size:13px;font-weight:700;color:var(--ui-accent,#17d6a0)}

/* ===== NOME/LOGO CLICÁVEL PARA HOME ===== */

.company-home-link{
  cursor:pointer !important;
  pointer-events:auto !important;
  user-select:none;
  transition:
    opacity .15s ease,
    transform .15s ease;
}

.company-home-link:hover{
  opacity:.78;
}

.company-home-link:active{
  transform:scale(.97);
}

.company-home-link:focus-visible{
  outline:2px solid var(--ui-accent,#17d6a0);
  outline-offset:4px;
}

/* logo + nome continuam discretos */
.global-brand-logo.company-home-link{
  pointer-events:auto !important;
}


/* ===== SIMULADOR WHATSAPP ===== */
.simulator-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.simulator-phone{
  border:1px solid var(--ui-line,#29404b);
  border-radius:var(--ui-radius,18px);
  overflow:hidden;
  background:var(--ui-bg,#081219);
}
.simulator-phone-head{
  padding:12px;
  background:var(--ui-top,#0e1d24);
  border-bottom:1px solid var(--ui-line,#29404b);
}
.simulator-screen{
  min-height:250px;
  padding:18px;
}
.simulator-bubble{
  display:inline-block;
  max-width:85%;
  padding:10px 12px;
  border-radius:12px;
  background:var(--ui-panel-2,#172830);
}
@media(max-width:850px){
  .simulator-grid{grid-template-columns:1fr}
}

/* ===== REMOVE NOME DUPLICADO DO TOPO ===== */
/* A logo flutuante permanece */

.top .brand,
.top .brand-name,
.top .company-name,
.topbar .brand,
.topbar .brand-name,
.topbar .company-name,
header .brand-name,
header .company-name {
    display: none !important;
}

/* Topo sem nome duplicado — identificação fica na logo flutuante */
.top-spacer{
    flex:1;
}

.top{
    justify-content:flex-end !important;
}

.top .top-right{
    margin-left:auto;
}



/* ===== SIMULADOR FLUXO ATUAL ===== */
.simulator-state{
  margin-top:12px;padding:12px;
  border:1px solid var(--ui-line,#29404b);
  border-radius:var(--ui-radius,10px);
  background:var(--ui-panel,#0f1b22)
}
.simulator-state-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.simulator-state-ok{color:var(--ui-accent,#17d6a0)}
.simulator-state-warn{color:#ffbf69}
@media(max-width:700px){.simulator-state-grid{grid-template-columns:1fr}}


/* ===== HORÁRIO / DISPONIBILIDADE ===== */
.service-hours-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.weekdays{display:flex;gap:6px;flex-wrap:wrap}
.weekday{display:flex;align-items:center;gap:4px;border:1px solid var(--ui-line,#29404b);border-radius:999px;padding:5px 8px}
.availability-bar{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
@media(max-width:850px){.service-hours-grid{grid-template-columns:1fr}}

/* ===== CONVERSA NÃO ATRIBUÍDA ===== */
.conversation-not-owned {
  min-height:280px;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
  color:var(--ui-text,#edf4f6);
  background:var(--ui-bg,#081219);
}
.conversation-not-owned > div {
  max-width:440px;
  padding:24px;
  border:1px solid var(--ui-line,#29404b);
  border-radius:var(--ui-radius,13px);
  background:var(--ui-panel,#0f1b22);
}
.conversation-not-owned-title {
  font-size:22px;
  font-weight:800;
  margin-bottom:8px;
}


/* ===== HISTÓRICO FINALIZADO ===== */
.closed-history-badge{
  display:inline-block;
  margin-left:10px;
  padding:4px 8px;
  border:1px solid var(--ui-line,#29404b);
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  opacity:.85;
}

/* ===== HORARIO SABADO FINAL ===== */

.saturday-hours-box{
    margin:14px 0;
    padding:14px;

    border:
        1px solid
        var(--ui-line,#29404b);

    border-radius:
        var(--ui-radius,12px);

    background:
        var(
            --ui-panel-2,
            var(--ui-panel,#0f1b22)
        );
}

.saturday-hours-box h4{
    margin:0 0 10px;
}


/* ===== SABADO SEGURO ===== */
.saturday-hours-box{
  margin:14px 0;
  padding:14px;
  border:1px solid var(--ui-line,#29404b);
  border-radius:var(--ui-radius,12px);
  background:var(--ui-panel-2,var(--ui-panel,#0f1b22));
}
.saturday-hours-box h4{
  margin:0 0 10px;
}


/* ===== AUTOPECAS PBX ADMIN PANEL V2 ===== */
.pbx-v2-launcher{
  position:fixed;
  right:20px;
  bottom:84px;
  z-index:9000;
  border:1px solid var(--ui-line,#29404b);
  border-radius:999px;
  padding:11px 16px;
  background:var(--ui-panel,#0f1b22);
  color:var(--ui-text,#edf4f6);
  font-weight:800;
  cursor:pointer;
  box-shadow:0 8px 30px rgba(0,0,0,.28);
}
.pbx-v2-overlay{
  position:fixed;
  inset:0;
  z-index:10000;
  background:rgba(0,0,0,.72);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.pbx-v2-box{
  width:min(1100px,96vw);
  max-height:90vh;
  overflow:auto;
  background:var(--ui-panel,#0f1b22);
  color:var(--ui-text,#edf4f6);
  border:1px solid var(--ui-line,#29404b);
  border-radius:18px;
  padding:18px;
}
.pbx-v2-head,.pbx-v2-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.pbx-v2-toolbar{margin:16px 0}
.pbx-v2-table-wrap{overflow:auto}
.pbx-v2-table{width:100%;border-collapse:collapse}
.pbx-v2-table th,.pbx-v2-table td{
  padding:10px;
  border-bottom:1px solid var(--ui-line,#29404b);
  text-align:left;
  vertical-align:middle;
}
.pbx-v2-actions{display:flex;gap:8px;flex-wrap:wrap}
.pbx-v2-ok{font-weight:800}
.pbx-v2-off{opacity:.65}
.pbx-v2-box .danger{border-color:#b94b59}
@media(max-width:700px){
  .pbx-v2-launcher{right:12px;bottom:74px}
  .pbx-v2-table{min-width:760px}
}

/* ===== AUTOPECAS PBX INLINE USERS V1 ===== */

#pbxInlineUsersTools{
  margin:10px 0 16px;
}

.pbx-inline-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.pbx-inline-box{
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid var(--ui-line,#29404b);
}

.pbx-inline-meta{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  font-size:.93rem;
  margin-bottom:9px;
}

.pbx-inline-ok{
  font-weight:800;
}

.pbx-inline-off{
  opacity:.68;
}

.pbx-inline-admin{
  opacity:.68;
}

.pbx-inline-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.pbx-inline-actions .danger{
  border-color:#b94b59;
}

#pbxV2Launcher,
#pbxAdminLauncher{
  display:none!important;
}

@media(max-width:700px){
  .pbx-inline-meta,
  .pbx-inline-actions{
    align-items:stretch;
  }

  .pbx-inline-actions .btn{
    flex:1 1 auto;
  }
}

/* ===== AUTOPECAS WEBRTC PHONE V1 ===== */
.cna-phone{
  position:fixed;right:18px;bottom:18px;z-index:9500;
  width:min(330px,calc(100vw - 28px));padding:14px;
  background:var(--ui-panel,#0f1b22);color:var(--ui-text,#edf4f6);
  border:1px solid var(--ui-line,#29404b);border-radius:16px;
  box-shadow:0 12px 36px rgba(0,0,0,.34)
}
.cna-phone-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cna-phone-small{margin-top:2px;font-size:.82rem;opacity:.7}
.cna-phone-led{width:11px;height:11px;border-radius:50%;display:inline-block;background:#69767c}
.cna-phone-led.ok{background:#2bd391;box-shadow:0 0 0 4px rgba(43,211,145,.12)}
.cna-phone-status{margin-top:12px;font-size:.91rem;opacity:.82}
.cna-phone-caller{margin-top:7px;font-size:1.12rem;font-weight:800}
.cna-phone-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}
.cna-phone-actions .btn{flex:1 1 auto}
.cna-phone-hidden{display:none!important}
@media(max-width:650px){.cna-phone{right:10px;bottom:10px}}

/* ===== AUTOPECAS WEBRTC PHONE V2 • DISCAGEM ===== */
.cna-phone-v2{width:min(350px,calc(100vw - 28px))}
.cna-phone-dial-box{margin-top:12px}
.cna-phone-number-row{display:flex;gap:7px}
.cna-phone-number{
  flex:1;min-width:0;padding:10px 12px;border-radius:10px;
  border:1px solid var(--ui-line,#29404b);
  background:rgba(255,255,255,.04);
  color:inherit;font-size:1rem;outline:none
}
.cna-phone-number:focus{border-color:#5aa9ff}
.cna-phone-back{flex:0 0 46px}
.cna-phone-keypad{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:7px;margin-top:9px
}
.cna-phone-keypad button{
  border:1px solid var(--ui-line,#29404b);
  border-radius:10px;padding:10px 0;
  background:rgba(255,255,255,.05);
  color:inherit;font-weight:800;font-size:1.02rem;
  cursor:pointer
}
.cna-phone-keypad button:hover{background:rgba(255,255,255,.10)}
.cna-phone-dial-actions{display:flex;gap:8px;margin-top:9px}
.cna-phone-dial-actions .btn{flex:1}

/* ===== AUTOPECAS WEBRTC MINI PHONE ===== */
.cna-phone{
  width:min(270px,calc(100vw - 20px))!important;
  padding:10px!important;
  right:10px!important;
  bottom:10px!important;
  border-radius:12px!important;
}

.cna-phone-head b{
  font-size:.92rem;
}

.cna-phone-small{
  font-size:.72rem!important;
}

.cna-phone-status{
  margin-top:7px!important;
  font-size:.78rem!important;
}

.cna-phone-caller{
  margin-top:4px!important;
  font-size:.92rem!important;
}

.cna-phone-number{
  padding:7px 9px!important;
  font-size:.88rem!important;
}

.cna-phone-keypad{
  margin-top:7px!important;
  gap:5px!important;
}

.cna-phone-keypad button{
  padding:7px 0!important;
  font-size:.88rem!important;
}

.cna-phone-dial-actions{
  gap:5px!important;
  margin-top:7px!important;
}

.cna-phone-actions{
  gap:5px!important;
  margin-top:7px!important;
}

.cna-phone .btn{
  padding:7px 9px!important;
  font-size:.78rem!important;
}


/* ===== BOTAO ATIVAR AUDIO WEBRTC ===== */
.cna-phone-audio-enable{
  width:100%;
  margin-top:8px;
  font-size:.78rem!important;
}


/* ===== AUTOPECAS • CARD VIBRANDO EM CHAMADA ===== */
@keyframes cnaPhoneRingShake {
  0%,100% { transform: translate3d(0,0,0) rotate(0deg); }
  10%     { transform: translate3d(-3px,0,0) rotate(-0.6deg); }
  20%     { transform: translate3d(3px,0,0) rotate(0.6deg); }
  30%     { transform: translate3d(-2px,0,0) rotate(-0.4deg); }
  40%     { transform: translate3d(2px,0,0) rotate(0.4deg); }
  50%     { transform: translate3d(-1px,0,0) rotate(-0.2deg); }
  60%     { transform: translate3d(1px,0,0) rotate(0.2deg); }
  70%,100%{ transform: translate3d(0,0,0) rotate(0deg); }
}

@keyframes cnaPhoneRingPulse {
  0%,100% { box-shadow: 0 12px 36px rgba(0,0,0,.34); }
  50%     { box-shadow: 0 12px 42px rgba(0,0,0,.46), 0 0 0 5px rgba(255,255,255,.08); }
}

.cna-phone.cna-phone-ringing{
  animation:
    cnaPhoneRingShake .58s ease-in-out infinite,
    cnaPhoneRingPulse 1.2s ease-in-out infinite;
  will-change:transform,box-shadow;
}

/* ===== AUTOPECAS • STATUS GLOBAL DE REDE V1 ===== */
.cna-net-status{
  position:fixed;
  left:10px;
  bottom:8px;
  z-index:9900;
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
  max-width:calc(100vw - 300px);
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  background:rgba(10,18,23,.86);
  backdrop-filter:blur(8px);
  color:#dce8ed;
  font-size:11px;
  line-height:1.2;
  box-shadow:0 4px 16px rgba(0,0,0,.22);
}

.cna-net-item b{font-weight:800}
.cna-net-sep{opacity:.38}
.cna-net-online{color:#48dc9b}
.cna-net-offline{color:#ff6868}
.cna-net-checking{opacity:.65}

@media(max-width:700px){
  .cna-net-status{
    left:6px;
    bottom:6px;
    max-width:calc(100vw - 12px);
    font-size:9.5px;
    padding:4px 6px;
  }
}

/* ===== AUTOPECAS PAINEL DE RINGTONE V1 ===== */
.cna-ringtone-admin-btn{
  position:fixed;
  right:14px;
  bottom:78px;
  z-index:9850;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:11px;
  background:#17242b;
  color:#fff;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.28);
}

.cna-ringtone-modal{
  position:fixed;
  inset:0;
  z-index:12000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:rgba(0,0,0,.66);
}

.cna-ringtone-hidden{display:none!important}

.cna-ringtone-box{
  position:relative;
  width:min(520px,100%);
  padding:24px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:#111d23;
  color:#eaf2f5;
  box-shadow:0 22px 70px rgba(0,0,0,.48);
}

.cna-ringtone-box h2{margin:0 35px 8px 0}
.cna-ringtone-help{opacity:.78;line-height:1.45}

.cna-ringtone-close{
  position:absolute;
  right:14px;
  top:10px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:30px;
  cursor:pointer;
}

.cna-ringtone-current{
  margin:15px 0;
  padding:10px 12px;
  border-radius:10px;
  background:rgba(255,255,255,.06);
}

#cnaRingtoneFile{
  display:block;
  width:100%;
  margin:12px 0;
}

#cnaRingtonePreview{
  width:100%;
  margin:8px 0 15px;
}

.cna-ringtone-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.cna-ringtone-actions button{
  padding:9px 12px;
  border:0;
  border-radius:9px;
  cursor:pointer;
  font-weight:750;
}

.cna-ringtone-actions .primary{
  background:#2b9b68;
  color:#fff;
}

.cna-ringtone-message{
  min-height:22px;
  margin-top:12px;
  font-weight:700;
}

.cna-ringtone-message.ok{color:#55d99b}
.cna-ringtone-message.error{color:#ff7878}