/* ============================================================
   Theme NQOJ cho DMOJ — tham chieu CSS chung tu NQOJ.
   Chi ap dung khi admin chon theme "NQOJ".
   Khong thay doi cau truc HTML. Font chu do muc chon font quyet dinh.
   Tokens: primary #4046E8, accent #7C3AED, text #1A1A2E,
           muted #6B7280, border #EEF0F6, hover #F6F7FC,
           accent-soft #F1EAFE, table-head #F8F9FD
   ============================================================ */

/* ---- Nen + chu toan trang ---- */
body {
    background: #ffffff !important;
    color: #1A1A2E !important;
}

/* ---- Thanh dieu huong tren: toi -> trang ---- */
nav#page-header.ui.menu.inverted {
    background: #ffffff !important;
    border-bottom: 1px solid #EEF0F6 !important;
    box-shadow: 0 1px 2px rgba(22,34,79,.06) !important;
}
nav#page-header .item {
    color: #1A1A2E !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
}
nav#page-header .item:hover {
    background: #F6F7FC !important;
    color: #1A1A2E !important;
}
nav#page-header .item.active {
    background: #F1EAFE !important;
    color: #7C3AED !important;
}
nav#page-header .ui.dropdown .menu .item {
    color: #1A1A2E !important;
    border-radius: 8px !important;
}
nav#page-header .ui.dropdown .menu .item:hover {
    background: #F6F7FC !important;
}

/* ---- Nut bam: pill, dam ---- */
.ui.button {
    border-radius: 14px !important;
    font-weight: 800 !important;
    box-shadow: 0 1px 2px rgba(22,34,79,.06) !important;
}
.ui.primary.button, .ui.blue.button {
    background: #4046E8 !important;
    color: #ffffff !important;
}
.ui.primary.button:hover, .ui.blue.button:hover,
.ui.primary.button:focus, .ui.blue.button:focus {
    background: #3238c9 !important;
    color: #ffffff !important;
}
.ui.positive.button, .ui.green.button {
    background: #10b981 !important;
    color: #ffffff !important;
}
.ui.negative.button, .ui.red.button {
    background: #f43f5e !important;
    color: #ffffff !important;
}
.ui.basic.button, .ui.basic.buttons .button {
    background: transparent !important;
    box-shadow: 0 0 0 1px #EEF0F6 inset !important;
    color: #1A1A2E !important;
}
.ui.basic.primary.button {
    box-shadow: 0 0 0 1px #4046E8 inset !important;
    color: #4046E8 !important;
}

/* ---- Bang: header nhat, bo goc, hover ---- */
.ui.table {
    border: 1px solid #EEF0F6 !important;
    border-radius: 18px !important;
    box-shadow: 0 1px 2px rgba(22,34,79,.06) !important;
}
.ui.table thead th {
    background: #F8F9FD !important;
    color: #6B7280 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase;
    border-bottom: 1px solid #EEF0F6 !important;
}
.ui.table tbody tr:hover, .ui.selectable.table tbody tr:hover {
    background: #F6F7FC !important;
}
.ui.table td {
    border-top: 1px solid #EEF0F6 !important;
}

/* ---- O nhap: pill mem ---- */
.ui.input > input, .ui.form input[type="text"], .ui.form input[type="password"],
.ui.form input[type="email"], .ui.form input[type="number"], .ui.form input[type="search"],
.ui.form input[type="url"], select, .ui.dropdown {
    border: 1px solid #EEF0F6 !important;
    border-radius: 12px !important;
}
.ui.input > input:focus, .ui.form input:focus, select:focus, textarea:focus {
    border-color: #4046E8 !important;
    box-shadow: 0 0 0 3px rgba(64,70,232,.12) !important;
}
textarea {
    border: 1px solid #EEF0F6 !important;
    border-radius: 14px !important;
}
.ui.search > .prompt {
    border-radius: 999px !important;
}

/* ---- The / card: bo goc lon, phang ---- */
.ui.segment, .ui.segments, .ui.card, .ui.cards > .card {
    border: 1px solid #EEF0F6 !important;
    border-radius: 18px !important;
    box-shadow: 0 1px 2px rgba(22,34,79,.06) !important;
}

/* ---- Tieu de ---- */
.ui.header, h1, h2, h3, h4, h5 {
    color: #1A1A2E !important;
}
.ui.header .sub.header, .ui.headers .sub.header {
    color: #6B7280 !important;
}

/* ---- Lien ket ---- */
a { color: #4046E8; }
a:hover { color: #3238c9; }

/* ---- Nhan / badge: pill pastel ---- */
.ui.label {
    border-radius: 999px !important;
    font-weight: 800 !important;
}
.ui.basic.label {
    background: #F6F7FC !important;
    border: 1px solid #EEF0F6 !important;
    color: #6B7280 !important;
}

/* ---- Thong bao ---- */
.ui.message {
    border-radius: 14px !important;
    box-shadow: 0 1px 2px rgba(22,34,79,.06) !important;
    border: 1px solid #EEF0F6 !important;
}
.ui.info.message, .ui.blue.message {
    background: #F1EAFE !important;
    color: #5b21b6 !important;
}
.ui.positive.message, .ui.success.message, .ui.green.message {
    background: #D1FAE5 !important;
    color: #047857 !important;
}
.ui.negative.message, .ui.error.message, .ui.red.message {
    background: #FCE7F3 !important;
    color: #BE123C !important;
}
.ui.warning.message, .ui.yellow.message {
    background: #FEF3C7 !important;
    color: #B45309 !important;
}

/* ---- Menu phu / tab ---- */
.ui.secondary.menu .active.item {
    background: #F1EAFE !important;
    color: #7C3AED !important;
    border-radius: 12px !important;
}
.ui.tabular.menu .active.item {
    color: #7C3AED !important;
    border-color: #7C3AED !important;
}
.ui.pagination.menu .item {
    border-radius: 12px !important;
    font-weight: 800 !important;
    min-width: 40px !important;
    justify-content: center;
}
.ui.pagination.menu .active.item {
    background: #4046E8 !important;
    color: #ffffff !important;
}

/* ---- Footer: trang ---- */
footer.ui.footer.segment.inverted {
    background: #ffffff !important;
    border-top: 1px solid #EEF0F6 !important;
    color: #6B7280 !important;
}
footer.ui.footer.segment.inverted a {
    color: #6B7280 !important;
}
footer.ui.footer.segment.inverted a:hover {
    color: #4046E8 !important;
}

/* ---- Tien do / thanh AC ---- */
.ui.progress .bar, .ui.progress.success .bar {
    background: linear-gradient(90deg, #4046E8, #7C3AED) !important;
    border-radius: 999px !important;
}
.ui.progress {
    border-radius: 999px !important;
    background: #EEF0F6 !important;
}

/* ---- Bang xep hang / contest: so thu tu noi bat ---- */
.ui.table td.rank {
    font-weight: 900 !important;
    color: #7C3AED !important;
}

/* ---- Modal ---- */
.ui.modal {
    border-radius: 18px !important;
    border: 1px solid #EEF0F6 !important;
}

/* ---- Checkbox / radio accent ---- */
.ui.checkbox input:checked ~ .box:before, .ui.checkbox input:checked ~ label:before {
    background: #4046E8 !important;
    border-color: #4046E8 !important;
}