/* Rota demo additions */
body.has-demo-bar { padding-bottom: 64px; }
#demo-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 16px; background: #2b2622; color: #f4efe7; font-size: 13px;
  box-shadow: 0 -6px 20px rgba(0,0,0,.15);
}
#demo-bar .demo-tag { background: #b08a3e; color: #fff; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 11px; padding: 3px 8px; border-radius: 4px; }
#demo-bar label { color: #cfc6ba; font-weight: 400; margin: 0; font-size: 13px; }
#demo-bar select { width: auto; padding: 5px 8px; font-size: 13px; background: #fff; color: #2b2622; border-radius: 6px; border: none; }
#demo-bar button { background: transparent; color: #f4efe7; border: 1px solid #6b635b; border-radius: 6px; padding: 5px 10px; font: inherit; cursor: pointer; }
#demo-bar button:hover { background: rgba(255,255,255,.08); }
#demo-bar a { color: #e7d3a5; margin-left: auto; }
#demo-notice {
  position: fixed; right: 16px; bottom: 76px; z-index: 70; max-width: 380px;
  background: #fff; color: #2b2622; border: 1px solid #ecdcb8; border-left: 4px solid #b08a3e;
  border-radius: 8px; padding: 12px 34px 12px 14px; font-size: 13.5px; line-height: 1.5;
  box-shadow: 0 10px 30px rgba(0,0,0,.15); transform: translateY(12px); opacity: 0; pointer-events: none; transition: .2s;
}
#demo-notice.show { transform: none; opacity: 1; pointer-events: auto; }
#demo-notice strong { display: block; color: #8a5a10; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 2px; }
#demo-notice button { position: absolute; top: 6px; right: 8px; border: none; background: none; font-size: 18px; color: #8f877e; cursor: pointer; }
#toast { bottom: 76px; }
@media (max-width: 640px) {
  #demo-bar { flex-wrap: nowrap; gap: 8px; padding: 10px 12px; }
  #demo-bar a, #demo-bar label { display: none; }
  #demo-bar select { flex: 1; min-width: 0; }
  #demo-bar button { white-space: nowrap; padding: 5px 8px; }
  #demo-notice { left: 12px; right: 12px; max-width: none; }
}
@media print { #demo-bar, #demo-notice { display: none !important; } body.has-demo-bar { padding-bottom: 0; } }