/* theme-toggle.css */

.theme-switch {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: var(--rounded-r9999);
    border: 1px solid rgba(43,32,21,0.18);
}

.theme-switch__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 28px;
    border: none;
    background: transparent;
    border-radius: var(--rounded-r9999);
    color: var(--ink, #2B2015);
    cursor: pointer;
    line-height: 1;
    font-size: 14px;
    opacity: 0.55;
    transition: background .2s ease, opacity .2s ease, color .2s ease;
}
.theme-switch__btn:hover { opacity: 0.85; }
.theme-switch__btn[aria-pressed="true"] {
    background: #fff;
    opacity: 1;
    color: var(--color-primary, #7700ff);
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

/* dark hero topbar variant (sits on the photographic hero) */
.hero-topbar .theme-switch {
    background: rgba(20,10,35,0.28);
    border-color: rgba(255,255,255,0.25);
}
.hero-topbar .theme-switch__btn { color: rgba(255,255,255,0.75); }
.hero-topbar .theme-switch__btn[aria-pressed="true"] {
    background: rgba(255,255,255,0.95);
    color: var(--color-primary, #7700ff);
}

/* standalone placement used outside the hero (e.g. mobile bar) */
.theme-switch--plain {
    background: var(--surface);
    border-color: var(--border);
}
.theme-switch--plain .theme-switch__btn { color: var(--text-muted); }
.theme-switch--plain .theme-switch__btn[aria-pressed="true"] {
    background: var(--ghost-active);
    color: var(--color-primary);
    box-shadow: none;
}

@media (max-width: 720px) {
    .theme-switch { transform: scale(0.92); }
}