/* =====================================================================
   LAVMAIS — tema da marca para Roundcube Elastic
   Azul Institucional #17365D · Azul Médio #1F487C · Ciano #00B4D8
   Carregado APÓS o styles.css do Elastic (apenas overrides).
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

:root{
  --lm-navy:#17365D; --lm-navy-deep:#0F2440; --lm-iface:#1F487C;
  --lm-cyan:#00B4D8; --lm-cyan-600:#0096B8; --lm-steel:#1F487C; --lm-steel-300:#8db8d8;
}

/* =====================================================================
   1) TELA DE LOGIN — card central
   ===================================================================== */
body.task-login{
  font-family:'IBM Plex Sans',sans-serif;
  background:
    radial-gradient(900px 500px at 80% 10%, rgba(0,180,216,.22), transparent 60%),
    linear-gradient(157deg,#1F487C, var(--lm-navy) 50%, var(--lm-navy-deep));
}
body.task-login #layout,
body.task-login #layout-content.lavmais-login{
  position:fixed; inset:0; width:100%; height:100%; max-width:none; margin:0; padding:24px;
  display:flex; align-items:center; justify-content:center;
  background:transparent; box-shadow:none; border:0; border-radius:0; overflow:auto;
}
body.task-login #layout-menu,
body.task-login #layout-sidebar{ display:none !important; }
body.task-login #layout-content > #logo{ display:none; }

.lm-card{
  width:100%; max-width:380px; background:#fff; border-radius:18px; padding:32px;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.4); font-family:'IBM Plex Sans',sans-serif;
}
.lm-brand{ display:flex; align-items:center; gap:12px; }
.lm-logo{ height:38px; width:auto; }
.lm-title{ font-family:'Work Sans',sans-serif; font-size:22px; font-weight:700; color:var(--lm-navy); margin:22px 0 4px; }
.lm-sub{ font-size:14px; color:#6f809e; margin:0 0 6px; }

body.task-login .lm-card .propform,
body.task-login .lm-card table.propform{ width:100%; border:0; padding:0; background:none; box-shadow:none; }
body.task-login .lm-card input,
body.task-login .lm-card input.form-control{
  width:100%; height:46px; border:1.5px solid #d0d5dd; border-radius:10px; padding:0 14px;
  font:500 15px 'IBM Plex Sans',sans-serif; color:var(--lm-navy); background:#fff; box-shadow:none;
}
body.task-login .lm-card input.form-control:focus{
  outline:0; border-color:var(--lm-steel); box-shadow:0 0 0 4px rgba(31,72,124,.15);
}
body.task-login .lm-card label{
  display:block; font:600 13px 'IBM Plex Sans',sans-serif; color:var(--lm-iface); margin:14px 0 6px;
}
body.task-login #rcmloginsubmit{
  margin-top:22px !important; width:100%; height:48px; border:0; border-radius:9px;
  background:linear-gradient(135deg,var(--lm-navy),var(--lm-cyan)) !important; color:#fff !important;
  font:700 15px 'Work Sans',sans-serif; letter-spacing:.2px; cursor:pointer;
  box-shadow:0 6px 16px -8px rgba(0,180,216,.5);
}
body.task-login #rcmloginsubmit:hover{ filter:brightness(1.06); }
body.task-login #rcmloginsubmit:active{ transform:translateY(1px); }
body.task-login #login-footer{ margin-top:18px; font:400 12px 'IBM Plex Sans',sans-serif; color:#a6b4ce; text-align:center; }

/* =====================================================================
   2) ACENTO DA MARCA NO APP (pos-login) — conservador
   ===================================================================== */
html.dark-mode body, body{ --color-main-action:var(--lm-navy); font-family:'IBM Plex Sans',sans-serif; }

.btn.btn-primary,
button.btn.btn-primary,
input.btn.btn-primary,
a.btn.btn-primary{
  background-color:var(--lm-navy) !important;
  border-color:var(--lm-iface) !important;
  color:#fff !important;
}
.btn.btn-primary:hover,
button.btn.btn-primary:hover{ background-color:var(--lm-iface) !important; }

.listing li.selected > a,
.messagelist tr.selected > td,
.listing tr.selected > td{ box-shadow:inset 3px 0 0 0 var(--lm-cyan); }

/* =====================================================================
   3) CAIXA DE ENTRADA
   ===================================================================== */
body.task-mail .contactphoto img,
body.task-mail .contactphoto,
.messagelist .contactphoto img{ border-radius:50% !important; object-fit:cover; }

body.task-mail #messagelist td,
body.task-mail table.messagelist td{ padding-top:10px; padding-bottom:10px; border-color:#eef0f4; }
body.task-mail #messagelist tr:hover td,
body.task-mail table.messagelist tr:hover td{ background:#f4f6fb; }
body.task-mail #messagelist tr.selected td,
body.task-mail table.messagelist tr.selected td{ background:#e9eef9; box-shadow:inset 3px 0 0 var(--lm-cyan); }

body.task-mail #messagelist tr.unread td.subject,
body.task-mail table.messagelist tr.unread span.subject{ color:var(--lm-navy); font-weight:700; }

body.task-mail a.compose,
body.task-mail .compose.btn,
body.task-mail .toolbar a.compose,
body.task-mail #layout-list a.compose{
  border-radius:24px !important;
  box-shadow:0 6px 16px -6px rgba(0,180,216,.5);
  font-weight:700;
}

body.task-mail .message-partheaders .contactphoto img,
body.task-mail #messageheader .contactphoto img{ width:44px; height:44px; border-radius:50%; }

/* =====================================================================
   5) BOTAO "ESCREVER"
   ===================================================================== */
body.task-mail a.compose{
  background:linear-gradient(135deg,var(--lm-navy),var(--lm-cyan)) !important;
  color:#fff !important; border:0 !important; border-radius:24px !important;
  padding:0 18px !important; height:44px !important; min-width:44px;
  font:700 14px/44px 'Work Sans',sans-serif !important;
  box-shadow:0 6px 18px -6px rgba(0,180,216,.5) !important;
}
body.task-mail a.compose:hover{ filter:brightness(1.06); }

/* =====================================================================
   6) LISTA arejada + CABECALHO claro
   ===================================================================== */
body.task-mail #messagelist tbody td{ padding-top:11px !important; padding-bottom:11px !important; }
body.task-mail #messagelist tbody tr{ border-bottom:1px solid #eef0f4; }
body.task-mail #messagelist tbody tr:hover{ background:#f6f8fc !important; }
body.task-mail #messagelist tbody tr.selected{ background:#e9eef9 !important; }
body.task-mail #messagelist tbody tr.unread .subject{ font-weight:700; color:var(--lm-navy); }

body.task-mail .toolbar{ background:#ffffff; border-bottom:1px solid #eef0f4; }
body.task-mail #layout-list .header,
body.task-mail #layout-content .header{ background:#ffffff; }

/* =====================================================================
   1b) LOGIN — domar a TABELA do loginform da Elastic dentro do .lm-card
   ===================================================================== */
body.task-login .lm-card #login-form,
body.task-login .lm-card #login-form > table,
body.task-login .lm-card #login-form table.propform,
body.task-login .lm-card #login-form tbody,
body.task-login .lm-card #login-form tr,
body.task-login .lm-card #login-form td{
  display:block !important; width:100% !important; max-width:none !important;
  margin:0 !important; padding:0 !important; border:0 !important;
  background:none !important; box-shadow:none !important; position:static !important;
}
body.task-login .lm-card #login-form td.title{
  margin:14px 0 6px !important; height:auto !important; width:auto !important; overflow:visible !important;
  font:600 13px 'IBM Plex Sans',sans-serif !important; color:var(--lm-iface) !important; text-align:left !important;
}
body.task-login .lm-card #login-form td.title::before,
body.task-login .lm-card #login-form td.title::after{ content:none !important; display:none !important; }
body.task-login .lm-card #login-form td.title label{
  position:static !important; clip:auto !important; width:auto !important; height:auto !important;
  margin:0 !important; padding:0 !important; font:inherit !important; color:inherit !important;
  white-space:normal !important; overflow:visible !important; display:inline !important;
}
body.task-login .lm-card #login-form input.form-control{
  width:100% !important; height:46px !important; border:1.5px solid #d0d5dd !important;
  border-radius:10px !important; padding:0 14px !important; font:500 15px 'IBM Plex Sans',sans-serif !important;
  color:var(--lm-navy) !important; background:#fff !important; box-shadow:none !important;
}
body.task-login .lm-card #login-form input.form-control:focus{
  outline:0 !important; border-color:var(--lm-steel) !important; box-shadow:0 0 0 4px rgba(31,72,124,.15) !important;
}
body.task-login .lm-card #rcmloginsubmit{
  display:block !important; margin:22px 0 0 !important; width:100% !important; height:48px !important;
  float:none !important; border:0 !important; border-radius:9px !important;
  background:linear-gradient(135deg,var(--lm-navy),var(--lm-cyan)) !important; color:#fff !important;
  font:700 15px 'Work Sans',sans-serif !important; cursor:pointer !important; box-shadow:0 6px 16px -8px rgba(0,180,216,.5) !important;
}

body.task-login .lm-card #login-form td.title label::before,
body.task-login .lm-card #login-form td.title label::after,
body.task-login .lm-card #login-form .input-group .icon{ content:none !important; display:none !important; }
body.task-login .lm-card #login-form p.formbuttons{ margin:0 !important; padding:0 !important; text-align:left !important; }
body.task-login .lm-card #rcmloginsubmit{ text-transform:none !important; }

/* =====================================================================
   7) INTERIOR no padrao do painel (claro / sidebar navy-ativo / ciano)
   ===================================================================== */
body.task-mail #layout{ background:#f4f6fb; }

body.task-mail #mailboxlist li a,
body.task-mail .folderlist li a{
  border-radius:9px; margin:1px 6px; padding:9px 12px;
  font-weight:600; color:var(--lm-iface);
}
body.task-mail #mailboxlist li a:hover,
body.task-mail .folderlist li a:hover{ background:#eaeff7; }
body.task-mail #mailboxlist li.selected > a,
body.task-mail .folderlist li.selected > a{ background:var(--lm-navy) !important; color:#fff !important; }
body.task-mail #mailboxlist li.selected > a *,
body.task-mail .folderlist li.selected > a *{ color:#fff !important; }
body.task-mail .unreadcount{ background:var(--lm-steel); color:#fff !important; border-radius:999px; font-weight:700; }
body.task-mail #mailboxlist li.selected .unreadcount,
body.task-mail .folderlist li.selected .unreadcount{ background:var(--lm-cyan) !important; color:#fff !important; }

body.task-mail #layout-sidebar .header{ background:#fff; border-bottom:1px solid #e6ebf4; }

/* =====================================================================
   8) BARRA DE TAREFAS vertical
   ===================================================================== */
body.task-mail #layout-menu,
body.task-mail #taskmenu{ background:#fff !important; border-right:1px solid #e6ebf4 !important; }
body.task-mail #taskmenu a{ color:var(--lm-iface) !important; font-weight:600; }
body.task-mail #taskmenu a:hover{ background:#eef2f8 !important; }
body.task-mail #taskmenu a.selected,
body.task-mail #taskmenu a.selected:hover{ background:var(--lm-navy) !important; }
body.task-mail #taskmenu a.selected,
body.task-mail #taskmenu a.selected *{ color:#fff !important; }
body.task-mail #taskmenu a.logout{ color:#dc2626 !important; }
body.task-mail #layout-menu .special-buttons,
body.task-mail #taskmenu .special-buttons{ background:transparent !important; }

body.task-mail #taskmenu .action-buttons{ background:transparent !important; }
body.task-mail #taskmenu a.mail.selected,
body.task-mail #taskmenu a.mail.selected:hover{ background:var(--lm-navy) !important; }
body.task-mail #taskmenu a.mail.selected,
body.task-mail #taskmenu a.mail.selected *{ color:#fff !important; }