/* ======== QuantumPrime — WhatsApp-Style Premium Layout (clean) =========== */

/* Tokens */
:root{
  --qp-primary:#8247e5;
  --qp-bg:#18192a;
  --qp-bg-accent:#22233a;
  --qp-text:#f3f3fb;
  --qp-text-muted:#b1b1d3;
  --qp-border:#373857;
  --qp-accent:#d2ab4d;
  --qp-footer-bg:#141527;
}

/* Themes */
body.theme-dark{
  --qp-primary:#8247e5; --qp-bg:#18192a; --qp-bg-accent:#22233a;
  --qp-text:#e7d39c; --qp-text-muted:#b1b1d3; --qp-border:#373857;
  --qp-accent:#d2ab4d; --qp-footer-bg:#141527;
}
body.theme-light{
  --qp-primary:#5e3ac1; --qp-bg:#f7f7fc; --qp-bg-accent:#f1f0fa;
  --qp-text:#23233b; --qp-text-muted:#585882; --qp-border:#d4d5ea;
  --qp-accent:#d2ab4d; --qp-footer-bg:#f7f7fc;
}
body.theme-blue{
  --qp-primary:#1877f2; --qp-bg:#182233; --qp-bg-accent:#22304b;
  --qp-text:#eaf3fd; --qp-text-muted:#9ab6e2; --qp-border:#244369;
  --qp-accent:#39aafc; --qp-footer-bg:#14203a;
}
body.theme-gold{
  --qp-primary:#b89127; --qp-bg:#171308; --qp-bg-accent:#221d0d;
  --qp-text:#fff9e0; --qp-text-muted:#e7d8a5; --qp-border:#67540f;
  --qp-accent:#e7d039; --qp-footer-bg:#221a06;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100vh;width:100vw;margin:0;padding:0}
body{
  margin:0; padding:0;
  font-family:'Inter','Montserrat',Arial,sans-serif;
  background:var(--qp-bg); color:var(--qp-text);
  min-height:100vh; display:flex; flex-direction:column;
  transition:background .3s,color .3s;
  overflow-x:hidden; /* pagina nu scrollează pe orizontală */
  -webkit-overflow-scrolling:auto;
}

/* Header */
.qp-header{
  height:64px; min-height:64px;
  position:fixed; top:0; left:0; width:100vw;
  display:flex; justify-content:space-between; align-items:center;
  padding:0 18px; background:var(--qp-bg-accent);
  border-bottom:1px solid var(--qp-border); z-index:100;
}
.qp-header-left{display:flex;align-items:center;gap:12px}
.qp-header-right{display:flex;align-items:center;gap:10px;padding-right:24px}
.qp-logo{width:50px;height:50px;border-radius:16px;object-fit:cover;background:transparent}
.qp-title{
  font-family:'Montserrat','Inter',sans-serif;
  font-weight:700; font-size:1.4rem; letter-spacing:1.2px;
  background:linear-gradient(45deg,#00f0ff,#0066ff);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.qp-tagline{font-size:.99rem;margin-left:8px;color:var(--qp-text-muted)}
#theme-switcher,#lang-switcher,#language-selector{
  border-radius:8px; border:1px solid var(--qp-border);
  padding:7px 13px; font-size:1rem; background:var(--qp-bg); color:var(--qp-text);
  transition:background .2s,color .2s; outline:none; cursor:pointer;
}
#theme-switcher:focus,#lang-switcher:focus,#language-selector:focus{border-color:var(--qp-primary)}

/* Main shell */
.qp-main{
  position:relative; z-index:1;
  margin-top:64px;               /* header */
  margin-bottom:60px;            /* bottom bar */
  width:100vw;
  display:flex; flex-direction:column; flex:1 1 0%;
  height:calc(100vh - 64px - 60px);
  min-height:0;                  /* important pentru scroll intern */
  overflow:hidden;               /* pagina, nu containerul de chat */
  background:var(--qp-bg);
}
.qp-main::before{
  content:""; position:absolute; top:50%; left:50%;
  width:400px; height:400px;
  background-image:url('../assets/logo2.png');
  background-size:contain; background-repeat:no-repeat; background-position:center;
  opacity:.1; transform:translate(-50%,-50%); z-index:0; pointer-events:none;
}

/* Chat area: UNIC container scrollabil */
#chat{display:flex;flex-direction:column;min-height:0;z-index:1}
.qp-chat-container{
  flex:1 1 auto; min-height:0; max-width:600px; width:100%;
  margin:0 auto; padding:26px 0 96px 0; /* extra sub input bar */
  display:flex; flex-direction:column; gap:16px;
  overflow-y:auto; overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}

/* Mesaje */
.qp-chat-message{display:flex;align-items:flex-end;gap:13px;max-width:90%;margin-bottom:2px}
.qp-chat-message.user{justify-content:flex-end}
.qp-chat-bubble{
  background:var(--qp-bg-accent); color:var(--qp-text);
  padding:12px 16px; border-radius:18px; max-width:430px;
  font-size:1.04rem; line-height:1.5; word-break:break-word;
  box-shadow:0 2px 10px 0 rgb(0 0 0 / 7%);
  animation:chat-pop .21s cubic-bezier(.22,1,.36,1);
}
@keyframes chat-pop{0%{transform:scale(.97) translateY(10px);opacity:.55}100%{transform:scale(1) translateY(0);opacity:1}}
.qp-chat-message.user .qp-chat-bubble{background:var(--qp-primary);color:#fff;align-self:flex-end}
.qp-chat-message.ai .qp-chat-bubble{background:var(--qp-accent);color:#23233b}

/* Typing indicator */
#chat-loading{
  display:none; text-align:center; padding:1rem; margin:1rem auto; max-width:90%;
  font-size:1.1rem; font-weight:600; color:var(--qp-primary);
  background:rgba(255,215,0,.08); border-radius:.8rem;
  box-shadow:0 0 10px rgba(255,215,0,.3);
}

/* Chat input bar */
.qp-chat-input-bar{
  position:fixed; left:50%; bottom:60px; transform:translateX(-50%);
  width:100vw; max-width:600px; display:flex; gap:10px; align-items:center;
  background:var(--qp-bg-accent); padding:11px 13px; border-radius:19px;
  box-shadow:0 -2px 16px 0 rgb(0 0 0 / 5%); z-index:2000;
}
.qp-chat-input{
  flex:1; font-size:1.04rem; padding:11px 13px; border-radius:10px;
  border:1px solid var(--qp-border); outline:none; background:var(--qp-bg); color:var(--qp-text);
  transition:border .2s, background .2s;
}
.qp-chat-input:focus{border-color:var(--qp-primary)}
.qp-chat-send{
  background:linear-gradient(45deg,#00f0ff,#0066ff); color:#fff; border:none;
  padding:0 19px; border-radius:11px; font-size:1.12rem; font-weight:700; cursor:pointer;
  transition:opacity .15s;
}
.qp-chat-send:hover,.qp-chat-send:focus{opacity:.85}
.qp-chat-send:active{transform:scale(.94)}
.qp-chat-save{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:12px;border:1px solid var(--qp-border);
  background:var(--qp-bg-accent);color:var(--qp-text);font-size:1.1rem;cursor:pointer
}

/* Bottom bar */
.qp-bottom-bar{
  position:fixed; left:0; right:0; bottom:0; height:60px;
  display:flex; justify-content:space-around; align-items:center;
  background:var(--qp-bg); border-top:1.5px solid var(--qp-border);
  box-shadow:0 -2px 14px 0 rgba(0,0,0,.13); z-index:22000;
}
.qp-bottom-bar .qp-bottom-btn{
  background:none; border:none; display:flex; flex-direction:column; align-items:center; gap:2px;
  color:var(--qp-text); font-size:1rem; padding:0; cursor:pointer; border-radius:11px;
  transition:background .13s, color .13s, box-shadow .13s;
}
.qp-bottom-bar .qp-bottom-btn i{
  width:28px;height:28px;color:var(--qp-accent);display:block;margin-bottom:2px;
  transition:color .17s, filter .17s;
}
.qp-bottom-bar .qp-bottom-btn.active,
.qp-bottom-bar .qp-bottom-btn:active,
.qp-bottom-bar .qp-bottom-btn:hover{
  color:var(--qp-accent); background:rgba(180,154,255,.11);
}
.qp-bottom-bar .qp-bottom-btn.active i,
.qp-bottom-bar .qp-bottom-btn:active i,
.qp-bottom-bar .qp-bottom-btn:hover i{
  color:var(--qp-accent); filter:drop-shadow(0 2px 6px #b49affc0);
}
.qp-bottom-bar .qp-bottom-label{font-size:.82rem;color:var(--qp-text-muted);line-height:1.13}

/* Footer (ascuns pe mobil) */
.qp-footer{
  position:fixed; left:0; bottom:0; width:100vw; height:48px;
  display:flex; align-items:center; justify-content:space-between;
  background:var(--qp-footer-bg); color:var(--qp-text-muted);
  padding:0 32px; border-top:1px solid var(--qp-border);
  font-size:.95rem; z-index:11000;
}
.qp-footer a{color:var(--qp-primary);margin-left:14px;text-decoration:none;font-weight:500;font-size:.98rem;transition:color .15s}
.qp-footer a:hover{color:var(--qp-accent);text-decoration:underline}

/* History */
.history-wrap{display:grid;grid-template-columns:320px 1fr;gap:12px;height:100%}
.history-list{overflow:auto;border-right:1px solid #eee;padding:8px}
.history-item{padding:8px;border-radius:10px;cursor:pointer;border:1px solid #eee;margin-bottom:8px;color:#bbb}
.history-item:hover{background:#f7f7f7}
.history-item strong{color:#ccc}
.history-item small{color:#999}
.history-view{display:flex;flex-direction:column;min-height:0}
.history-toolbar{display:none !important}
#history-chat-container{flex:1;overflow:auto;border:1px solid #eee;border-radius:12px;padding:12px}

/* Projects modal scroll */
.qp-modal-overlay .qp-modal-content{max-height:80vh;overflow-y:auto;overflow-x:hidden}
#qp-projects-list{max-height:300px;overflow-y:auto;padding-right:8px}
#qp-projects-list::-webkit-scrollbar{width:8px}
#qp-projects-list::-webkit-scrollbar-track{background:var(--qp-bg);border-radius:10px}
#qp-projects-list::-webkit-scrollbar-thumb{background:var(--qp-accent);border-radius:10px;border:2px solid var(--qp-bg)}

/* Logout button */
.qp-logout-btn{
  display:flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:12px; border:1px solid var(--qp-border);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.12));
  color:var(--qp-text); cursor:pointer; position:relative;
  box-shadow:0 4px 18px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.04);
  transition:transform .12s ease, box-shadow .2s ease, background .2s ease;
}
.qp-logout-btn i{width:18px;height:18px;color:var(--qp-accent)}
.qp-logout-btn:hover{transform:translateY(-1px);box-shadow:0 8px 28px rgba(0,0,0,.35)}
.qp-logout-btn:disabled{opacity:.6;cursor:not-allowed}
.qp-logout-spin{
  --s:16px;width:var(--s);height:var(--s);border-radius:50%;
  border:2px solid transparent;border-top-color:var(--qp-accent);border-right-color:var(--qp-accent);
  animation:qp-spin .7s linear infinite; display:none;
}
.qp-logout-btn.loading .qp-logout-spin{display:inline-block}
.qp-logout-btn.loading i,.qp-logout-btn.loading span:first-of-type{opacity:0}
@keyframes qp-spin{to{transform:rotate(360deg)}}

/* Glass modal */
.qp-modal{position:fixed;inset:0;display:none;place-items:center;z-index:30000;background:rgba(0,0,0,.45);backdrop-filter:blur(6px)}
.qp-modal.show{display:grid}
.qp-modal-card{
  width:min(92vw,380px);border-radius:16px;padding:16px;background:rgba(30,30,45,.85);
  border:1px solid var(--qp-border);box-shadow:0 20px 60px rgba(0,0,0,.6);color:var(--qp-text)
}
.qp-modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}
.qp-btn{padding:8px 12px;border-radius:10px;border:1px solid var(--qp-border);background:var(--qp-bg-accent);color:var(--qp-text);cursor:pointer}
.qp-btn.primary{background:var(--qp-primary);color:#fff;border:none}

/* Toast */
.qp-toast{
  position:fixed; top:18px; left:50%; transform:translateX(-50%);
  padding:10px 16px; border-radius:12px; font-weight:700;
  color:#23233b; background:var(--qp-accent);
  box-shadow:0 10px 30px rgba(0,0,0,.35); z-index:40000; opacity:0; transition:opacity .25s ease;
}
.qp-toast.show{opacity:1}

/* Scrollbars */
::-webkit-scrollbar{width:8px;background:var(--qp-bg)}
::-webkit-scrollbar-thumb{background:var(--qp-border);border-radius:8px}

/* ======= Mobile & Tablet ======= */
@media (max-width:600px){
  .qp-header{flex-direction:column;gap:8px;height:auto;min-height:unset;padding:8px 4px}
  .qp-logo{width:27px;height:27px}
  .qp-title{font-size:1.01rem}
  .qp-tagline{font-size:.82rem;margin-left:4px}
  .qp-footer{display:none !important}

  /* Dynamic viewport fix: pagina rămâne fixă, chatul scrollează */
  html,body{height:100dvh;overflow:hidden}
  .qp-main{
    margin-top:54px; margin-bottom:108px;
    height:calc(100dvh - 54px - 60px);
    min-height:0; overflow:hidden; display:flex; flex-direction:column;
  }
  #chat{min-height:0; overflow:hidden}
  .qp-chat-container{
    max-width:100vw; padding:7px 0 120px 0;
    flex:1 1 auto; min-height:0; max-height:100%;
    overflow-y:auto; overflow-x:hidden;
    -webkit-overflow-scrolling:touch; touch-action:pan-y; overscroll-behavior:contain;
  }
  .qp-chat-input-bar{max-width:100vw;padding:6px 7px;border-radius:11px;bottom:60px}
  .qp-chat-save{width:40px;height:40px;border-radius:10px}
}

@media (min-width:601px) and (max-width:1024px){
  /* Tablet: aceleași principii ca mobil, cu margini mai aerisite */
  html,body{height:100dvh;overflow:hidden}
  .qp-main{
    height:calc(100dvh - 64px - 60px);
    min-height:0; overflow:hidden; display:flex; flex-direction:column;
  }
  .qp-chat-container{
    max-width:92vw; padding:16px 0 120px 0;
    flex:1 1 auto; min-height:0; max-height:100%;
    overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
  }
}
/* Unificare selector: același stil pentru id + clasă */
#chat-container, .qp-chat-container{
  flex:1 1 auto;
  min-height:0;
  max-height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  overscroll-behavior:contain;
  padding:26px 0 96px 0;
}

/* Părinți cu min-height:0 ca să permită scroll intern */
.qp-main, #chat{
  display:flex;
  flex-direction:column;
  min-height:0;
  overflow:hidden;
}

/* Mobil: înălțime explicită pentru containerul de chat */
@media (max-width:600px){
  html, body { height:100dvh; overflow:hidden; }
  .qp-main{
    height:calc(100dvh - 54px - 60px); /* header compact + bottom bar */
  }
  #chat{
    height:100%;
  }
  #chat-container, .qp-chat-container{
    height:calc(100dvh - 54px - 60px - 108px); /* - input bar aproximat */
    padding:7px 0 120px 0; /* spațiu peste input bar */
  }
}

/* Tablet */
@media (min-width:601px) and (max-width:1024px){
  html, body { height:100dvh; overflow:hidden; }
  .qp
:root{ --header-h:64px; }

.qp-header{ position:sticky; top:0; z-index:1000; background:var(--qp-bg); }

.qp-main{ padding-top:calc(var(--header-h) + env(safe-area-inset-top)); }

#chat-container, .qp-chat-container{
  scroll-padding-top:calc(var(--header-h) + 12px);
}

.conversation-item, [data-chat-id]{
  scroll-margin-top:calc(var(--header-h) + 12px);
}
:root{ --header-h:64px; --bottom-h:64px; }

.qp-header{ position:sticky; top:0; z-index:1000; }

.qp-main{ padding-top:var(--header-h); }

.history-list, #chat-container, .qp-chat-container{
  scroll-padding-top:calc(var(--header-h) + 12px);
}

.history-card, .conversation-item, [data-chat-id]{
  scroll-margin-top:calc(var(--header-h) + 12px);
}

.qp-chat-message {
  scroll-margin-top: calc(var(--header-h) + 12px);
}

.history-item {
  scroll-margin-top: calc(var(--header-h) + 12px);
}
/* History – fix mobil */
@media (max-width:600px){
  .history-wrap{
    display:flex;
    flex-direction:column;
    gap:10px;
    height:calc(100dvh - 54px - 60px); /* sub header + bottom bar */
    padding:8px;
  }
  .history-list{
    order:2;
    width:100%;
    max-height:40vh;            /* listă scurtă, scroll intern */
    overflow-y:auto;
    border-right:none;
    border-top:1px solid var(--qp-border);
    padding:8px 6px 12px;
  }
  .history-view{
    order:1;
    width:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
  }
  #history-chat-container{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    border:1px solid var(--qp-border);
    border-radius:12px;
    padding:12px;
  }
}
/* === HISTORY FIX === */
.history-wrap {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 12px;
  height: calc(100dvh - var(--header-h) - 60px); /* sub header + bottom bar */
  padding: 12px;
  box-sizing: border-box;
}

.history-list {
  overflow-y: auto;
  border-right: 1px solid var(--qp-border);
  padding: 8px;
}

.history-view {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

#history-chat-container {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  border: 1px solid var(--qp-border);
  border-radius: 12px;
  padding: 12px;
  word-break: break-word;
  white-space: normal;
}

/* Mobile: stacked layout */
@media (max-width: 768px) {
  .history-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .history-list {
    border-right: none;
    border-bottom: 1px solid var(--qp-border);
    max-height: 40vh;
  }
  .history-view {
    flex: 1 1 auto;
    min-height: 0;
  }
}
/* Override pentru mesaje în history */
#history-chat-container .qp-chat-message,
#history-chat-container .qp-chat-bubble {
  writing-mode: horizontal-tb !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  display: block !important;
}
/* HISTORY: mobile overrides */
@media (max-width: 700px){
  .history-wrap{
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    height:calc(100dvh - var(--header-h) - var(--bottom-h)) !important;
    padding:10px !important;
    box-sizing:border-box !important;
  }
  .history-list{
    order:1 !important;
    width:100% !important;
    max-height:40vh !important;
    overflow-y:auto !important;
    border-right:0 !important;
    border-bottom:1px solid #eee !important;
    padding:8px 6px 12px !important;
  }
  .history-view{
    order:2 !important;
    flex:1 1 auto !important;
    min-height:0 !important;
    display:flex !important;
    flex-direction:column !important;
  }
  #history-chat-container{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
    border:1px solid #eee !important;
    border-radius:12px !important;
    padding:12px !important;
  }
  /* Asigură lățime normală pentru bule și text */
  #history-chat-container .qp-chat-message{ max-width:100% !important; }
  #history-chat-container .qp-chat-bubble{
    max-width:100% !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }
}

/* Dacă vrei și pe tablete să renunți la coloana fixă de 320px */
@media (max-width: 900px){
  .history-wrap{ grid-template-columns:1fr !important; }
}

.qp-toast {
  position: fixed;
  top: 80px;           /* puțin sub header */
  right: 20px;
  background: rgba(0,0,0,0.85);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 16px;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  z-index: 9999;
  pointer-events: none; /* să nu blocheze clickuri */
}
.credits-info {
  font-size: 14px;
  font-weight: 600;
  margin: 10px 0;
}

.odometer {
  color: #007BFF; /* albastru premium */
  font-size: 18px;
  font-weight: bold;
  display: inline-block;
  transition: all 0.5s ease-in-out;
}
/* === Fix stil pentru selectori modele și limbă === */
#qp-model-select,
#language-selector,
#theme-switcher {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background: var(--qp-bg-accent);
  color: var(--qp-text);
  border: 1px solid var(--qp-border);
  border-radius: 8px;
  padding: 7px 13px;
  font-size: 1rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

#qp-model-select:focus,
#language-selector:focus,
#theme-switcher:focus {
  border-color: var(--qp-primary);
  outline: none;
}

#qp-model-select option,
#language-selector option {
  background: var(--qp-bg-accent);
  color: var(--qp-text);
}
/* === PREMIUM FULL OVERRIDES === */

/* Mesaje user (violet -> albastru) */
.qp-chat-message.user .qp-chat-bubble {
  background: linear-gradient(135deg, #6a11cb, #2575fc);
  color: #fff;
  box-shadow: 0 4px 14px rgba(0,0,0,0.25);
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,0.05);
}

/* Mesaje AI (auriu -> champagne) */
.qp-chat-message.ai .qp-chat-bubble {
  background: linear-gradient(135deg, #fceabb, #f8b500);
  color: #23233b;
  font-family: "Playfair Display", serif;
  box-shadow: 0 4px 14px rgba(0,0,0,0.25);
  border-radius: 20px;
  border: 1px solid rgba(255, 215, 0, 0.35);
}

/* Input bar cu efect glass */
.qp-chat-input-bar {
  background: rgba(34, 35, 58, 0.75);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 14px rgba(0,0,0,0.25);
}



/* Buton send cu efect neon */
.qp-chat-send {
  background: linear-gradient(135deg, #00f0ff, #0066ff, #8247e5);
  box-shadow: 0 4px 14px rgba(0,0,0,0.25);
  border: none;
  color: white;
  border-radius: 12px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.qp-chat-send:hover {
  transform: scale(1.05);
  box-shadow: 0 6px 18px rgba(0,0,0,0.35);
}

/* Animație typing dots */
.qp-typing {
  display: inline-block;
  vertical-align: middle;
}
.qp-typing span {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0 2px;
  background: #f8b500;
  border-radius: 50%;
  animation: typingBlink 1.4s infinite both;
}
.qp-typing span:nth-child(2) { animation-delay: 0.2s; }
.qp-typing span:nth-child(3) { animation-delay: 0.4s; }

@keyframes typingBlink {
  0%, 80%, 100% { opacity: 0.2; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1); }
}
#credits-count {
  font-size: 0.9rem;          /* mai mic decât textul normal */
  font-weight: bold;
  font-family: 'Courier New', monospace; /* efect de contor */
  display: inline-block;
  min-width: 40px;            /* să nu „sară” textul */
  text-align: right;
  transition: transform 0.3s ease, color 0.3s ease;
}
#credits-count.animating {
  transform: scale(1.3);
  color: #FFD700; /* galben premium */
}
#qp-model-select { width:100%; max-width:100%; }
@media (max-width: 480px){
  #qp-model-select { font-size: 14px; }
}