:root {
  --arg-navy: #0a1d2a;
  --arg-blue: #003f6b;
  --arg-blue-2: #075783;
  --arg-yellow: #ffbd23;
  --arg-mint: #34b891;
  --arg-ink: #062b48;
  --arg-muted: #60727f;
  --arg-line: #d9e2e7;
  --arg-soft: #f3f7f9;
  --arg-white: #ffffff;
  --arg-shadow: 0 18px 50px rgba(6, 43, 72, .12);
  --arg-font: Inter, Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html,
body {
  font-family: var(--arg-font) !important;
}

button,
input,
select,
textarea {
  font-family: inherit !important;
}

/* ================================================================
   ACCESO — misma composición visual que drive.argañosa.es
   ================================================================ */

body.task-login {
  min-width: 0 !important;
  min-height: 100vh !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
}

body.task-login::before {
  content: "CORREO CORPORATIVO PRIVADO";
  position: fixed;
  z-index: 4;
  top: 25.5%;
  left: clamp(52px, 7.8vw, 150px);
  color: var(--arg-yellow);
  font-size: clamp(10px, .72vw, 13px);
  font-weight: 900;
  letter-spacing: .18em;
}

body.task-login::after {
  content: "";
  position: fixed;
  z-index: 2;
  right: 47.8%;
  bottom: -250px;
  width: 430px;
  height: 430px;
  border: 66px solid var(--arg-yellow);
  border-radius: 50%;
  pointer-events: none;
}

body.task-login #layout {
  position: fixed !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: 52% 48% !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: linear-gradient(90deg, var(--arg-navy) 0 52%, #f7f9fb 52% 100%) !important;
}

body.task-login #layout::before {
  content: "Correos\A claros y\A organizados.";
  position: absolute;
  z-index: 3;
  top: 31%;
  left: clamp(52px, 7.8vw, 150px);
  width: 40%;
  white-space: pre;
  color: var(--arg-white);
  font-size: clamp(48px, 4.6vw, 88px);
  font-weight: 900;
  line-height: .94;
  letter-spacing: -.055em;
}

body.task-login #layout::after {
  content: none !important;
}

body.task-login #layout-content {
  position: relative !important;
  inset: auto !important;
  grid-column: 2 !important;
  align-self: center !important;
  justify-self: center !important;
  display: block !important;
  box-sizing: border-box !important;
  width: min(460px, calc(100% - 64px)) !important;
  min-height: 500px !important;
  margin: 0 !important;
  padding: 48px 44px 42px !important;
  overflow: visible !important;
  text-align: left !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border: 1px solid #d8e0e5 !important;
  border-radius: 26px !important;
  box-shadow: var(--arg-shadow) !important;
}

body.task-login #layout-content::before {
  content: "ACCESO SEGURO";
  position: absolute;
  top: 45px;
  left: 44px;
  color: var(--arg-blue-2);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .16em;
}

body.task-login #layout-content::after {
  content: "CORREO DE\A La Argañosa";
  position: absolute;
  top: 91px;
  left: 112px;
  white-space: pre;
  color: var(--arg-ink);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.1;
}

body.task-login #logo {
  position: absolute !important;
  top: 88px !important;
  left: 44px !important;
  display: block !important;
  width: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  object-fit: contain !important;
  filter: none !important;
}

body.task-login h1.voice {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
}

body.task-login #login-form {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 132px 0 0 !important;
  padding: 0 !important;
  color: var(--arg-ink) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.task-login #login-form::before {
  content: none !important;
}

body.task-login #login-form table,
body.task-login #login-form tbody,
body.task-login #login-form tr,
body.task-login #login-form td {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.task-login #login-form tr {
  margin: 0 0 18px !important;
}

body.task-login #login-form td.title {
  display: block !important;
  margin-bottom: 7px !important;
  color: var(--arg-ink) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-align: left !important;
}

body.task-login #login-form td.title::before,
body.task-login #login-form td.input::before {
  content: none !important;
  display: none !important;
}

body.task-login #login-form .input-group-prepend {
  display: none !important;
}

body.task-login #login-form label {
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  clip: auto !important;
  color: inherit !important;
}

body.task-login #login-form input.form-control {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  color: var(--arg-ink) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  background: #e8f0fe !important;
  border: 1px solid #c5d1db !important;
  border-radius: 11px !important;
  outline: none !important;
  box-shadow: none !important;
}

body.task-login #login-form input.form-control:focus {
  background: #f1f6ff !important;
  border-color: var(--arg-blue) !important;
  box-shadow: 0 0 0 3px rgba(0, 63, 107, .14) !important;
}

body.task-login #login-form .formbuttons {
  margin: 20px 0 0 !important;
  padding: 0 !important;
}

body.task-login #rcmloginsubmit {
  display: block !important;
  width: 100% !important;
  height: 54px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  color: var(--arg-white) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  background: var(--arg-blue) !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 24px rgba(0, 63, 107, .18) !important;
}

body.task-login #rcmloginsubmit::after {
  content: "  →";
}

body.task-login #rcmloginsubmit:hover,
body.task-login #rcmloginsubmit:focus {
  color: var(--arg-navy) !important;
  background: var(--arg-yellow) !important;
}

body.task-login #login-footer {
  margin: 23px 0 0 !important;
  padding: 20px 0 0 !important;
  color: var(--arg-muted) !important;
  font-size: 12px !important;
  text-align: left !important;
  border-top: 1px solid var(--arg-line) !important;
}

body.task-login #login-footer::before {
  content: "Acceso exclusivo para personas autorizadas.\A";
  white-space: pre;
}

/* ================================================================
   APLICACIÓN — buzón, lectura, contactos y configuración
   ================================================================ */

body:not(.task-login) {
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--arg-ink) !important;
  background: var(--arg-soft) !important;
}

body:not(.task-login) #layout {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--arg-soft) !important;
}

body:not(.task-login) #layout > #layout-menu,
body:not(.task-login) #layout > #layout-sidebar,
body:not(.task-login) #layout > #layout-list,
body:not(.task-login) #layout > #layout-content {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  height: 100vh !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

body:not(.task-login) #layout-menu {
  z-index: 20 !important;
  flex: 0 0 86px !important;
  width: 86px !important;
  min-width: 86px !important;
  max-width: 86px !important;
  color: var(--arg-white) !important;
  background: var(--arg-navy) !important;
  border: 0 !important;
  box-shadow: 8px 0 24px rgba(10, 29, 42, .12) !important;
}

body:not(.task-login) #layout-menu::before {
  content: "A";
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 18px auto 14px;
  color: var(--arg-white);
  font-size: 23px;
  font-weight: 900;
  background: var(--arg-blue);
  border-radius: 13px;
  transform: rotate(-6deg);
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .08);
}

body:not(.task-login) #layout-menu .popover-header {
  display: none !important;
}

body:not(.task-login) #layout-menu #taskmenu.menu.toolbar {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: calc(100vh - 78px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 0 8px !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
}

body:not(.task-login) #layout-menu #taskmenu .action-buttons,
body:not(.task-login) #layout-menu #taskmenu .special-buttons {
  display: flex !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body:not(.task-login) #layout-menu #taskmenu .special-buttons {
  margin-top: auto !important;
}

body:not(.task-login) #layout-menu #taskmenu > a,
body:not(.task-login) #layout-menu #taskmenu .action-buttons > a,
body:not(.task-login) #layout-menu #taskmenu .special-buttons > a {
  position: relative !important;
  display: flex !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

body:not(.task-login) #layout-menu a,
body:not(.task-login) #layout-menu button {
  box-sizing: border-box !important;
  width: 72px !important;
  min-height: 64px !important;
  margin: 4px 7px !important;
  padding: 10px 4px 7px !important;
  overflow: hidden !important;
  color: #d9e7ed !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 12px !important;
}

body:not(.task-login) #layout-menu a:hover,
body:not(.task-login) #layout-menu button:hover,
body:not(.task-login) #layout-menu .selected,
body:not(.task-login) #layout-menu .selected a {
  color: var(--arg-white) !important;
  background: rgba(52, 184, 145, .18) !important;
}

body:not(.task-login) #layout-menu .selected {
  box-shadow: inset 4px 0 0 var(--arg-yellow) !important;
}

body:not(.task-login) #layout-menu .icon::before {
  color: currentColor !important;
  font-size: 22px !important;
}

body:not(.task-login) #layout-menu .logout,
body:not(.task-login) #layout-menu .about {
  color: #dbe8ee !important;
}

body:not(.task-login) #layout-sidebar {
  z-index: 12 !important;
  flex: 0 0 278px !important;
  width: 278px !important;
  min-width: 278px !important;
  max-width: 278px !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border-right: 1px solid var(--arg-line) !important;
}

body:not(.task-login) #layout-list {
  z-index: 10 !important;
  flex: 0 0 440px !important;
  width: 440px !important;
  min-width: 400px !important;
  max-width: 440px !important;
  color: var(--arg-ink) !important;
  background: #f8fafb !important;
  border-right: 1px solid var(--arg-line) !important;
}

body:not(.task-login) #layout-content {
  z-index: 5 !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  color: var(--arg-ink) !important;
  background: var(--arg-soft) !important;
}

body:not(.task-login) .header,
body:not(.task-login) .header-title,
body:not(.task-login) .toolbar {
  box-sizing: border-box !important;
  min-height: 74px !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border-color: var(--arg-line) !important;
}

body:not(.task-login) #messagelist-header {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 10px !important;
}

body:not(.task-login) #messagelist-header .header-title {
  position: static !important;
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 74px !important;
  margin: 0 !important;
  padding: 0 6px !important;
  overflow: hidden !important;
  color: transparent !important;
  font-size: 0 !important;
  white-space: nowrap !important;
}

body:not(.task-login) #messagelist-header .header-title::after {
  content: "Mensajes";
  color: var(--arg-ink);
  font-size: 13px;
  font-weight: 850;
}

body:not(.task-login) #messagelist-header .toolbar {
  position: static !important;
  display: flex !important;
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 3px 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body:not(.task-login) #messagelist-header > .toolbar-button,
body:not(.task-login) #messagelist-header > .toolbar-menu-button,
body:not(.task-login) #messagelist-header > .task-menu-button,
body:not(.task-login) #messagelist-header > .back-sidebar-button {
  position: static !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 4px !important;
  border-radius: 10px !important;
}

body:not(.task-login) #layout-content > .header {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  box-shadow: 0 7px 22px rgba(6, 43, 72, .055) !important;
}

body:not(.task-login) #layout-content > .header > .header-title {
  display: none !important;
}

body:not(.task-login) #layout-content > .header #mailtoolbar {
  position: static !important;
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 58px !important;
  margin: 0 !important;
  padding: 3px 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body:not(.task-login) #mailtoolbar > a,
body:not(.task-login) #mailtoolbar > .markmessage,
body:not(.task-login) #mailtoolbar > .more {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 48px !important;
  max-width: 126px !important;
  height: 42px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  overflow: hidden !important;
  color: var(--arg-blue) !important;
  white-space: nowrap !important;
  background: #f4f8fa !important;
  border: 1px solid #dbe6eb !important;
  border-radius: 11px !important;
  box-shadow: 0 3px 9px rgba(6, 43, 72, .035) !important;
}

body:not(.task-login) #mailtoolbar > .dropbutton {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: stretch !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 11px !important;
  box-shadow: none !important;
}

body:not(.task-login) #mailtoolbar > .dropbutton > a {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 48px !important;
  max-width: 126px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  overflow: hidden !important;
  color: var(--arg-blue) !important;
  white-space: nowrap !important;
  background: #f4f8fa !important;
  border: 1px solid #dbe6eb !important;
  border-radius: 11px 0 0 11px !important;
  box-shadow: 0 3px 9px rgba(6, 43, 72, .035) !important;
}

body:not(.task-login) #mailtoolbar > .dropbutton > a.dropdown {
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  padding: 0 !important;
  border-left: 0 !important;
  border-radius: 0 11px 11px 0 !important;
}

body:not(.task-login) #mailtoolbar .inner {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body:not(.task-login) #mailtoolbar > a:not(.disabled):hover,
body:not(.task-login) #mailtoolbar > .dropbutton:not(.disabled):hover,
body:not(.task-login) #mailtoolbar > .markmessage:hover,
body:not(.task-login) #mailtoolbar > .more:hover {
  color: var(--arg-navy) !important;
  background: #fff7df !important;
  border-color: var(--arg-yellow) !important;
}

body:not(.task-login) #mailtoolbar > .dropbutton:not(.disabled):hover > a {
  color: var(--arg-navy) !important;
  background: #fff7df !important;
  border-color: var(--arg-yellow) !important;
}

body:not(.task-login) #mailtoolbar > .disabled,
body:not(.task-login) #mailtoolbar > .dropbutton:has(.disabled) {
  color: #93a2aa !important;
  background: #f7f9fa !important;
  border-color: #e7ecef !important;
  box-shadow: none !important;
}

body:not(.task-login) #mailtoolbar .compose.hidden {
  display: none !important;
}

body:not(.task-login) #mailtoolbar .spacer {
  display: none !important;
}

body:not(.task-login) .header {
  border-bottom: 1px solid var(--arg-line) !important;
}

body:not(.task-login) .header-title {
  display: flex !important;
  align-items: center !important;
  padding: 0 22px !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

body:not(.task-login) .toolbar {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 10px 14px !important;
}

body:not(.task-login) .toolbar a,
body:not(.task-login) .toolbar button,
body:not(.task-login) .toolbar .button {
  min-width: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  color: var(--arg-blue) !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
}

body:not(.task-login) .toolbar a:hover,
body:not(.task-login) .toolbar button:hover,
body:not(.task-login) .toolbar .button:hover {
  color: var(--arg-blue) !important;
  background: #edf5f8 !important;
  border-color: #d6e3e8 !important;
}

body:not(.task-login) .toolbar .disabled,
body:not(.task-login) .toolbar [disabled] {
  color: #9ba9b1 !important;
  opacity: .55 !important;
}

body:not(.task-login) .button.mainaction,
body:not(.task-login) button.mainaction,
body:not(.task-login) input.mainaction {
  color: var(--arg-white) !important;
  font-weight: 850 !important;
  background: var(--arg-blue) !important;
  border-color: var(--arg-blue) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 18px rgba(0, 63, 107, .16) !important;
}

body:not(.task-login) .button.mainaction:hover,
body:not(.task-login) button.mainaction:hover,
body:not(.task-login) input.mainaction:hover {
  color: var(--arg-navy) !important;
  background: var(--arg-yellow) !important;
  border-color: var(--arg-yellow) !important;
}

body:not(.task-login) #layout-sidebar .scroller,
body:not(.task-login) #layout-sidebar .listing,
body:not(.task-login) #layout-sidebar .listbox,
body:not(.task-login) #layout-sidebar .boxlist {
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
}

body:not(.task-login) #layout-sidebar .scroller {
  padding: 12px 10px 18px !important;
}

body:not(.task-login) #layout-sidebar li,
body:not(.task-login) #layout-sidebar li a,
body:not(.task-login) #layout-sidebar .listing li,
body:not(.task-login) #layout-sidebar .listing li a {
  color: var(--arg-ink) !important;
  background: transparent !important;
  border: 0 !important;
}

body:not(.task-login) #layout-sidebar li a,
body:not(.task-login) #layout-sidebar .listing li a {
  display: flex !important;
  align-items: center !important;
  min-height: 46px !important;
  margin: 3px 0 !important;
  padding: 9px 12px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
}

body:not(.task-login) #layout-sidebar li a:hover,
body:not(.task-login) #layout-sidebar .listing li a:hover {
  background: #edf5f8 !important;
}

body:not(.task-login) #layout-sidebar li.selected > a,
body:not(.task-login) #layout-sidebar .listing li.selected > a,
body:not(.task-login) #layout-sidebar li.selected {
  color: var(--arg-blue) !important;
  background: #e8f0fe !important;
  box-shadow: inset 4px 0 0 var(--arg-mint) !important;
}

body:not(.task-login) #layout-sidebar .folderlist li a::before,
body:not(.task-login) #layout-sidebar .treelist li a::before {
  color: var(--arg-blue) !important;
}

body:not(.task-login) #layout-sidebar .compose,
body:not(.task-login) #layout-sidebar .button.compose {
  min-height: 48px !important;
  margin: 14px 14px 10px !important;
  color: var(--arg-white) !important;
  font-weight: 850 !important;
  background: var(--arg-blue) !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 22px rgba(0, 63, 107, .16) !important;
}

body:not(.task-login) #layout-sidebar .compose:hover,
body:not(.task-login) #layout-sidebar .button.compose:hover {
  color: var(--arg-navy) !important;
  background: var(--arg-yellow) !important;
}

body:not(.task-login) #layout-list .searchbar,
body:not(.task-login) #layout-list .header {
  background: var(--arg-white) !important;
  border-bottom: 1px solid var(--arg-line) !important;
}

body:not(.task-login) #layout-list .searchbar {
  box-sizing: border-box !important;
  min-height: 58px !important;
  padding: 9px 12px !important;
}

body:not(.task-login) #layout-list .searchbar input,
body:not(.task-login) #layout-list input[type="search"] {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 40px !important;
  padding: 0 14px 0 38px !important;
  color: var(--arg-ink) !important;
  background: #f1f5f7 !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
}

body:not(.task-login) #layout-list .searchbar input:focus,
body:not(.task-login) #layout-list input[type="search"]:focus {
  background: var(--arg-white) !important;
  border-color: var(--arg-blue) !important;
  box-shadow: 0 0 0 3px rgba(0, 63, 107, .1) !important;
}

body:not(.task-login) #layout-list .scroller {
  background: var(--arg-white) !important;
}

body:not(.task-login) #messagelist,
body:not(.task-login) .messagelist {
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
}

body:not(.task-login) #messagelist tr,
body:not(.task-login) .messagelist tr,
body:not(.task-login) #messagelist li,
body:not(.task-login) .messagelist li {
  min-height: 66px !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border-bottom: 1px solid #e6ecef !important;
}

body:not(.task-login) #messagelist tr:hover,
body:not(.task-login) .messagelist tr:hover,
body:not(.task-login) #messagelist li:hover,
body:not(.task-login) .messagelist li:hover {
  background: #f1f7f9 !important;
}

body:not(.task-login) #messagelist tr.selected,
body:not(.task-login) .messagelist tr.selected,
body:not(.task-login) #messagelist li.selected,
body:not(.task-login) .messagelist li.selected {
  color: var(--arg-ink) !important;
  background: #e8f0fe !important;
  box-shadow: inset 4px 0 0 var(--arg-mint) !important;
}

body:not(.task-login) #messagelist td,
body:not(.task-login) .messagelist td {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  color: inherit !important;
  border: 0 !important;
}

body:not(.task-login) #messagelist .subject,
body:not(.task-login) .messagelist .subject {
  color: var(--arg-ink) !important;
  font-size: 13px !important;
  font-weight: 760 !important;
}

body:not(.task-login) #messagelist .fromto,
body:not(.task-login) .messagelist .fromto,
body:not(.task-login) #messagelist .date,
body:not(.task-login) .messagelist .date {
  color: var(--arg-muted) !important;
  font-size: 11px !important;
}

body:not(.task-login) .boxfooter {
  min-height: 46px !important;
  color: var(--arg-muted) !important;
  background: var(--arg-white) !important;
  border-top: 1px solid var(--arg-line) !important;
}

body:not(.task-login) #messagecontframe,
body:not(.task-login) #content-frame,
body:not(.task-login) iframe {
  width: 100% !important;
  height: 100% !important;
  background: var(--arg-white) !important;
  border: 0 !important;
}

body.task-mail #layout-content {
  display: flex !important;
  flex-direction: column !important;
  min-width: 320px !important;
}

body.task-mail #layout-content > .header {
  flex: 0 0 74px !important;
  width: 100% !important;
  overflow: hidden !important;
}

body.task-mail #layout-content > .iframe-wrapper {
  position: relative !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: var(--arg-white) !important;
}

body.task-mail #layout-content::before,
body.task-mail #layout-content::after {
  content: none !important;
  display: none !important;
}

body.task-mail #messagecontframe {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Formularios y paneles */
body:not(.task-login) .formcontent,
body:not(.task-login) .formcontainer,
body:not(.task-login) .propform,
body:not(.task-login) .settings-default,
body:not(.task-login) .contact-details {
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
}

body:not(.task-login) .formcontainer,
body:not(.task-login) .settings-default,
body:not(.task-login) .contact-details {
  margin: 18px !important;
  padding: 24px !important;
  border: 1px solid var(--arg-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 30px rgba(6, 43, 72, .06) !important;
}

body:not(.task-login) input[type="text"],
body:not(.task-login) input[type="email"],
body:not(.task-login) input[type="password"],
body:not(.task-login) input[type="search"],
body:not(.task-login) select,
body:not(.task-login) textarea {
  box-sizing: border-box !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border: 1px solid #cbd7de !important;
  border-radius: 9px !important;
  box-shadow: none !important;
}

body:not(.task-login) input:focus,
body:not(.task-login) select:focus,
body:not(.task-login) textarea:focus {
  border-color: var(--arg-blue) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0, 63, 107, .1) !important;
}

/* Redacción y editor enriquecido */
body.action-compose #layout-content,
body.action-reply #layout-content,
body.action-forward #layout-content {
  background: #edf3f6 !important;
}

body.action-compose #compose-content,
body.action-reply #compose-content,
body.action-forward #compose-content {
  box-sizing: border-box !important;
  margin: 18px !important;
  padding: 22px !important;
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border: 1px solid var(--arg-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 34px rgba(6, 43, 72, .08) !important;
}

body.action-compose .compose-headers,
body.action-reply .compose-headers,
body.action-forward .compose-headers {
  margin-bottom: 14px !important;
  padding: 4px 0 14px !important;
  border-bottom: 1px solid var(--arg-line) !important;
}

body.action-compose #compose-content input,
body.action-reply #compose-content input,
body.action-forward #compose-content input {
  min-height: 42px !important;
  padding: 8px 12px !important;
}

body.action-compose #composebody,
body.action-reply #composebody,
body.action-forward #composebody {
  min-height: 360px !important;
  padding: 16px !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  background: var(--arg-white) !important;
  border: 1px solid var(--arg-line) !important;
  border-radius: 0 0 12px 12px !important;
}

body:not(.task-login) .tox-tinymce,
body:not(.task-login) .mce-tinymce,
body:not(.task-login) .mce-container,
body:not(.task-login) .html-editor {
  overflow: hidden !important;
  border: 1px solid var(--arg-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

body:not(.task-login) .tox-toolbar,
body:not(.task-login) .tox-toolbar__primary,
body:not(.task-login) .mce-toolbar,
body:not(.task-login) .mce-top-part {
  background: #f5f8fa !important;
  border-color: var(--arg-line) !important;
}

body:not(.task-login) .tox-toolbar__primary,
body:not(.task-login) .tox-toolbar__overflow,
body:not(.task-login) .tox-toolbar-overlord,
body:not(.task-login) .mce-toolbar-grp .mce-container-body {
  display: flex !important;
  flex-flow: row wrap !important;
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  overflow: visible !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: #f5f8fa !important;
}

body:not(.task-login) .tox-toolbar__overflow {
  padding: 0 4px 4px !important;
  border-top: 1px solid #e1e9ed !important;
  box-shadow: none !important;
}

body:not(.task-login) .tox-toolbar__group,
body:not(.task-login) .mce-btn-group {
  display: flex !important;
  align-items: center !important;
  min-height: 40px !important;
  margin: 2px !important;
  padding: 2px 4px !important;
  border-color: #dce6ea !important;
}

body:not(.task-login) .tox-tbtn,
body:not(.task-login) .mce-btn {
  border-radius: 7px !important;
}

body:not(.task-login) .tox-tbtn:hover,
body:not(.task-login) .mce-btn:hover {
  color: var(--arg-blue) !important;
  background: #e6f2f4 !important;
}

body:not(.task-login) .tox-tbtn[aria-label^="More"],
body:not(.task-login) .tox-tbtn[aria-label^="Más"] {
  display: none !important;
}

body:not(.task-login) #compose-attachments,
body:not(.task-login) .attachmentslist {
  margin-top: 12px !important;
  padding: 12px !important;
  background: #f3f8fa !important;
  border: 1px dashed #aec3cf !important;
  border-radius: 12px !important;
}

body:not(.task-login) .ui-dialog,
body:not(.task-login) .popupmenu,
body:not(.task-login) .popover {
  color: var(--arg-ink) !important;
  background: var(--arg-white) !important;
  border: 1px solid var(--arg-line) !important;
  border-radius: 14px !important;
  box-shadow: var(--arg-shadow) !important;
}

body:not(.task-login) #messagestack .alert,
body:not(.task-login) #messagestack .notice,
body:not(.task-login) #messagestack .confirmation {
  color: var(--arg-white) !important;
  background: var(--arg-navy) !important;
  border: 0 !important;
  border-left: 5px solid var(--arg-mint) !important;
  border-radius: 12px !important;
  box-shadow: var(--arg-shadow) !important;
}

/* Ajustes de densidad */
@media (max-width: 1380px) {
  body:not(.task-login) #layout-menu {
    flex-basis: 76px !important;
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
  }

  body:not(.task-login) #layout-menu a,
  body:not(.task-login) #layout-menu button {
    width: 64px !important;
    margin-left: 6px !important;
    margin-right: 6px !important;
  }

  body:not(.task-login) #layout-sidebar {
    flex-basis: 244px !important;
    width: 244px !important;
    min-width: 244px !important;
    max-width: 244px !important;
  }

  body:not(.task-login) #layout-list {
    flex-basis: 390px !important;
    width: 390px !important;
    min-width: 360px !important;
    max-width: 390px !important;
  }
}

@media (max-width: 940px) {
  body.task-login {
    overflow: auto !important;
    background: #f7f9fb !important;
  }

  body.task-login::before,
  body.task-login::after,
  body.task-login #layout::before {
    content: none !important;
    display: none !important;
  }

  body.task-login #layout {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100vh !important;
    padding: 28px 0 !important;
    overflow: auto !important;
    background: #f7f9fb !important;
  }

  body.task-login #layout-content {
    width: min(460px, calc(100% - 32px)) !important;
  }
}

@media (max-width: 820px) {
  body:not(.task-login) #layout-menu {
    flex-basis: 66px !important;
    width: 66px !important;
    min-width: 66px !important;
    max-width: 66px !important;
  }

  body:not(.task-login) #layout-menu::before {
    width: 40px;
    height: 40px;
  }

  body:not(.task-login) #layout-menu a,
  body:not(.task-login) #layout-menu button {
    width: 58px !important;
    margin-left: 4px !important;
    margin-right: 4px !important;
  }

  body:not(.task-login) #layout-sidebar,
  body:not(.task-login) #layout-list,
  body:not(.task-login) #layout-content {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body:not(.task-login) #layout > .hidden,
  body:not(.task-login) #layout > :not(.selected):not(#layout-menu) {
    display: none !important;
  }
}

@media (max-width: 520px) {
  body.task-login #layout-content {
    min-height: 0 !important;
    padding: 40px 28px 32px !important;
    border-radius: 20px !important;
  }

  body.task-login #layout-content::before {
    left: 28px;
  }

  body.task-login #layout-content::after {
    left: 94px;
  }

  body.task-login #logo {
    left: 28px !important;
  }
}

