/* HVAC marketplace — aligned to ManjuLAB SMB master template (portal-page theme). */

.hvac-wrap { max-width: 1100px; margin: 0 auto; width: 100%; }

.hvac-tabs {
  display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap;
  margin: 1.25rem 0 1.75rem;
}
.hvac-tab {
  border: 1px solid rgba(148, 163, 184, .28);
  background: rgba(15, 23, 42, .45);
  color: var(--text, #e2e8f0);
  padding: .5rem 1rem; border-radius: 999px; font-size: .82rem; cursor: pointer;
  text-decoration: none; transition: border-color .2s, background .2s;
}
.hvac-tab:hover { border-color: rgba(103, 232, 249, .5); }
.hvac-tab.active { border-color: rgba(103, 232, 249, .7); background: rgba(8, 145, 178, .18); color: #a5f3fc; }

.hvac-card {
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .5);
  border-radius: 18px; padding: 1.25rem; margin-bottom: 1.25rem;
  backdrop-filter: blur(6px);
}
.hvac-card h3 { margin: 0 0 .35rem; font-size: 1rem; color: #f1f5f9; }
.hvac-card .hvac-hint { margin: 0 0 1rem; font-size: .8rem; color: rgba(148, 163, 184, .95); }

.hvac-grid { display: grid; gap: .85rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.hvac-field { display: flex; flex-direction: column; gap: .35rem; font-size: .78rem; color: rgba(203, 213, 225, .95); }
.hvac-field label { font-weight: 600; letter-spacing: .01em; }
.hvac-field input, .hvac-field select, .hvac-field textarea {
  width: 100%; box-sizing: border-box;
  border: 1px solid rgba(148, 163, 184, .3);
  background: rgba(2, 6, 23, .7); color: #e2e8f0;
  border-radius: 10px; padding: .55rem .65rem; font-size: .88rem; font-family: inherit;
}
.hvac-field input:focus, .hvac-field select:focus, .hvac-field textarea:focus {
  outline: none; border-color: rgba(103, 232, 249, .6);
}
.hvac-field textarea { min-height: 84px; resize: vertical; }

.hvac-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1rem; }
.hvac-btn {
  border: 1px solid rgba(148, 163, 184, .3); background: rgba(15, 23, 42, .6);
  color: #e2e8f0; padding: .6rem 1.1rem; border-radius: 10px; font-size: .85rem;
  cursor: pointer; font-family: inherit; transition: transform .1s, border-color .2s, background .2s;
}
.hvac-btn:hover { border-color: rgba(103, 232, 249, .55); transform: translateY(-1px); }
.hvac-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.hvac-btn--primary { background: linear-gradient(135deg, #0891b2, #0e7490); border-color: transparent; color: #ecfeff; font-weight: 600; }
.hvac-btn--wa { background: linear-gradient(135deg, #16a34a, #15803d); border-color: transparent; color: #f0fdf4; font-weight: 600; }
.hvac-btn--ghost { background: transparent; }

.hvac-split { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 880px) { .hvac-split { grid-template-columns: 1.05fr .95fr; } }

#hvacMap { width: 100%; height: 420px; border-radius: 16px; border: 1px solid rgba(148,163,184,.25); background: #0b1220; z-index: 0; }
.leaflet-popup-content { font-size: .82rem; }
.leaflet-container { border-radius: 16px; }

.hvac-provider-list { display: flex; flex-direction: column; gap: .75rem; max-height: 460px; overflow-y: auto; padding-right: .25rem; }
.hvac-provider {
  border: 1px solid rgba(148, 163, 184, .22); border-radius: 14px;
  background: rgba(2, 6, 23, .55); padding: .9rem 1rem; cursor: pointer; transition: border-color .2s;
}
.hvac-provider:hover, .hvac-provider.selected { border-color: rgba(103, 232, 249, .6); }
.hvac-provider-name { font-weight: 700; color: #f1f5f9; font-size: .95rem; }
.hvac-provider-meta { font-size: .76rem; color: rgba(148, 163, 184, .95); margin-top: .2rem; }
.hvac-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .5rem; }
.hvac-chip { font-size: .68rem; padding: .18rem .5rem; border-radius: 999px; background: rgba(8,145,178,.16); color: #a5f3fc; border: 1px solid rgba(103,232,249,.25); }
.hvac-provider-actions { display: flex; gap: .5rem; margin-top: .7rem; flex-wrap: wrap; }
.hvac-verified { color: #4ade80; font-size: .7rem; font-weight: 600; }

.hvac-status { font-size: .8rem; padding: .6rem .8rem; border-radius: 10px; margin-top: .75rem; }
.hvac-status--ok { background: rgba(22, 163, 74, .14); color: #86efac; border: 1px solid rgba(34,197,94,.3); }
.hvac-status--err { background: rgba(239, 68, 68, .12); color: #fca5a5; border: 1px solid rgba(248,113,113,.3); }
.hvac-status--info { background: rgba(8, 145, 178, .12); color: #a5f3fc; border: 1px solid rgba(103,232,249,.25); }

/* Bot chat */
.hvac-chat { border: 1px solid rgba(148,163,184,.22); border-radius: 16px; background: rgba(2,6,23,.55); overflow: hidden; }
.hvac-chat-log { height: 300px; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .6rem; }
.hvac-msg { max-width: 88%; padding: .55rem .8rem; border-radius: 12px; font-size: .84rem; line-height: 1.5; white-space: pre-wrap; }
.hvac-msg--user { align-self: flex-end; background: linear-gradient(135deg,#0891b2,#0e7490); color: #ecfeff; }
.hvac-msg--bot { align-self: flex-start; background: rgba(30,41,59,.85); color: #e2e8f0; border: 1px solid rgba(148,163,184,.2); }
.hvac-chat-input { display: flex; gap: .5rem; padding: .7rem; border-top: 1px solid rgba(148,163,184,.18); }
.hvac-chat-input input { flex: 1; border: 1px solid rgba(148,163,184,.3); background: rgba(2,6,23,.7); color: #e2e8f0; border-radius: 10px; padding: .55rem .7rem; font-size: .85rem; }

.hvac-modal-backdrop { position: fixed; inset: 0; background: rgba(2,6,23,.75); display: flex; align-items: center; justify-content: center; padding: 1rem; z-index: 1000; }
.hvac-modal { max-width: 520px; width: 100%; max-height: 90vh; overflow-y: auto; }
.hvac-inline-note { font-size: .74rem; color: rgba(148,163,184,.9); margin-top: .35rem; }
[hidden] { display: none !important; }