/* Compact account controls and consistent inbox attention in every theme. */
.profile-photo-group { min-width:0; margin:6px 0; padding:12px; border:1px solid var(--border); border-radius:16px; }
.profile-photo-group legend { padding:0 7px; font-size:.9rem; font-weight:700; }
.profile-photo-group .profile-photo-actions { margin:0; gap:8px; flex-wrap:wrap; }
.profile-photo-group .soft-button { display:flex; align-items:center; justify-content:center; flex:1 1 0; min-width:0; min-height:44px; padding:7px 4px; gap:4px; font-size:.75rem; --clx-icon-size:18px; }
.profile-photo-group .soft-button::before { margin:0; }
.profile-photo-group .section-note { margin:10px 0 0; font-size:.75rem; }
.profile-name-row { display:flex; align-items:stretch; gap:8px; width:calc(100% - 16px); }
.profile-name-row input { width:0; min-width:0; min-height:44px; flex:1; border-radius:12px; }
#profileSaveNameBtn { display:grid; place-items:center; flex:0 0 44px; width:44px; min-height:44px; padding:9px; border-radius:12px; background:linear-gradient(145deg,#327bfa,#345ad0); border-color:#4168d8; color:#fff; box-shadow:inset 0 1px 1px #b7dcff88,0 3px 0 #2e4fb0; }
#profileSaveNameBtn svg { width:24px; height:24px; }
.auth-tab.auth-tab-register { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; }
.auth-tab-register .tab-paren { display:block; margin:0; white-space:nowrap; line-height:1.2; }
.auth-form .field-group small { color:var(--muted); font-size:.8rem; font-weight:400; }
.history-item .history-actions { flex:0 0 auto; display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.history-item .history-action { flex:0 0 44px; width:44px; height:44px; min-height:44px; min-width:44px; padding:7px; border-radius:11px; --clx-icon-size:22px; }
.history-item .history-action svg { display:block; width:22px; height:22px; margin:auto; }
.history-item .history-action.has-3d > svg, .history-item .history-action.has-minimal > svg { display:none; }
/* The two message chips of a contact are always there; the red badge with
   the number of messages not yet played sits on the chip's corner. */
.history-item .history-chips { display:contents; }
.history-item .history-chip { position:relative; flex:0 0 44px; width:44px; display:grid; place-items:center; height:44px; min-height:44px; padding:7px; gap:0; border-radius:11px; --clx-icon-size:22px; overflow:visible; }
.history-item .history-chip svg { width:22px; height:22px; }
.history-chip.has-3d::before, .history-chip.has-minimal::before { margin:0; }
.history-chip.has-3d > svg, .history-chip.has-minimal > svg { display:none; }
/* The number of messages on a chip: quiet once they have all been played,
   red while one is still new. */
.history-chip-badge { position:absolute; top:-6px; right:-6px; z-index:1; display:inline-grid; place-items:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; box-shadow:0 0 0 2px var(--surface-strong); background:#4a5b76; color:#fff; font-size:11px; font-weight:700; line-height:1; letter-spacing:0; font-variant-numeric:tabular-nums; pointer-events:none; }
.history-chip.has-new .history-chip-badge { background:#dc2626; }
[data-theme="graphite"] .history-chip-badge { background:#3b4f66; color:#e6f0fa; box-shadow:0 0 0 2px #1e2735; }
[data-theme="graphite"] .history-chip.has-new .history-chip-badge { background:#ff4d6d; color:#1a0509; }
[data-theme="minimal"] .history-chip-badge { background:#5d6b7c; box-shadow:0 0 0 2px #fff; }
[data-theme="minimal"] .history-chip.has-new .history-chip-badge { background:#dc2626; }
.call-log-icon { color:#2369c9; }
[data-theme="graphite"] .call-log-icon { color:#b6d9f2; }
.missed-call-row.is-new, .detail-row.is-new { position:relative; border:1px solid #87bafa; border-inline-start:4px solid #286bcb; background:#eaf3ff; opacity:1; }
.missed-call-row.is-new strong, .detail-row.is-new strong { padding-inline-end:38px; }
.inbox-new { position:absolute; top:10px; right:10px; border-radius:999px; padding:3px 6px; font-size:10px !important; font-weight:800; line-height:1.2; background:#245cb5; color:#fff !important; }
[data-theme="graphite"] :is(.missed-call-row.is-new,.detail-row.is-new) { background:#1b334c; border-color:#628eb5; border-inline-start-color:#9cceff; color:#f1f5fc; }
[data-theme="graphite"] .inbox-new { background:#b1dbf4; color:#10263b !important; }
[data-theme="minimal"] :is(.missed-call-row.is-new,.detail-row.is-new) { background:#f0f5fc; box-shadow:none; }
.name-reminder { flex:0 0 auto; display:grid; grid-template-columns:minmax(0,1fr) 76px 44px; align-items:center; gap:4px; padding:4px 8px; border:1px solid #b6d1f4; border-radius:14px; background:#eef6ff; color:#244975; font-size:.8rem; }
.name-reminder-actions { display:contents; }
.name-reminder button { min-height:44px; border:0; border-radius:9px; padding:4px 6px; cursor:pointer; font:inherit; background:transparent; color:inherit; }
.name-reminder #chooseNameBtn { background:#285fc0; color:#fff; font-weight:700; }
#closeNameReminderBtn { width:44px; font-size:22px; }
[data-theme="graphite"] .name-reminder { background:#17283b; border-color:#517291; color:#d6e9ff; }
[data-theme="minimal"] .name-reminder { background:#f5f7fa; border-color:#dce1e7; color:#263342; }
@media (max-width:600px) {
 .history-item .history-actions { justify-content:flex-end; }
}
@media (max-height:500px) {
 .name-reminder { font-size:.75rem; }
}
/* Sign-up: the terms of use, and the links to the site of Callixy (2.27.0). */
.terms-consent { display:flex; align-items:flex-start; gap:10px; margin:2px 0 4px; color:var(--muted); font-size:.86rem; line-height:1.45; cursor:pointer; }
.terms-consent input { flex:0 0 auto; width:20px; height:20px; margin:1px 0 0; accent-color:var(--primary); }
.terms-consent input[aria-invalid="true"] { outline:2px solid #dc2626; outline-offset:2px; }
.terms-consent a, .legal-links a { color:var(--primary); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.legal-links { display:flex; flex-wrap:wrap; justify-content:center; gap:6px 16px; margin-top:14px; font-size:.82rem; }
.legal-links a { display:inline-flex; align-items:center; min-height:44px; padding:0 4px; text-decoration:none; color:var(--muted); font-weight:500; }
.legal-links a:hover { color:var(--primary); text-decoration:underline; }
/* Safety (2.27.0): the terms reminder, blocked lines, deleting the line,
   reporting, and the help links of Info. */
.terms-reminder { flex:0 0 auto; display:flex; align-items:center; gap:8px; padding:6px 6px 6px 12px; border:1px solid #f0c66b; border-radius:14px; background:#fff8e6; color:#5b4204; font-size:.8rem; line-height:1.35; }
.terms-reminder p { margin:0; flex:1 1 auto; min-width:0; }
.terms-reminder a { color:inherit; font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.terms-reminder button { flex:0 0 auto; min-height:44px; padding:0 14px; border:0; border-radius:10px; background:#8a5a00; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
[data-theme="graphite"] .terms-reminder { background:#2c2310; border-color:#8a6a2a; color:#f6e2b3; }
[data-theme="minimal"] .terms-reminder { background:#fffbeb; border-color:#e5d3a3; }
.blocked-list { display:grid; gap:8px; }
.blocked-row { display:flex; align-items:center; gap:10px; padding:8px 8px 8px 12px; border:1px solid var(--border); border-radius:14px; background:var(--surface-strong); }
.blocked-copy { display:grid; flex:1 1 auto; min-width:0; }
.blocked-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.blocked-copy span { color:var(--muted); font-size:.82rem; font-variant-numeric:tabular-nums; }
.blocked-unblock { flex:0 0 auto; min-height:44px; padding:0 14px; }
.danger-card { border-color:#f3b3b3; }
.danger-card #deleteAccountBtn { width:100%; min-height:48px; }
[data-theme="graphite"] .danger-card { border-color:#ec819744; }
.primary-button.danger-button { background:linear-gradient(145deg,#dc2626,#b91c1c); border-color:#b91c1c; color:#fff; box-shadow:inset 0 1px 1px #ffd0d088, 0 3px 0 #8a1414, 0 7px 16px #dc262622; }
.delete-account-list { margin:0 0 10px; padding-inline-start:20px; color:var(--text); font-size:.9rem; line-height:1.5; }
.report-card { max-width:520px; }
.report-reasons { display:grid; gap:6px; margin:10px 0 0; padding:0; border:0; }
.report-reasons legend { margin-bottom:6px; font-weight:700; color:var(--text); }
.report-reason { display:flex; align-items:flex-start; gap:10px; padding:9px 12px; border:1px solid var(--border); border-radius:12px; background:var(--surface-strong); cursor:pointer; }
.report-reason:has(input:checked) { border-color:var(--primary); background:var(--primary-soft); }
.report-reason input { flex:0 0 auto; width:18px; height:18px; margin:2px 0 0; accent-color:var(--primary); }
.report-reason span { display:grid; gap:1px; min-width:0; }
.report-reason strong { font-size:.9rem; color:var(--text); }
.report-reason small { color:var(--muted); font-size:.78rem; line-height:1.35; }
.report-details { margin-top:12px; }
.report-details textarea { width:100%; min-height:72px; resize:vertical; font:inherit; }
.report-details small { justify-self:end; }
.report-block { display:flex; align-items:center; gap:10px; min-height:44px; font-weight:600; color:var(--text); cursor:pointer; }
.report-block input { width:20px; height:20px; accent-color:var(--primary); }
.report-error:empty, #deleteAccountError:empty { display:none; }
.call-detail-safety { margin-top:10px; }
.call-detail-safety > button { flex:1 1 0; min-height:44px; }
.legal-card { padding-block:12px; }
.legal-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px 12px; margin-top:6px; }
.legal-grid a { display:flex; align-items:center; min-height:44px; color:var(--primary); font-weight:600; text-decoration:none; }
.legal-grid a:hover { text-decoration:underline; }