/* Star Silver Controls – Premium – Red + Cyan #DBF4FA */
:root{
  --red:#e30613; --red-700:#b70510; --red-50:#fff1f2; --red-ring:rgba(227,6,19,0.15);
  /* #DBF4FA33 = rgba(219,244,250,0.2) – too faint – change --surface-alpha to 0.2 for exact */
  --surface-alpha:0.82;
  --bg-page:#eaf9fd;
  --card-bg:rgba(219,244,250,var(--surface-alpha));
  --line:#b8e6f2; --line-strong:#8ad4e8;
  --ink:#141821; --muted:#667085; --text-body:#3f4553;
  --radius-xl:18px; --radius-lg:14px; --radius-md:10px;
  --shadow-sm:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.07);
  --shadow-md:0 8px 24px rgba(16,24,40,.08),0 2px 8px rgba(16,24,40,.05);
  --shadow-lg:0 20px 44px rgba(16,24,40,.10);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(1200px 600px at 80% -10%, rgba(219,244,250,0.65) 0%, transparent 60%),var(--bg-page);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4{font-family:'Outfit','Inter',sans-serif;letter-spacing:-0.01em}
a{color:var(--red-700);text-decoration:none}
a:hover{text-decoration:underline}

/* Layout */
.dashboard-container{max-width:1080px;margin:0 auto;padding:28px 20px 40px;min-height:100vh;display:flex;flex-direction:column;gap:28px}
.site-header,.main-content,.site-footer{background:var(--card-bg);border:1px solid var(--line);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:26px 26px;backdrop-filter:blur(4px)}

/* Header */
.site-header{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.warranty-box{background:linear-gradient(180deg,#f0fbfe 0%, rgba(219,244,250,0.7) 100%);border:1px solid #b8e6f2;border-left:4px solid var(--red);padding:18px 20px;border-radius:var(--radius-lg);flex:1.15;min-width:300px;box-shadow:var(--shadow-sm)}
.warranty-eyebrow{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--red-700);margin-bottom:6px}
.warranty-box h2{font-size:1.2rem;font-weight:700;color:var(--ink);margin-bottom:4px}
.warranty-tag{font-weight:700;color:var(--red-700);margin-bottom:10px;display:inline-block;background:var(--red-50);padding:3px 10px;border-radius:999px;font-size:.82rem}
.warranty-info{font-size:.93rem;color:#3f4553}
.company-logo-area{flex:1;text-align:right;min-width:280px}
.company-logo-img{max-width:320px;width:100%;height:auto;display:block;margin-left:auto;border-radius:6px}
.company-name{font-family:'Outfit',sans-serif;font-size:1.15rem;font-weight:700;color:var(--ink);margin-top:8px}
.company-tagline{font-size:.78rem;font-weight:700;color:var(--muted);margin-top:4px;letter-spacing:.18em;text-transform:uppercase}

/* CTA / Buttons – unified */
.cta-heading{font-size:1.1rem;color:var(--muted);font-weight:600;margin-bottom:20px}
.cta-container{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;width:100%;margin-bottom:14px}
.cta-help-text{font-size:.88rem;color:#8b92a1;margin-top:6px}

.btn,.cta-button,.btn-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 28px;font-size:1.02rem;font-weight:600;font-family:'Inter',sans-serif;
  text-decoration:none;border-radius:12px;cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease;
  min-width:200px;border:none;
}
.cta-icon{width:18px;height:18px;flex-shrink:0;opacity:.95}

/* primary – red */
.btn-primary,.cta-button.primary,.btn-submit{
  background:linear-gradient(180deg,var(--red) 0%,var(--red-700) 100%);
  color:#fff;box-shadow:0 8px 20px rgba(227,6,19,.22),0 2px 6px rgba(227,6,19,.18)
}
.btn-primary:hover,.cta-button.primary:hover,.btn-submit:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(227,6,19,.28),0 4px 10px rgba(227,6,19,.18)}
.btn-primary:active,.cta-button.primary:active,.btn-submit:active{transform:translateY(0)}
.btn:disabled,.btn-submit:disabled{opacity:.6;transform:none;cursor:not-allowed}

/* secondary – outline */
.btn-secondary,.cta-button.secondary{
  background:rgba(255,255,255,0.9);color:var(--red-700);
  border:1.5px solid var(--red);box-shadow:var(--shadow-sm)
}
.btn-secondary:hover,.cta-button.secondary:hover{background:#fff1f2;transform:translateY(-2px);box-shadow:var(--shadow-md)}
.btn-block{width:100%;min-width:unset}

/* Forms – register / warranty – also used by auth pages */
.form-card{max-width:720px;margin:0 auto;background:rgba(255,255,255,0.88);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-md);padding:30px 28px}
.form-head h1{font-size:1.5rem;color:var(--ink);margin-bottom:4px}
.form-head p{color:var(--muted);margin-bottom:20px;font-size:.95rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.form-full{grid-column:1/-1}
label{display:block;font-weight:600;font-size:.88rem;margin-bottom:6px;color:#2b313d}
label span.req{color:var(--red)}
input,textarea,select{
  width:100%;padding:12px 14px;border:1.5px solid var(--line-strong);
  border-radius:10px;font:500 0.96rem 'Inter',sans-serif;
  background:#fffffff2;color:var(--ink);
  transition:border-color .15s,box-shadow .15s;outline:none
}
input:focus,textarea:focus,select:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-ring);background:#fff}
textarea{min-height:92px;resize:vertical}
input::placeholder,textarea::placeholder{color:#9aa0aa}
.form-actions{display:flex;gap:12px;align-items:center;margin-top:20px;flex-wrap:wrap}
.btn-cancel,.btn-link{color:var(--muted);text-decoration:none;font-weight:500}
.btn-cancel:hover,.btn-link:hover{color:var(--ink)}
.hint{font-size:.78rem;color:#8891a1;margin-top:4px}
.hint.warn{color:#b45309}

/* Messages – .msg and .form-msg are aliases */
.form-msg,.msg{margin-top:14px;padding:12px 14px;border-radius:10px;font-weight:500;display:none;font-size:.92rem;white-space:pre-wrap}
.form-msg.ok,.msg.ok{display:block;background:#e6f7ed;color:#0a7a3a;border:1px solid #bce8cc}
.form-msg.err,.msg.err{display:block;background:#fff1f2;color:#b70510;border:1px solid #ffc2c8}
.form-msg.info,.msg.info{display:block;background:#f0f6f8;color:#374151;border:1px solid var(--line)}

/* Auth pages – login / signup / admin */
body.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.auth-card{width:100%;max-width:420px;background:var(--card-bg);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-md);padding:30px 26px;backdrop-filter:blur(4px)}
.auth-logo{display:block;margin:0 auto 6px;max-width:210px}
.auth-card h1{font-family:'Outfit',sans-serif;text-align:center;font-size:1.35rem;margin-bottom:4px}
.auth-sub{text-align:center;color:var(--muted);font-size:.92rem;margin-bottom:20px}
.otp-input{letter-spacing:8px;font-size:1.3rem;text-align:center;font-weight:700}
.auth-foot{text-align:center;margin-top:14px;font-size:.9rem;color:var(--muted)}
.auth-foot a{color:#b70510;font-weight:600;text-decoration:none}
.auth-foot a:hover{text-decoration:underline}
.back-link{display:block;text-align:center;margin-top:12px;color:var(--muted);text-decoration:none;font-size:.88rem}
.back-link:hover{color:var(--ink)}

/* WhatsApp / QR */
.whatsapp-section{display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(180deg,#f0fbfe 0%, rgba(219,244,250,0.7) 100%);border:1px solid #b8e6f2;padding:20px;border-radius:14px;margin-bottom:28px;flex-wrap:wrap}
.whatsapp-text h3{color:var(--ink);margin-bottom:6px;font-size:1.15rem}
.whatsapp-text p{color:#4b5260;font-size:.95rem}
.whatsapp-number{font-weight:600;margin-top:6px;color:var(--red-700)!important}
.qr-card,.qr-placeholder{width:130px;height:130px;background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;padding:4px;box-shadow:var(--shadow-sm);transition:transform .2s ease}
.qr-card:hover{transform:translateY(-2px)}
.qr-image{width:100%;height:100%;object-fit:contain;display:block;border-radius:4px}

/* Products */
.products-section h3{color:var(--ink)}
.section-head{display:flex;align-items:baseline;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.section-sub{font-size:.82rem;color:var(--muted);font-weight:500}
.slider-wrap{display:flex;align-items:center;gap:12px}
.slider-btn{background:#fff;color:var(--ink);border:1px solid var(--line-strong);width:42px;height:42px;border-radius:999px;font-size:1.5rem;cursor:pointer;flex-shrink:0;transition:all .15s ease;box-shadow:var(--shadow-sm)}
.slider-btn:hover{background:var(--red);color:#fff;border-color:var(--red);transform:translateY(-1px)}
.slider-viewport{overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;flex:1;scrollbar-width:none}
.slider-viewport::-webkit-scrollbar{display:none}
.slider-track{display:flex;gap:16px;padding:4px 2px}
.product-card{flex:0 0 260px;scroll-snap-align:start;background:#ffffffd9;border:1px solid var(--line);border-radius:14px;padding:14px;text-align:left;transition:transform .18s ease,box-shadow .18s ease;box-shadow:var(--shadow-sm)}
.product-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.product-image-wrap{background:#fff;border:1px solid #e6f4f8;border-radius:10px;overflow:hidden;margin-bottom:12px}
.product-image{width:100%;height:148px;object-fit:contain;display:block;transition:transform .25s ease;background:#fff}
.product-card:hover .product-image{transform:scale(1.035)}
.product-card h4{color:var(--ink);margin-bottom:4px;font-size:1.05rem;font-weight:700}
.product-card p{font-size:.9rem;color:var(--muted)}
/* Price chip – kept for later – just add <span class="product-price">₹XXXX</span> in HTML */
.product-price{display:inline-block;margin-top:8px;font-weight:700;color:#1f2937;background:#f3f4f6;padding:4px 10px;border-radius:999px;font-size:.88rem}
.slider-hint{font-size:.8rem;color:#999;margin-top:10px;text-align:center}

/* User bar / footer */
.user-bar{font-size:.88rem;color:var(--muted);margin-bottom:12px;text-align:right}
.user-bar a{color:#b70510;font-weight:600;text-decoration:none}
.user-bar a:hover{text-decoration:underline}
.footer-bottom{border-top:1px solid var(--line);margin-top:28px;padding-top:16px;text-align:center;font-size:.88rem;color:var(--muted)}
.footer-bottom p{margin-bottom:4px}

/* Focus */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--red-ring);outline-offset:2px}

/* Reveal */
.reveal{opacity:0;transform:translateY(14px);animation:rise .55s cubic-bezier(.2,.7,.2,1) forwards}
.reveal.delay-1{animation-delay:.08s}.reveal.delay-2{animation-delay:.16s}
@keyframes rise{to{opacity:1;transform:none}}

/* Responsive */
@media(max-width:760px){
  .dashboard-container{padding:18px 14px 32px;gap:20px}
  .site-header,.main-content,.site-footer{padding:20px;border-radius:16px}
  .site-header{flex-direction:column;align-items:stretch}
  .company-logo-area,.company-name,.company-tagline,.user-bar{text-align:left}
  .company-logo-img{margin-left:0;max-width:260px}
  .company-tagline{font-size:.72rem;letter-spacing:.12em}
  .cta-container{flex-direction:column;align-items:stretch}
  .cta-button,.btn,.btn-submit{width:100%;min-width:unset}
  .whatsapp-section{flex-direction:column;text-align:center;align-items:center}
  .product-card{flex:0 0 230px}
  .form-grid{grid-template-columns:1fr}
  .form-card,.auth-card{padding:22px 18px}
}