/*
 * AR5 Mail — interfaz interna
 * Acentos naranja sobre el skin elastic, sin rehacer el layout.
 */

@font-face {
  font-family: 'AR5 Display';
  src: url('/skins/elastic/fonts/ar5/sg-700-latin.woff2') format('woff2');
  font-weight: 700; font-display: swap;
}
@font-face {
  font-family: 'AR5 Display';
  src: url('/skins/elastic/fonts/ar5/sg-500-latin.woff2') format('woff2');
  font-weight: 500; font-display: swap;
}
@font-face {
  font-family: 'AR5 Body';
  src: url('/skins/elastic/fonts/ar5/inter-400-latin.woff2') format('woff2');
  font-weight: 400; font-display: swap;
}
@font-face {
  font-family: 'AR5 Body';
  src: url('/skins/elastic/fonts/ar5/inter-500-latin.woff2') format('woff2');
  font-weight: 500; font-display: swap;
}
@font-face {
  font-family: 'AR5 Body';
  src: url('/skins/elastic/fonts/ar5/inter-600-latin.woff2') format('woff2');
  font-weight: 600; font-display: swap;
}

body:not(.task-login) {
  font-family: 'AR5 Body', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}

body:not(.task-login) h1,
body:not(.task-login) h2,
body:not(.task-login) h3,
body:not(.task-login) .header-title {
  font-family: 'AR5 Display', sans-serif !important;
  letter-spacing: -.01em;
}

/* barra lateral de tareas */
body:not(.task-login) #layout-menu,
body:not(.task-login) #taskmenu {
  background: #0E0E10 !important;
}
body:not(.task-login) #taskmenu a {
  color: rgba(255, 255, 255, .70) !important;
}
body:not(.task-login) #taskmenu a:hover {
  color: #fff !important;
  background: rgba(251, 95, 2, .14) !important;
}
body:not(.task-login) #taskmenu a.selected {
  color: #FB5F02 !important;
  background: rgba(251, 95, 2, .12) !important;
  box-shadow: inset 3px 0 0 #FB5F02 !important;
}
body:not(.task-login) #taskmenu a.selected span.inner {
  color: #FB5F02 !important;
}

/* botones de acción */
body:not(.task-login) .btn-primary,
body:not(.task-login) a.btn-primary,
body:not(.task-login) button.btn-primary {
  background-color: #FB5F02 !important;
  border-color: #FB5F02 !important;
  color: #0E0E10 !important;
  font-weight: 600 !important;
}
body:not(.task-login) .btn-primary:hover,
body:not(.task-login) button.btn-primary:hover {
  background-color: #FF7526 !important;
  border-color: #FF7526 !important;
  color: #0E0E10 !important;
}

/* el botón de redactar es la acción principal */
body:not(.task-login) a.button.compose,
body:not(.task-login) .toolbar a.compose {
  color: #FB5F02 !important;
}

/* mensaje seleccionado y sin leer */
body:not(.task-login) #messagelist tr.selected > td,
body:not(.task-login) .listing li.selected,
body:not(.task-login) .listing tr.selected > td {
  background-color: rgba(251, 95, 2, .13) !important;
  color: inherit !important;
  box-shadow: inset 3px 0 0 #FB5F02;
}
body:not(.task-login) #messagelist tr.unread td.subject,
body:not(.task-login) .listing tr.unread td.subject {
  font-weight: 600 !important;
}
body:not(.task-login) .listing li.unread::before,
body:not(.task-login) span.unread-count {
  background-color: #FB5F02 !important;
  color: #0E0E10 !important;
}

/* enlaces y foco */
body:not(.task-login) a {
  color: #C24A02;
}
body:not(.task-login) a:hover {
  color: #FB5F02;
}
body:not(.task-login) *:focus-visible {
  outline: 2px solid #FB5F02 !important;
  outline-offset: 2px !important;
}

/* campos de formulario */
body:not(.task-login) input.form-control:focus,
body:not(.task-login) select.form-control:focus,
body:not(.task-login) textarea.form-control:focus {
  border-color: #FB5F02 !important;
  box-shadow: 0 0 0 3px rgba(251, 95, 2, .18) !important;
}

/* logotipo en la barra */
body:not(.task-login) #logo {
  max-height: 34px !important;
  width: auto !important;
}

@media (prefers-reduced-motion: reduce) {
  body:not(.task-login) * { transition: none !important; }
}
