:root {
    --bg-main: #f5f7ff;
    --ink: #13213a;
    --primary: #0f5fd8;
    --accent: #f98f2d;
    --card: #ffffff;
}

* {
    font-family: "Manrope", sans-serif;
}

body {
    background: radial-gradient(circle at top left, #dbe9ff, var(--bg-main) 45%, #fff5e7);
    color: var(--ink);
    min-height: 100vh;
}

.nav-theme {
    background: linear-gradient(90deg, #112a52, #1f4b95);
}

.nav-theme .navbar-brand,
.nav-theme .nav-link {
    color: #fff;
}

.nav-theme .nav-link:hover {
    color: #ffd1a0;
}

.admin-menu-btn {
    min-width: 2.2rem;
    font-weight: 700;
}

.card-doc {
    border-radius: 1rem;
}

.preview-box {
    background: #f8f9ff;
    border: 1px solid #e6eaf8;
    border-radius: 0.6rem;
    padding: 0.75rem;
    font-size: 0.8rem;
    white-space: pre-wrap;
    max-height: 170px;
    overflow: auto;
}

.preview-frame {
    width: 100%;
    min-height: 75vh;
    border: 1px solid #dde5f4;
    border-radius: 10px;
}

.preview-frame-card {
    width: 100%;
    height: 190px;
    border: 1px solid #dde5f4;
    border-radius: 10px;
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
    background: #fff;
}

.preview-image-card {
    width: 100%;
    height: 190px;
    object-fit: contain;
    border: 1px solid #dde5f4;
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
    background: #fff;
}

.rich-preview-card {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
    border: 1px solid #dde5f4;
    border-radius: 10px;
    background: #fff;
    overflow: auto;
    max-height: 210px;
    padding: 0.5rem;
}

.rich-preview-full {
    border: 1px solid #dde5f4;
    border-radius: 10px;
    background: #fff;
    overflow: auto;
    max-height: 75vh;
    padding: 1rem;
}

.excel-preview-wrap {
    overflow: auto;
}

.excel-preview-table th,
.excel-preview-table td {
    white-space: nowrap;
    font-size: 0.82rem;
}

.docx-rich-preview p,
.docx-rich-preview li,
.docx-rich-preview td {
    font-size: 0.92rem;
}

.rules-content {
    line-height: 1.7;
}

.ticker-wrap {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #111d37;
    color: #fff;
    display: flex;
    align-items: center;
    overflow: hidden;
    z-index: 999;
    border-top: 2px solid #2f5cb8;
}

.ticker-label {
    background: var(--accent);
    color: #1a1104;
    font-weight: 800;
    padding: 0.65rem 1rem;
    white-space: nowrap;
}

.ticker-track {
    display: inline-flex;
    gap: 2rem;
    padding-left: 100%;
    animation: ticker-scroll 30s linear infinite;
}

.ticker-item {
    white-space: nowrap;
    font-size: 0.95rem;
    padding-right: 1rem;
}

.chat-widget-btn {
    position: fixed;
    right: 18px;
    bottom: 58px;
    z-index: 1100;
    border: none;
    border-radius: 999px;
    padding: 0.6rem 0.95rem;
    background: #0f5fd8;
    color: #fff;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(15, 95, 216, 0.35);
}

.chat-widget-panel {
    position: fixed;
    right: 18px;
    bottom: 108px;
    width: min(360px, calc(100vw - 24px));
    height: 460px;
    background: #fff;
    border: 1px solid #d7e0f6;
    border-radius: 14px;
    box-shadow: 0 14px 30px rgba(10, 28, 68, 0.28);
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.chat-widget-head {
    background: #173f84;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 0.75rem;
}

.chat-widget-messages {
    flex: 1;
    overflow: auto;
    padding: 0.75rem;
    background: #f6f8ff;
}

.chat-widget-form {
    display: flex;
    gap: 0.4rem;
    padding: 0.65rem;
    border-top: 1px solid #e3e9fb;
}

.chat-msg {
    margin-bottom: 0.5rem;
    padding: 0.5rem 0.6rem;
    border-radius: 8px;
    font-size: 0.88rem;
    white-space: pre-wrap;
}

.chat-msg.user {
    background: #dce8ff;
}

.chat-msg.bot {
    background: #ffffff;
    border: 1px solid #dbe3f7;
}

.past-event-card {
    opacity: 0.75;
}

.fc .past-event .fc-event-main {
    text-decoration: line-through;
    opacity: 0.75;
}

@keyframes ticker-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

@media (max-width: 768px) {
    .ticker-item {
        font-size: 0.8rem;
    }
    .chat-widget-panel {
        right: 8px;
        bottom: 102px;
    }
    .chat-widget-btn {
        right: 8px;
    }
}