/* =================================================================
   AcadVerify — Custom Stylesheet (extends AdminLTE 4 / Bootstrap 5)
   ================================================================= */

:root {
    --av-primary:   #1a56db;
    --av-success:   #27ae60;
    --av-warning:   #f39c12;
    --av-danger:    #e74c3c;
    --av-dark:      #1e2530;
}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* ---- Brand ---------------------------------------------------- */
.brand-link .brand-text { font-weight: 700; }

/* ---- Verdict badges ------------------------------------------ */
.badge-PASS   { background-color: var(--av-success); color: #fff; }
.badge-REVIEW { background-color: var(--av-warning);  color: #fff; }
.badge-FAIL   { background-color: var(--av-danger);   color: #fff; }

.verdict-pill {
    display: inline-flex;
    align-items: center;
    padding: .35rem 1rem;
    border-radius: 50px;
    font-weight: 600;
    font-size: .85rem;
    letter-spacing: .5px;
}

/* ---- Score meter --------------------------------------------- */
.score-meter {
    height: 8px;
    border-radius: 4px;
    background: #e9ecef;
    overflow: hidden;
}
.score-meter-fill {
    height: 100%;
    border-radius: 4px;
    transition: width .5s ease;
}
.score-meter-fill.low    { background: var(--av-success); }
.score-meter-fill.medium { background: var(--av-warning); }
.score-meter-fill.high   { background: var(--av-danger); }

/* ---- Submission step wizard ---------------------------------- */
.step-wizard {
    display: flex;
    align-items: center;
    margin-bottom: 2rem;
}
.step-wizard .step {
    flex: 1;
    text-align: center;
    position: relative;
}
.step-wizard .step::after {
    content: '';
    position: absolute;
    top: 20px;
    left: 50%;
    width: 100%;
    height: 2px;
    background: #dee2e6;
}
.step-wizard .step:last-child::after { display: none; }
.step-wizard .step.active .step-icon  { background: var(--av-primary); color: #fff; }
.step-wizard .step.done   .step-icon  { background: var(--av-success); color: #fff; }
.step-wizard .step-icon {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: #e9ecef;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    margin-bottom: .5rem;
    position: relative;
    z-index: 1;
}

/* ---- Package cards ------------------------------------------- */
.package-card {
    border: 2px solid #dee2e6;
    border-radius: .75rem;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s;
}
.package-card:hover,
.package-card.selected {
    border-color: var(--av-primary);
    box-shadow: 0 0 0 3px rgba(26,86,219,.15);
}
.package-card .package-price {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--av-primary);
}

/* ---- Certificate preview card -------------------------------- */
.cert-code-display {
    font-family: 'Courier New', monospace;
    font-size: 1.1rem;
    letter-spacing: 2px;
    background: #f8f9fa;
    padding: .5rem 1rem;
    border-radius: .5rem;
    border: 1px dashed #ced4da;
}

/* ---- Similarity highlight (results page) --------------------- */
.highlight-local   { background-color: rgba(243,156,18,.25); }
.highlight-turnitin{ background-color: rgba(231,76,60,.2);   }

/* ---- Ranking leaderboard ------------------------------------- */
.rank-self-row { background-color: rgba(26,86,219,.07) !important; font-weight: 600; }
.rank-badge { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; font-weight:700; font-size:.9rem; }
.rank-badge.gold   { background:#ffd700; color:#333; }
.rank-badge.silver { background:#c0c0c0; color:#333; }
.rank-badge.bronze { background:#cd7f32; color:#fff; }

/* ---- Upload drop zone ---------------------------------------- */
.upload-dropzone {
    border: 2px dashed #ced4da;
    border-radius: .75rem;
    padding: 3rem;
    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background .2s;
}
.upload-dropzone.dragover,
.upload-dropzone:hover {
    border-color: var(--av-primary);
    background: rgba(26,86,219,.04);
}
.upload-dropzone .upload-icon { font-size: 3rem; color: #adb5bd; }