/* Corbady Mail Neon Edition — child skin of Roundcube Elastic. */
:root {
  --corbady-cyan: #05d9fa;
  --corbady-violet: #a926e9;
  --corbady-navy: #080e20;
}

/* Branded login, with readable controls against the electric backdrop. */
body.task-login {
  background: radial-gradient(ellipse at 45% 8%, rgba(23, 67, 151, .48), transparent 52%),
    radial-gradient(ellipse at 90% 72%, rgba(129, 30, 167, .28), transparent 45%),
    linear-gradient(135deg, #040610, #0a1532 55%, #10071d);
  background-attachment: fixed;
}
body.task-login::before {
  content: "";
  pointer-events: none;
  position: fixed;
  inset: 0;
  opacity: .19;
  background: linear-gradient(115deg, transparent 42%, #12bdfa 43%, transparent 44%),
    linear-gradient(157deg, transparent 72%, #c434fa 73%, transparent 74%);
}
body.task-login #layout-content,
body.task-login #login-form,
body.task-login .login-box {
  position: relative;
  border-radius: 16px;
}
body.task-login #login-form,
body.task-login .login-box {
  box-shadow: 0 0 0 1px rgba(5, 217, 250, .38),
    0 20px 55px rgba(0, 0, 0, .45), 0 0 28px rgba(169, 38, 233, .15);
}

/* All views: branding restrained enough for everyday correspondence. */
#taskmenu,
.taskmenu {
  background-color: #090e20;
  border-right: 1px solid rgba(5, 217, 250, .23);
}
#taskmenu a:hover,
.taskmenu a:hover,
#taskmenu a.selected,
.taskmenu a.selected {
  background-color: rgba(5, 217, 250, .13);
}
.btn-primary,
button.btn-primary,
input[type="submit"].button.mainaction {
  background-color: #08c8e6;
  border-color: #08c8e6;
  color: #041323;
}
.btn-primary:hover,
button.btn-primary:hover {
  background-color: #43e8fa;
  border-color: #43e8fa;
  color: #041323;
}
a:focus-visible,
button:focus-visible,
input:focus-visible {
  outline: 2px solid var(--corbady-cyan);
  outline-offset: 2px;
}
.messagelist tr.selected td,
.messagelist tr.selected:hover td,
.listing tbody tr.selected td {
  border-left-color: var(--corbady-cyan);
}

/* Dark-mode surface, keeping the inbox legible. */
body.dark-mode #layout,
html.dark-mode body #layout {
  --corbady-surface: #0b1428;
}
body.dark-mode #layout-sidebar,
body.dark-mode #layout-list,
html.dark-mode #layout-sidebar,
html.dark-mode #layout-list {
  border-color: #243452;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Corbady Mail — fondo eléctrico para el acceso */
body:has(#login-form) {
    background:
        radial-gradient(
            ellipse at 20% 20%,
            rgba(0, 195, 255, 0.25),
            transparent 45%
        ),
        radial-gradient(
            ellipse at 85% 80%,
            rgba(170, 0, 255, 0.30),
            transparent 45%
        ),
        linear-gradient(
            135deg,
            #030714 0%,
            #101b3a 50%,
            #08051c 100%
        ) !important;

    background-attachment: fixed !important;
}

/* Resplandor del formulario */
body:has(#login-form) #login-form {
    box-shadow:
        0 0 35px rgba(0, 225, 255, 0.30),
        0 0 75px rgba(145, 0, 255, 0.20),
        0 20px 50px rgba(0, 0, 0, 0.45) !important;

    border-radius: 20px;
}

/* Corbady Mail — permitir ver el fondo eléctrico */
body:has(#login-form) #layout,
body:has(#login-form) #layout-content {
    background: transparent !important;
}

/* Corbady Mail — logotipo destacado */
body:has(#login-form) #logo {
    width: 190px !important;
    height: 190px !important;
    max-width: 190px !important;
    object-fit: contain;
    filter: drop-shadow(0 0 22px rgba(0, 220, 255, 0.45));
}

/* Nombre visible sobre fondo oscuro */
body:has(#login-form) #login-form .formbuttons,
body:has(#login-form) #login-form .footer {
    color: #ffffff !important;
}

/* Corbady Mail — tamaño y brillo del logo */
#layout-content > img#logo {
    display: block !important;
    width: 190px !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 auto 18px !important;

    filter:
        drop-shadow(0 0 16px rgba(0, 225, 255, 0.55))
        drop-shadow(0 0 30px rgba(155, 40, 255, 0.35));
}

/* Nombre de Corbady Mail más legible */
body:has(#login-form) #login-footer {
    color: #e5faff !important;
}

/* Corbady Mail — formulario más amplio */
body:has(#login-form) #login-form {
    width: min(520px, calc(100vw - 40px)) !important;
    max-width: 520px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Aprovechar todo el ancho del formulario */
body:has(#login-form) #login-form table {
    width: 100% !important;
}

/* Corbady Mail — acabado luminoso del formulario */
body:has(#login-form) #login-form {
    border: 1px solid rgba(0, 225, 255, 0.55) !important;
    border-radius: 22px !important;

    background: linear-gradient(
        145deg,
        rgba(8, 20, 48, 0.90),
        rgba(39, 9, 69, 0.90)
    ) !important;

    box-shadow:
        0 0 0 1px rgba(155, 50, 255, 0.20),
        0 0 24px rgba(0, 215, 255, 0.20),
        0 0 45px rgba(145, 0, 255, 0.14),
        0 18px 45px rgba(0, 0, 0, 0.35) !important;

    overflow: hidden;
}

/* Resalte del botón al pasar el mouse */
body:has(#login-form) #login-form button[type="submit"],
body:has(#login-form) #login-form input[type="submit"] {
    transition: background-color 0.2s ease,
                box-shadow 0.2s ease;
}

body:has(#login-form) #login-form button[type="submit"]:hover,
body:has(#login-form) #login-form input[type="submit"]:hover {
    background-color: #36e6ff !important;
    box-shadow: 0 0 20px rgba(0, 225, 255, 0.45);
}

/* CORBADY MAIL — INTERIOR NEON */

/* Barra principal de navegación */
#taskmenu {
    background: linear-gradient(
        180deg,
        #071328 0%,
        #10294a 55%,
        #160d35 100%
    ) !important;

    border-right: 1px solid rgba(0, 225, 255, 0.35) !important;
}

/* Iconos y opciones */
#taskmenu a {
    transition: background-color 0.2s ease,
                box-shadow 0.2s ease;
}

/* Opción seleccionada */
#taskmenu a.selected {
    background: rgba(0, 220, 255, 0.18) !important;
    box-shadow: inset 3px 0 0 #00e5ff !important;
}

/* Resplandor al pasar el mouse */
#taskmenu a:hover {
    background: rgba(0, 225, 255, 0.13) !important;
}

/* Carpeta seleccionada */
#layout-sidebar .selected,
#layout-sidebar .selected a {
    background-color: #e0f5ff !important;
    color: #082b48 !important;
}

/* Detalle eléctrico en los bordes */
#layout-sidebar {
    border-right: 1px solid rgba(0, 180, 230, 0.25) !important;
}

/* CORBADY MAIL — BARRAS DE HERRAMIENTAS */
#layout .toolbar:not(#taskmenu){
    background: linear-gradient(
        90deg,
        #eefaff 0%,
        #f2f3ff 65%,
        #f8f5ff 100%
    ) !important;

    border-bottom: 1px solid #b7deed !important;
}

/* Botones de las herramientas */
#layout .toolbar a,
#layout .toolbar button {
    border-radius: 8px;
    transition: background-color 0.2s ease;
}

/* Resalte al pasar el puntero */
#layout .toolbar a:hover,
#layout .toolbar button:hover {
    background-color: rgba(0, 195, 235, 0.15) !important;
}

/* CORBADY MAIL — PANEL DE CARPETAS */
#layout-sidebar {
    background: linear-gradient(
        180deg,
        #f1fbff 0%,
        #edf4ff 55%,
        #f5efff 100%
    ) !important;

    border-right: 1px solid #a9d7ed !important;
}

/* Carpeta activa */
#layout-sidebar .selected,
#layout-sidebar .selected a {
    background: #d5f3ff !important;
    color: #073451 !important;
}

/* Separación entre carpetas */
#layout-sidebar .listing li,
#layout-sidebar .listing tr {
    border-bottom-color: rgba(32, 135, 185, 0.12) !important;
}

/* CORBADY MAIL — LISTA DE MENSAJES */

/* Fondo general de la columna */
#layout-list {
    background: #fbfdff !important;
    border-right: 1px solid #c2dce9 !important;
}

/* Filas de mensajes */
#messagelist tr {
    border-bottom: 1px solid #e0edf5 !important;
}

/* Mensaje seleccionado */
#messagelist tr.selected,
#messagelist tr.selected td {
    background: #dff5ff !important;
    color: #073550 !important;
}

/* Indicador eléctrico del mensaje activo */
#messagelist tr.selected {
    box-shadow: inset 3px 0 0 #00cfee !important;
}

/* =====================================
   CORBADY MAIL — MODO OSCURO
   ===================================== */

/* Panel de carpetas */
html.dark-mode #layout-sidebar {
    background: linear-gradient(
        180deg,
        #101e36 0%,
        #151d3d 60%,
        #211339 100%
    ) !important;

    border-right: 1px solid #235d7a !important;
}

/* Textos de las carpetas */
html.dark-mode #layout-sidebar a {
    color: #dcecff !important;
}

/* Carpeta seleccionada */
html.dark-mode #layout-sidebar .selected,
html.dark-mode #layout-sidebar .selected a {
    background: #17405b !important;
    color: #ffffff !important;
}

/* Columna de mensajes */
html.dark-mode #layout-list {
    background: #142338 !important;
    border-right: 1px solid #28506b !important;
}

/* Mensaje seleccionado */
html.dark-mode #messagelist tr.selected,
html.dark-mode #messagelist tr.selected td {
    background: #174866 !important;
    color: #ffffff !important;
}

/* Barra de herramientas */
html.dark-mode #layout .toolbar:not(#taskmenu) {
    background: #18283d !important;
    border-bottom: 1px solid #305575 !important;
}

/* Iconos y textos de las herramientas */
html.dark-mode #layout .toolbar:not(#taskmenu) a,
html.dark-mode #layout .toolbar:not(#taskmenu) button {
    color: #e5f1ff !important;
}