/* DMK Settings – social-style UI to match your Profile/Posts/Edit Profile tabs */

.dmkset { --gold:#FFC633; --bg:#0f0f0f; --card:#ffffff; --txt:#1f1f1f;
          --muted:#777; --danger:#e03131; --chipOff:#E0E0E0; --chipVerified:#FFF4A3; --chipMonetized:#CBA3FF; }

.dmkset--wrap { max-width: 820px; margin: 24px auto 80px; padding: 0 16px; }

.dmkset-tabs { display: flex; gap: 10px; margin-bottom: 16px; }
.dmkset-tab { appearance:none; border:0; padding:10px 16px; border-radius:12px;
  background:#f2f2f2; color:#5b5b5b; font-weight:700; }
.dmkset-tab.is-active { background:var(--gold); color:#000; }
.dmkset-tab--danger.is-active { background:var(--danger); color:#fff; }

.dmkset-panel { display:none; }
.dmkset-panel.is-active { display:block; }

.dmkset-card { background:var(--card); border-radius:16px; padding:16px; box-shadow:0 8px 24px rgba(0,0,0,.06); margin-bottom:14px; }
.dmkset-card--danger { border:1px solid rgba(224,49,49,.25); }

.dmkset-card__header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.dmkset-card__title { margin:0 0 8px; font-size:18px; }

.dmkset-field { display:block; margin:10px 0 12px; }
.dmkset-field label, .dmkset-field > span { display:block; font-weight:600; margin-bottom:6px; }
.dmkset-field input[type="text"],
.dmkset-field input[type="email"],
.dmkset-field input[type="password"],
.dmkset-field textarea {
  width:100%; border:1px solid #ddd; border-radius:12px; padding:12px 14px; font-size:15px;
  outline: none;
}
.dmkset-field input:disabled, .dmkset-field textarea:disabled { background:#f6f6f6; color:#aaa; }

.dmkset-meter { height:6px; border-radius:4px; background:#eee; margin-top:6px; overflow:hidden; }
.dmkset-meter::after { content:""; display:block; height:100%; width:0%; background:#7bd389; transition:width .25s; }

.dmkset-btn { appearance:none; border:0; background:#1f1f1f; color:#fff; padding:10px 14px; border-radius:12px; font-weight:700; }
.dmkset-btn:hover { opacity:.95; }
.dmkset-btn--outline { background:transparent; border:1px solid #1f1f1f; color:#1f1f1f; }
.dmkset-btn--ghost { background:transparent; color:#1f1f1f; }
.dmkset-btn--danger { background:var(--danger); }

.dmkset-actions { display:flex; gap:10px; flex-wrap:wrap; }

.dmkset-help { color:var(--muted); margin:8px 0 0; font-size:13px; }
.dmkset-note { font-size:12px; margin-top:8px; }
.dmkset-note--danger { color:var(--danger); }

.dmkset-subtitle { color:#333; margin:4px 0 12px; }

.dmkset-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; font-weight:700; font-size:12px; }
.chip--off { background:var(--chipOff); color:#2d2d2d; }
.chip--verified { background:var(--chipVerified); color:#2d2d2d; }
.chip--monetized { background:var(--chipMonetized); color:#2d2d2d; }
.chip--pending { background:#ffe9a3; color:#2d2d2d; }

.dmkset-modal { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.45); padding:16px; z-index:9999; }
.dmkset-modal[hidden] { display:none; }
.dmkset-modal__card { background:#fff; padding:18px; border-radius:14px; width:min(420px, 100%); box-shadow:0 20px 40px rgba(0,0,0,.25); }
.dmkset-modal__title { margin:0 0 8px; }
.dmkset-modal__close { margin-top:8px; }

.dmkset-toast { position:fixed; bottom:18px; left:50%; transform:translateX(-50%); z-index:10000; }
.dmkset-toast .msg { background:#1f1f1f; color:#fff; padding:10px 14px; border-radius:12px; margin-top:8px; min-width: 220px; text-align:center; }
.dmkset-toast .msg.ok { background:#0f9d58; }
.dmkset-toast .msg.err { background:#e03131; }

@media (max-width: 640px){
  .dmkset--wrap { margin-top:12px; }
  .dmkset-card { padding:14px; }
  .dmkset-tab { padding:8px 12px; }
}

.dmkset-current-email { margin: 4px 0 10px; color:#555; font-size:14px; }
.dmkset-current-email strong { color:#111; }