/* ERP Sync Bridge — Frontend Widget Styles
   Works alongside TannIvan_Theme without conflict.
   All classes prefixed with erp- to avoid collisions.
*/

/* ── Common ────────────────────────────────────────────────── */
.erp-notice-board,
.erp-events-widget,
.erp-leaderboard {
    font-family: 'Inter', 'Segoe UI', sans-serif;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #E5E7EB;
    background: #fff;
    margin-bottom: 1.5rem;
}

/* ── Notice Board ──────────────────────────────────────────── */
.erp-nb__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #1A5200 0%, #2E8B00 100%);
    color: #fff;
}
.erp-nb__icon  { font-size: 1.1rem; }
.erp-nb__title { font-weight: 700; font-size: 1rem; flex: 1; }
.erp-nb__powered { font-size: 0.7rem; opacity: 0.75; white-space: nowrap; }

.erp-nb__list { padding: 0.625rem; display: flex; flex-direction: column; gap: 0.5rem; }

.erp-nb__item {
    padding: 0.75rem 1rem;
    border-radius: 6px;
    transition: transform 0.12s;
}
.erp-nb__item:hover { transform: translateX(2px); }

.erp-nb__item-top {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
    flex-wrap: wrap;
}

.erp-nb__badge {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 99px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.erp-nb__pin    { font-size: 0.75rem; }
.erp-nb__date   { font-size: 0.72rem; color: #9CA3AF; margin-left: auto; }

.erp-nb__expiry--urgent {
    font-size: 0.7rem;
    font-weight: 700;
    color: #DC2626;
    animation: erp-blink 1.4s ease-in-out infinite;
}

.erp-nb__item-title {
    font-weight: 600;
    font-size: 0.9rem;
    color: #111827;
    line-height: 1.4;
    margin-bottom: 0.25rem;
}

.erp-nb__item-excerpt {
    font-size: 0.8rem;
    color: #6B7280;
    margin-bottom: 0.35rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.erp-nb__link {
    font-size: 0.78rem;
    font-weight: 600;
    color: #1A5200;
    text-decoration: none;
}
.erp-nb__link:hover { text-decoration: underline; }

.erp-nb__footer {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #F3F4F6;
    text-align: center;
}
.erp-nb__view-all {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1A5200;
    text-decoration: none;
}
.erp-nb__view-all:hover { text-decoration: underline; }
.erp-nb__empty {
    padding: 2rem;
    text-align: center;
    color: #9CA3AF;
    font-size: 0.875rem;
}

/* ── Events Widget ─────────────────────────────────────────── */
.erp-ev__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #1E3A8A 0%, #2563EB 100%);
    color: #fff;
}
.erp-ev__icon  { font-size: 1.1rem; }
.erp-ev__title { font-weight: 700; font-size: 1rem; }

.erp-ev__list { padding: 0.5rem; display: flex; flex-direction: column; gap: 0; }

.erp-ev__item {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.75rem 0.875rem;
    border-bottom: 1px solid #F3F4F6;
    transition: background 0.1s;
}
.erp-ev__item:last-child { border-bottom: none; }
.erp-ev__item:hover { background: #F9FAFB; }

.erp-ev__date-block {
    min-width: 44px;
    text-align: center;
    background: #EFF6FF;
    border-radius: 8px;
    padding: 0.375rem 0.5rem;
    flex-shrink: 0;
}
.erp-ev__day   { font-size: 1.25rem; font-weight: 800; color: #1E3A8A; line-height: 1; }
.erp-ev__month { font-size: 0.65rem; font-weight: 700; color: #3B82F6; text-transform: uppercase; }

.erp-ev__body   { flex: 1; min-width: 0; }
.erp-ev__item-title {
    font-weight: 600;
    font-size: 0.875rem;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}
.erp-ev__type-icon { font-size: 0.875rem; }

.erp-ev__urgency {
    font-size: 0.68rem;
    font-weight: 700;
    background: #FEF3C7;
    color: #92400E;
    padding: 1px 7px;
    border-radius: 99px;
}

.erp-ev__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-top: 0.25rem;
}
.erp-ev__meta-item {
    font-size: 0.75rem;
    color: #6B7280;
}

.erp-ev__arrow {
    font-size: 1rem;
    color: #9CA3AF;
    text-decoration: none;
    padding: 0.25rem;
    flex-shrink: 0;
    transition: color 0.12s;
}
.erp-ev__arrow:hover { color: #2563EB; }

.erp-ev__footer {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #F3F4F6;
    text-align: center;
}
.erp-ev__view-all {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #2563EB;
    text-decoration: none;
}
.erp-ev__empty {
    padding: 2rem;
    text-align: center;
    color: #9CA3AF;
    font-size: 0.875rem;
}

/* ── Leaderboard ───────────────────────────────────────────── */
.erp-lb__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #78350F 0%, #D97706 100%);
    color: #fff;
}
.erp-lb__icon     { font-size: 1.1rem; }
.erp-lb__title    { font-weight: 700; font-size: 1rem; flex: 1; }
.erp-lb__subtitle { font-size: 0.7rem; opacity: 0.8; }

.erp-lb__list { padding: 0.5rem; display: flex; flex-direction: column; gap: 0; }

.erp-lb__row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border-radius: 6px;
    transition: background 0.1s;
}
.erp-lb__row:hover { background: #FFFBEB; }

.erp-lb__rank {
    min-width: 28px;
    text-align: center;
    font-size: 1.1rem;
}
.erp-lb__rank-num {
    font-weight: 800;
    font-size: 0.875rem;
    color: #6B7280;
}

.erp-lb__avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    flex-shrink: 0;
    border: 2px solid #FDE68A;
}

.erp-lb__info   { flex: 1; min-width: 0; }
.erp-lb__name   { font-weight: 600; font-size: 0.875rem; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.erp-lb__rank-title { font-size: 0.7rem; color: #D97706; font-weight: 600; }

.erp-lb__stats {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    flex-shrink: 0;
}
.erp-lb__xp {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
}
.erp-lb__xp strong { font-size: 0.9rem; font-weight: 800; color: #1A5200; }
.erp-lb__xp span   { font-size: 0.65rem; color: #6B7280; font-weight: 600; }

.erp-lb__streak { font-size: 0.72rem; color: #D97706; }

.erp-lb__badges { display: flex; gap: 0.2rem; }
.erp-lb__badge  { font-size: 0.875rem; }

.erp-lb__empty {
    padding: 2rem;
    text-align: center;
    color: #9CA3AF;
    font-size: 0.875rem;
}

/* ── Keyframes ─────────────────────────────────────────────── */
@keyframes erp-blink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 480px) {
    .erp-ev__meta  { flex-direction: column; gap: 0.25rem; }
    .erp-lb__badges { display: none; }
}