/* Orvex App — specific styling layered on DOMINIZ Core
   v1.0.0
*/

/* Header */
.orvex-header{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:6px 0 12px;flex-wrap:wrap}
.orvex-title{display:flex;gap:10px;align-items:flex-start}
.orvex-title h1{font-size:22px;margin:0}
.orvex-kpi{display:flex;gap:8px;flex-wrap:wrap}

/* Hero / banners */
.hero{
  padding:18px;border:1px solid var(--border);border-radius:14px;
  background:linear-gradient(180deg,#0f1623 0%, #0b0e12 100%);
}
.hero .lead{font-size:15px;color:var(--muted)}
.hero .cta{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}

/* QR canvas */
canvas.qr{background:#fff;border-radius:8px}

/* Verification panel nuances */
.verify-good{border-color:rgba(25,195,125,.35) !important;box-shadow:0 0 0 2px rgba(25,195,125,.15) inset}
.verify-warn{border-color:rgba(255,176,32,.35) !important;box-shadow:0 0 0 2px rgba(255,176,32,.12) inset}
.verify-bad{border-color:rgba(255,92,92,.35) !important;box-shadow:0 0 0 2px rgba(255,92,92,.12) inset}

/* Pricing page blocks */
.pricing-grid{
  display:grid;gap:14px;
  grid-template-columns:1fr;
}
@media (min-width:900px){
  .pricing-grid{grid-template-columns:repeat(3,1fr)}
}
.plan{
  background:linear-gradient(180deg,var(--panel),var(--card));
  border:1px solid var(--border);
  border-radius:14px;padding:16px;position:relative;
}
.plan .name{font-weight:700;margin-bottom:6px}
.plan .price{font-size:26px;font-weight:800;margin:6px 0 10px}
.plan ul{padding-left:18px;margin:8px 0;color:var(--muted);font-size:14px}
.plan .cta{margin-top:12px}

/* Fine controls */
.small{font-size:12px}
.muted{color:var(--muted)}
.separator{height:1px;background:var(--border);margin:12px 0}

/* Install banner (if used inside app) */
.pwa-banner{
  position:fixed;right:16px;bottom:16px;z-index:99999;max-width:360px;
  background:#111621;color:#f7f7f7;border:1px solid #2a3550;border-radius:12px;
  padding:12px;box-shadow:var(--shadow);font:14px system-ui
}

/* Handles for photo quad (Vision) */
#handles .handle{
  position:absolute;width:18px;height:18px;border-radius:50%;
  border:2px solid var(--gold);background:rgba(202,168,90,.18);cursor:grab;
}

/* Tables (if needed for registry) */
.table{width:100%;border-collapse:separate;border-spacing:0}
.table th,.table td{padding:10px;border-bottom:1px solid var(--border);text-align:left}
.table th{color:#d7ddee}
.table tr:hover td{background:#0f1623}

/* Responsive tweaks */
@media (max-width:480px){
  .btn{padding:9px 10px}
  input,select,textarea{padding:10px}
  .orvex-title h1{font-size:20px}
}

/* Animations */
.fade-in{animation:fadeIn .2s ease-out both}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.spin-slow{animation:spin 6s linear infinite}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
