/* ================================================================
   StudentOS — patches51.css
   1.  Profile modal — "Quick Preferences" section styles.
   2.  Settings Identity — ensure the simplified name + button
       layout looks clean with no leftover spacing.
   ================================================================ */

/* ================================================================
   1.  PROFILE MODAL — QUICK PREFERENCES SECTION
   ================================================================ */

#p51-profile-prefs {
    border-top: 1px solid var(--glass-border);
    padding: 14px 24px 10px;
}

.p51-prefs-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    margin-bottom: 10px;
}

.p51-pref-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    gap: 8px;
}

.p51-pref-row + .p51-pref-row {
    border-top: 1px solid rgba(255,255,255,0.05);
}

.p51-pref-left {
    font-size: 0.8rem;
    color: var(--text-main);
    flex: 1;
}

.p51-pref-sub {
    font-size: 0.68rem;
    color: var(--text-muted);
    display: block;
    margin-top: 1px;
}

/* Accent swatches inside profile modal */
.p51-accent-swatches {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

.p51-accent-swatch {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    transition: transform 0.15s, border-color 0.15s;
    flex-shrink: 0;
    padding: 0;
}

.p51-accent-swatch:hover,
.p51-accent-swatch.active {
    transform: scale(1.2);
    border-color: rgba(255,255,255,0.5);
}

.p51-accent-custom {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    padding: 0;
    cursor: pointer;
    border: 2px solid rgba(255,255,255,0.2);
    flex-shrink: 0;
}

/* Font scale buttons inside profile modal */
.p51-scale-group {
    display: flex;
    gap: 4px;
}

.p51-scale-btn {
    font-size: 0.72rem;
    padding: 3px 9px;
    border-radius: 8px;
    background: var(--glass-hover);
    border: 1px solid var(--glass-border);
    color: var(--text-main);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.p51-scale-btn:hover,
.p51-scale-btn.active {
    background: var(--accent);
    color: #ffffff;
    border-color: var(--accent);
}

/* Theme toggle inside profile modal — reuse p48 toggle visual */
.p51-theme-toggle {
    width: 3rem;
    height: 1.5rem;
    border-radius: 9999px;
    background: var(--glass-hover);
    border: 1px solid var(--glass-border);
    position: relative;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    flex-shrink: 0;
    padding: 0;
}

.p51-theme-toggle.on {
    background: var(--accent);
    border-color: var(--accent);
}

.p51-theme-dot {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--text-main);
    position: absolute;
    top: 3px;
    left: 3px;
    transition: transform 0.2s;
    pointer-events: none;
}

.p51-theme-toggle.on .p51-theme-dot {
    transform: translateX(1.5rem);
}

/* ================================================================
   2.  SETTINGS IDENTITY — clean up leftover CSS targeting elements
       that were removed from the HTML.  Belt-and-braces rules
       from patches49 / patches50 are now harmless but we add this
       to be explicit.
   ================================================================ */

/* Ensure no ghost spacing from elements that no longer exist */
.p43-settings-profile {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.p43-settings-profile > input.bare-input {
    margin-bottom: 6px;
}