/* ── Profile Module ──────────────────────────────────────────────────────── */

.r33-age-display {
    font-size: 20px;
    font-weight: 700;
    color: #c9a84c;
    padding: 8px 0;
}

/* ── Language widget ──────────────────────────────────────────────────────── */

.r33-lang-widget {
    position: relative;
}

.r33-lang-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    min-height: 42px;
    cursor: text;
    padding: 6px 10px;
}

.r33-lang-search {
    border: none;
    outline: none;
    background: transparent;
    font-size: inherit;
    color: inherit;
    flex: 1 1 120px;
    min-width: 80px;
    padding: 2px 0;
}

.r33-lang-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--r33-accent, #c8a96e);
    color: #fff;
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 0.82rem;
    white-space: nowrap;
}

.r33-lang-tag-remove {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    padding: 0;
    font-size: 0.75rem;
    line-height: 1;
    opacity: 0.8;
}
.r33-lang-tag-remove:hover { opacity: 1; }

.r33-lang-dropdown {
    position: absolute;
    z-index: 200;
    background: var(--r33-card-bg, #1e1e1e);
    border: 1px solid var(--r33-border, #333);
    border-radius: 6px;
    margin-top: 4px;
    padding: 4px 0;
    list-style: none;
    max-height: 200px;
    overflow-y: auto;
    min-width: 180px;
    box-shadow: 0 4px 12px rgba(0,0,0,.35);
}

.r33-lang-option {
    padding: 8px 14px;
    cursor: pointer;
    font-size: 0.9rem;
    color: var(--r33-text, #eee);
}
.r33-lang-option:hover {
    background: var(--r33-hover, #2a2a2a);
}

/* ── Language widget ──────────────────────────────────────────────────────── */

.r33-lang-widget {
    position: relative;
}

.r33-lang-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    min-height: 42px;
    cursor: text;
    padding: 6px 10px;
    border: 1px solid var(--r33-border, #333);
    border-radius: 6px;
    background: var(--r33-input-bg, #1a1a1a);
}

.r33-lang-search {
    border: none;
    outline: none;
    background: transparent;
    font-size: inherit;
    color: inherit;
    flex: 1 1 120px;
    min-width: 80px;
    padding: 2px 0;
}

.r33-lang-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--r33-accent, #c8a96e);
    color: #fff;
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 0.82rem;
    white-space: nowrap;
}

.r33-lang-tag-remove {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    padding: 0;
    font-size: 0.75rem;
    line-height: 1;
    opacity: 0.8;
}
.r33-lang-tag-remove:hover { opacity: 1; }

.r33-lang-dropdown {
    position: absolute;
    z-index: 200;
    background: var(--r33-card-bg, #1e1e1e);
    border: 1px solid var(--r33-border, #333);
    border-radius: 6px;
    margin-top: 4px;
    padding: 4px 0;
    list-style: none;
    max-height: 200px;
    overflow-y: auto;
    min-width: 180px;
    box-shadow: 0 4px 12px rgba(0,0,0,.35);
}

.r33-lang-option {
    padding: 8px 14px;
    cursor: pointer;
    font-size: 0.9rem;
    color: var(--r33-text, #eee);
}
.r33-lang-option:hover {
    background: var(--r33-hover, #2a2a2a);
}