/* Tablón de anuncios dentro de la ventana de notificaciones */
.notif-tabs { display: flex; gap: 4px; }
.notif-tabs button { font: 600 13px var(--ff-body); color: var(--text-secondary); background: none; border: 0; border-bottom: 2px solid transparent; padding: 6px 10px; cursor: pointer; }
.notif-tabs button.active { color: var(--text-primary); border-bottom-color: var(--accent-yellow); }
.notif-tabs .tab-n { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 999px; background: #D93025; color: #fff; font: 800 10px/18px var(--ff-body); text-align: center; }
.notif-tabs .tab-n[hidden] { display: none; }
#tablonList { display: none; }
.tb-toolbar { padding: 12px 18px 4px; }
.tb-card { padding: 12px 18px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background .15s; }
.tb-card:hover, .tb-card:focus-visible { background: var(--bg-card); outline: none; }
.tb-card.pinned { border-left: 3px solid var(--accent-yellow); }
.tb-card.unread { background: rgba(201,168,76,.07); }
.tb-card-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.tb-title { font-weight: 700; font-size: 13.5px; }
.tb-dot { width: 9px; height: 9px; border-radius: 50%; background: #D93025; flex: none; }
.tb-meta { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.tb-preview { margin-top: 6px; font-size: 12.5px; color: var(--text-secondary); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; }
.tb-admin { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; cursor: default; }
.tb-chip { font-size: 10.5px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border); color: var(--text-secondary); background: var(--bg-main); }
.tb-chipbtn { cursor: pointer; font-family: inherit; }
.tb-chipbtn:hover { border-color: var(--accent-yellow); }
.tb-spacer { flex: 1; }
.tb-link { font: 600 11px var(--ff-body); background: none; border: 0; color: var(--accent-yellow); cursor: pointer; padding: 2px 4px; }
.tb-link.danger { color: #ff8a80; }
.tb-empty { text-align: center; padding: 34px 18px; color: var(--text-muted); font-size: 13px; }
dialog.aul-tablon { padding: 0; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-card); color: var(--text-primary); width: min(640px, calc(100% - 28px)); max-height: calc(100dvh - 40px); overflow: auto; margin: auto; }
dialog.aul-tablon::backdrop { background: rgba(0,0,0,.65); }
.aul-tablon .tb-dialog-body { padding: 24px; }
.aul-tablon .tb-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.aul-tablon h3 { margin: 0; font: 700 18px var(--ff-heading); }
.aul-tablon h4 { margin: 16px 0 6px; font-size: 13px; }
.aul-tablon .tb-text { margin: 14px 0; line-height: 1.65; font-size: 14px; }
.aul-tablon .tb-text a { color: var(--accent-yellow); word-break: break-all; }
.aul-tablon .tb-field { display: grid; gap: 6px; margin: 12px 0; font-size: 13px; color: var(--text-secondary); }
.aul-tablon input:not([type=checkbox]), .aul-tablon textarea { width: 100%; font: inherit; background: var(--bg-main); border: 1px solid var(--border); color: var(--text-primary); border-radius: 8px; padding: 10px 12px; }
.aul-tablon textarea { resize: vertical; }
.aul-tablon .tb-fs { border: 0; padding: 0; margin: 14px 0 0; }
.aul-tablon .tb-fs legend { font-weight: 700; font-size: 13px; padding: 0; margin-bottom: 8px; }
.aul-tablon .tb-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.aul-tablon .tb-chipcheck { position: relative; cursor: pointer; }
.aul-tablon .tb-chipcheck input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.aul-tablon .tb-chipcheck span { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg-main); font-size: 13px; color: var(--text-secondary); }
.aul-tablon .tb-chipcheck input:checked + span { background: var(--accent-yellow); border-color: var(--accent-yellow); color: #1E1F3A; font-weight: 700; }
.aul-tablon .tb-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: end; }
.aul-tablon .tb-check { display: flex; gap: 8px; align-items: center; font-size: 13px; margin: 12px 0; }
.aul-tablon .tb-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.aul-tablon .tb-list { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.7; }
.aul-tablon .tb-list small { color: var(--text-muted); margin-left: 6px; }
.aul-tablon .tb-error { color: var(--accent-red); margin: 10px 0 0; }
.aul-tablon .tb-danger { border-color: rgba(217,48,37,.55); color: #ff8a80; }
@media (max-width: 600px) { .aul-tablon .tb-two { grid-template-columns: 1fr; } .aul-tablon .tb-dialog-body { padding: 18px; } }
.notif-tabs button { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; padding: 6px 8px; }
.notif-header { gap: 6px; }
.notif-mark-all { white-space: nowrap; flex: none; }
/* Panel de notificaciones más amplio, para que quepa el tablón de anuncios */
#notifPanel.notif-panel { width: 560px; max-height: min(78vh, 760px); }
#notifPanel .tb-preview { -webkit-line-clamp: 4; font-size: 13px; }
#notifPanel .tb-title { font-size: 14.5px; }
