/*
 * ShortU — URL safety check page styles
 * Used in front/services/check.html
 */

/* ── CSS Custom Properties ─────────────────────────────────────────────── */
:root {
    --su-color-primary:    #140c40;
    --su-color-text:       #140c40;

    /* Result card colours */
    --su-check-safe-bg:      #edfaf3;
    --su-check-safe-border:  #09cc7f;
    --su-check-warn-bg:      #fff8e6;
    --su-check-warn-border:  #ffb347;
    --su-check-unknown-bg:   #f0f4ff;
    --su-check-unknown-border: #140c40;

    --su-radius: 10px;
}

/* ── Result card ───────────────────────────────────────────────────────── */
.check-result-card {
    border-radius: var(--su-radius);
    margin-top:    0;
    padding:       20px 24px;
}

.check-result-card.safe {
    background:   var(--su-check-safe-bg);
    border-left:  4px solid var(--su-check-safe-border);
}

.check-result-card.warn {
    background:   var(--su-check-warn-bg);
    border-left:  4px solid var(--su-check-warn-border);
}

.check-result-card.unknown {
    background:   var(--su-check-unknown-bg);
    border-left:  4px solid var(--su-check-unknown-border);
}

/* ── Destination URL ───────────────────────────────────────────────────── */
.check-dest {
    color:      var(--su-color-text);
    font-size:  0.88rem;
    word-break: break-all;
}

/* ── Result header line ────────────────────────────────────────────────── */
.check-result-header {
    font-weight: 700;
    margin:      0 0 8px;
}

.check-result-header--safe { color: #07a868; }
.check-result-header--warn { color: #e07b00; }

/* ── Status meta line ──────────────────────────────────────────────────── */
.check-result-label {
    color:          #646d77;
    font-size:      0.8rem;
    letter-spacing: 0.5px;
    margin:         0 0 4px;
    text-transform: uppercase;
}

.check-result-meta {
    color:     #777777;
    font-size: 0.8rem;
    margin:    10px 0 0;
}

/* ── Inline status badges (inactive / expired) ─────────────────────────── */
.su-badge {
    border-radius: 3px;
    font-size:     0.75rem;
    margin-left:   6px;
    padding:       1px 6px;
}

.su-badge--inactive {
    background: #ee5555;
    color:      #ffffff;
}

.su-badge--expired {
    background: #e99300;
    color:      #ffffff;
    margin-left: 4px;
}

/* ── Hint text below form ──────────────────────────────────────────────── */
.check-hint {
    color:     #646d77;
    font-size: 0.83rem;
}