/* ================================================
   Dunia Bendera - Base Styles (for profil.html)
   Main styles are now in index.html <style> tag
================================================ */

:root {
  --bg:      #fff8f0;
  --surface: #ffffff;
  --card:    #fff3e0;
  --border:  #ffd6a5;
  --accent:  #ff6b35;
  --accent2: #ffd166;
  --green:   #06d6a0;
  --red:     #ef233c;
  --text:    #2d2d2d;
  --muted:   #9e7b5a;
  --radius:  16px;
}

* { margin:0; padding:0; box-sizing:border-box; }

body {
  font-family: 'Nunito', sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
}

/* Auth field used in profil.html */
.auth-field {
  width:100%; background:#fff8f0; border:2.5px solid var(--border);
  border-radius:12px; padding:12px 16px; color:var(--text);
  font-family:'Nunito',sans-serif; font-size:14px; font-weight:700;
  outline:none; transition:border-color 0.2s;
}
.auth-field:focus { border-color:#ff6b35; }
.auth-field::placeholder { color:#c9a882; }

/* Sidebar for profil.html */
.topbar {
  display:flex; align-items:center; justify-content:flex-end;
  gap:10px; padding:12px 24px;
  position:fixed; top:0; left:0; right:0; z-index:999;
  background:rgba(255,107,53,0.97);
  backdrop-filter:blur(10px);
  border-bottom:2px solid rgba(255,255,255,0.2);
  box-shadow:0 4px 16px rgba(255,107,53,0.3);
}
.topbar-btn {
  padding:8px 18px; border-radius:50px;
  font-family:'Nunito',sans-serif; font-size:13px;
  font-weight:800; cursor:pointer; transition:all 0.2s; border:none;
}
.btn-login  { background:#fff; color:#ff6b35; }
.btn-logout { background:rgba(255,255,255,0.2); border:2px solid rgba(255,255,255,0.4); color:#fff; }
.btn-logout:hover { background:rgba(239,35,60,0.3); }
.guest-chip { background:rgba(255,255,255,0.15); border-radius:50px; padding:6px 14px; font-size:12px; color:#fff; font-weight:700; }

@keyframes popIn { from{opacity:0;transform:scale(0.88)} to{opacity:1;transform:scale(1)} }