/* ── Plagiarism / AI Detector shared CSS ── */

/* ── Form validation ── */
#plagiarism-description:invalid { box-shadow: none !important; }
#plagiarism-description:invalid:not(:focus):placeholder-shown { border-color: #d1d5db; }
.dark #plagiarism-description:invalid:not(:focus):placeholder-shown { border-color: #474746; }

/* Character counter */
.plag-char-hint { font-size: 12px; text-align: right; margin-top: 5px; }

/* Advance-options chevron */
.plag-chevron { transition: transform 0.2s ease; }
.plag-adv-open .plag-chevron { transform: rotate(180deg); }

/* ── Risk dot colours (replaces inline style="background:...") ── */
.plag-risk-dot--high   { background-color: #E22861; }
.plag-risk-dot--medium { background-color: #F59E0B; }
.plag-risk-dot--low    { background-color: #10B981; }

/* ── Percentage pills ── */
.plag-pct-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 99px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    line-height: 1.6;
}
.plag-pct-pill--bad  { background: rgba(226,40,97,0.09);  color: #C8184F; }
.plag-pct-pill--warn { background: rgba(245,158,11,0.10); color: #92650A; }
.plag-pct-pill--good { background: rgba(16,185,129,0.10); color: #047857; }

/* ── Gauge ── */
.plag-gauge-container {
    position: relative;
    width: 136px;
    height: 136px;
    margin: 0 auto;
}
.plag-gauge-svg {
    transform: rotate(-90deg);
    display: block;
    width: 136px;
    height: 136px;
}

.plag-gauge-bg {
    fill: none;
    stroke: #f0f0f0;
    stroke-width: 7;
}
.dark .plag-gauge-bg { stroke: #333332; }

.plag-gauge-fill {
    fill: none;
    stroke: url(#plag-gradient);
    stroke-width: 7;
    stroke-linecap: round;
    transition: stroke-dashoffset 1.2s cubic-bezier(0.4,0,0.2,1);
}

.plag-gauge-text {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
    white-space: nowrap;
}
.plag-gauge-value {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.5px;
}
.plag-gauge-unit {
    font-size: 11px;
    font-weight: 500;
    opacity: 0.5;
}
.plag-gauge-label {
    font-size: 9.5px;
    font-weight: 700;
    color: #898989;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 2px;
}

/* ── Risk bar animation ── */
.plag-bar-animate {
    animation: plag-bar-grow 1s cubic-bezier(0.4,0,0.2,1) forwards;
    transform-origin: left;
}
@keyframes plag-bar-grow {
    from { width: 0 !important; }
}

/* ── Content text box ── */
.plag-content-box {
    background: #FAFAFA;
    border: 1px solid #EBEBEB;
    border-radius: 10px;
    padding: 18px 20px;
    font-size: 13.5px;
    line-height: 1.85;
    color: #141414;
    white-space: pre-wrap;
    max-height: 380px;
    overflow-y: auto;
    font-family: inherit;
}
.dark .plag-content-box {
    background: #2f2f2e;
    border-color: #474746;
    color: #e2e2e2;
}

/* ── Source link ── */
.plag-source-link {
    font-size: 13px;
    font-weight: 600;
    color: #141414;
    word-break: break-all;
    text-decoration: none;
}
.plag-source-link:hover { text-decoration: underline; }
.dark .plag-source-link { color: #fff; }

/* ── Source cards ── */
.plag-source-card {
    background: #fafafa;
    border: 1px solid #e8e8e8;
    border-radius: 12px;
    padding: 13px 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.dark .plag-source-card { background: #2f2f2e; border-color: #474746; }
.plag-source-card:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.06); }

.plag-source-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.plag-source-info   { flex: 1; min-width: 0; }

.plag-source-meta {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
}
.dark .plag-source-meta { border-color: #3f3f3e; }

.plag-meta-item  { display: flex; flex-direction: column; gap: 2px; }
.plag-meta-label { font-size: 10px; font-weight: 600; color: #898989; text-transform: uppercase; letter-spacing: 0.5px; }
.plag-meta-value { font-size: 12.5px; color: #141414; font-weight: 600; }
.dark .plag-meta-value { color: #e2e2e2; }

/* ── Utility ── */
.line-clamp-1 { display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* Custom scrollbar */
.custom-scrollbar::-webkit-scrollbar       { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #ddd; border-radius: 99px; }
.dark .custom-scrollbar::-webkit-scrollbar-thumb { background: #474746; }