/*
 * accessibility.css — WCAG 2.2 AA overrides for the larry skin
 * Injected after styles.css via includes/links.html
 * Re-apply this file after apt upgrade roundcube if needed.
 */

/* ── Fix 1: .voice visually-hidden class ─────────────────────────────────
   Add modern clip-path alongside deprecated clip: rect() and prevent
   text wrapping which can expose content outside the 1px box.          */
.voice {
    clip-path: inset(50%);
    white-space: nowrap;
}

/* ── Fix 2: Focus indicators ─────────────────────────────────────────────
   The skin removes outlines and relies on a semi-transparent box-shadow.
   Supplement with a solid 2px outline so focus is always visible at 3:1+
   contrast, regardless of background.                                   */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    outline: 2px solid #017db6;
    outline-offset: 1px;
}

button:focus,
a.button:focus,
input.button:focus,
a:focus {
    outline: 2px solid #017db6;
    outline-offset: 2px;
}

/* Table cells and list items that receive programmatic focus */
td:focus,
tr:focus,
li:focus {
    outline: 2px solid #017db6;
    outline-offset: -1px;
}

/* ── Fix 3: Login form label contrast ───────────────────────────────────
   #cecece on white is ~1.6:1. Override to #595959 which is ~7:1.       */
#login-form td.title {
    color: #595959;
}

/* ── Fix 4: Disabled button contrast ────────────────────────────────────
   #aaa on #f7f7f7 is ~3.5:1. Override to #767676 which meets 4.5:1.   */
button[disabled],
button[disabled]:hover,
input.button[disabled],
input.button[disabled]:hover,
input.button.mainaction[disabled] {
    color: #767676 !important;
}

/* ── Fix 5: Error notification colour in dark message stack ─────────────
   #ff615d on the dark background is ~3.5:1. Lighten to pass 4.5:1.    */
#messagestack div.error {
    color: #ff8c8a;
}