/* Novato Smart Home Calculator v3 — Premium Design */
/* Hidden utility */
.novato-shc button.shc-add-card.shc-hidden,
.novato-shc .shc-add-card.shc-hidden,
.novato-shc [hidden],
.novato-shc .shc-hidden { display: none !important; }
.shc-loader[hidden],
.shc-toast[hidden] { display: none !important; }

/* ================================================================
   ROOT
   ================================================================ */
.novato-shc {
  --shc-primary: #1e3a52;
  --shc-primary-dark: #15293c;
  --shc-primary-soft: #eef3f8;
  --shc-accent: #3b82f6;
  --shc-accent-soft: #dbeafe;
  --shc-bg: #ffffff;
  --shc-surface: #f8fafc;
  --shc-border: #e2e8f0;
  --shc-border-hover: #cbd5e1;
  --shc-text: #0f172a;
  --shc-muted: #64748b;
  --shc-radius: 12px;
  --shc-radius-sm: 8px;
  --shc-shadow: 0 1px 3px rgba(15,23,42,.06);
  --shc-shadow-md: 0 4px 16px rgba(15,23,42,.08);
  --shc-shadow-lg: 0 12px 40px rgba(15,23,42,.1);
  --shc-shadow-xl: 0 20px 60px rgba(15,23,42,.12);
  --shc-success: #059669;
  --shc-danger: #dc2626;
  --shc-wa-green: #25d366;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--shc-text);
  max-width: 1320px;
  margin: 2rem auto;
  padding: 0;
  background: var(--shc-bg) !important;
  border-radius: 20px;
  box-shadow: var(--shc-shadow-xl);
  border: 1px solid var(--shc-border);
  line-height: 1.5;
  overflow: hidden;
}
.novato-shc * { box-sizing: border-box; }

/* ================================================================
   HEADER
   ================================================================ */
.shc-header {
  position: relative;
  text-align: center;
  padding: 2.5rem 2rem 1.5rem;
  background: linear-gradient(135deg, #0f2236 0%, #1e3a52 50%, #2a5070 100%);
  color: #ffffff;
  overflow: hidden;
}
.shc-header-bg {
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}
.shc-header-content { position: relative; z-index: 1; }
.shc-header-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 52px; height: 52px; border-radius: 14px;
  background: rgba(255,255,255,.12); backdrop-filter: blur(8px);
  margin-bottom: .75rem; color: #ffffff;
}
.shc-title {
  font-size: 1.75rem; margin: 0; font-weight: 800;
  color: #ffffff; letter-spacing: -.02em; line-height: 1.2;
}
.shc-subtitle {
  margin: .4rem 0 0; font-size: .88rem; color: rgba(255,255,255,.7);
  font-weight: 400;
}

/* Progress — numbered steps */
.shc-progress {
  display: inline-flex; align-items: center; gap: .5rem;
  margin-top: 1.25rem; padding: .5rem .75rem;
  background: rgba(255,255,255,.1); border-radius: 999px;
  backdrop-filter: blur(8px);
}
.shc-step-indicator {
  display: flex; align-items: center; gap: .35rem;
  opacity: .5; transition: all .3s;
}
.shc-step-indicator.is-active { opacity: 1; }
.shc-step-indicator.is-done { opacity: .85; }
.shc-step-num {
  width: 24px; height: 24px; border-radius: 50%;
  background: rgba(255,255,255,.2); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem; font-weight: 700;
  transition: all .3s;
}
.shc-step-indicator.is-active .shc-step-num {
  background: #ffffff; color: var(--shc-primary);
}
.shc-step-indicator.is-done .shc-step-num {
  background: var(--shc-success); color: #fff;
}
.shc-step-label {
  font-size: .72rem; font-weight: 600; color: rgba(255,255,255,.8);
  letter-spacing: .02em;
}
.shc-step-line {
  width: 28px; height: 2px;
  background: rgba(255,255,255,.2); border-radius: 1px;
  transition: background .3s;
}
.shc-step-line.is-done { background: var(--shc-success); }

/* ================================================================
   STEPS — common
   ================================================================ */
.shc-step { padding: 2rem; animation: shc-fade .35s ease; }
.shc-step[hidden] { display: none; }
@keyframes shc-fade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.shc-step-title {
  font-size: 1.25rem; margin: 0 0 .35rem; font-weight: 700;
  color: var(--shc-text); text-align: center;
}
.shc-step-desc {
  text-align: center; color: var(--shc-muted); font-size: .85rem;
  margin: 0 0 1.5rem;
}
.shc-divider {
  display: flex; align-items: center; gap: .85rem;
  margin: 1.5rem 0; color: var(--shc-muted); font-size: .72rem;
  text-transform: uppercase; letter-spacing: .06em; font-weight: 600;
}
.shc-divider::before, .shc-divider::after {
  content: ""; flex: 1; height: 1px; background: var(--shc-border);
}

/* ================================================================
   NOVAI — AI Chat
   ================================================================ */
.shc-novai {
  background: var(--shc-surface);
  border: 1px solid var(--shc-border);
  border-radius: 16px;
  padding: 1.5rem;
  margin-bottom: .5rem;
  position: relative;
  transition: box-shadow .3s;
}
.shc-novai:hover { box-shadow: var(--shc-shadow-md); }
.shc-novai-header {
  display: flex; align-items: center; gap: .75rem;
  margin-bottom: 1rem; padding-bottom: .85rem;
  border-bottom: 1px solid var(--shc-border);
}
.shc-novai-avatar {
  width: 44px; height: 44px; border-radius: 12px;
  background: #ffffff;
  color: #ffffff; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; overflow: hidden;
  box-shadow: 0 2px 8px rgba(30, 58, 82, 0.1);
}
.shc-novai-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shc-novai-intro { display: flex; flex-direction: column; line-height: 1.2; flex: 1; }
.shc-novai-intro strong { font-size: 1rem; color: var(--shc-primary); font-weight: 700; }
.shc-novai-intro small { color: var(--shc-muted); font-size: .72rem; margin-top: .1rem; }
.shc-novai-status {
  display: flex; align-items: center; gap: .35rem;
  font-size: .68rem; color: var(--shc-success); font-weight: 600;
}
.shc-status-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--shc-success);
  animation: shc-pulse-dot 2s infinite;
}
@keyframes shc-pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .5; transform: scale(.8); }
}
.shc-novai-greeting {
  margin: 0 0 .85rem; font-size: .85rem; line-height: 1.6; color: var(--shc-muted);
}
.shc-ai-chat {
  max-height: 280px; overflow-y: auto; margin-bottom: .75rem;
  scroll-behavior: smooth;
}
.shc-ai-chat:empty { display: none; }
.shc-ai-msg {
  padding: .7rem 1rem; border-radius: 12px; margin-bottom: .5rem;
  font-size: .85rem; line-height: 1.5; max-width: 85%;
  animation: shc-msg-in .3s ease;
}
@keyframes shc-msg-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.shc-ai-msg.user {
  background: var(--shc-primary); color: #ffffff;
  margin-left: auto; border-bottom-right-radius: 4px; font-weight: 500;
}
.shc-ai-msg.bot {
  background: #ffffff; border: 1px solid var(--shc-border);
  margin-right: auto; color: var(--shc-text); border-bottom-left-radius: 4px;
}
.shc-ai-msg.thinking::after { content: " ..."; animation: shc-dots 1.4s infinite steps(4); }
@keyframes shc-dots { 0% { content: " ."; } 33% { content: " .."; } 66% { content: " ..."; } 100% { content: " ."; } }

.shc-ai-form { display: flex; gap: .5rem; align-items: flex-end; }
.shc-ai-form textarea {
  flex: 1; padding: .75rem 1rem; border-radius: 12px;
  border: 1px solid var(--shc-border); background: #ffffff; color: var(--shc-text);
  font-family: inherit; font-size: .88rem; line-height: 1.4;
  resize: none; min-height: 44px; max-height: 100px;
  transition: border-color .2s, box-shadow .2s;
  overflow: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.shc-ai-form textarea::-webkit-scrollbar { display: none; }
.shc-ai-form textarea::-webkit-resizer { display: none; }
.shc-ai-form textarea::placeholder { color: #c7ced6; opacity: 1; font-weight: 400; }
.shc-ai-form textarea::-webkit-input-placeholder { color: #c7ced6; }
.shc-ai-form textarea::-moz-placeholder { color: #c7ced6; opacity: 1; }
.shc-ai-form textarea:focus {
  outline: none; border-color: var(--shc-primary);
  box-shadow: 0 0 0 3px rgba(30,58,82,.1);
}
.novato-shc button.shc-ai-send {
  width: 44px !important; height: 44px !important; min-height: 0 !important;
  border-radius: 12px !important; padding: 0 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  background: var(--shc-primary) !important; color: #fff !important;
  border: none !important; cursor: pointer !important; flex-shrink: 0 !important;
  transition: all .2s !important; box-shadow: none !important;
  font-family: inherit !important; text-transform: none !important;
  letter-spacing: 0 !important; text-decoration: none !important;
}
.novato-shc button.shc-ai-send:hover:not(:disabled) {
  background: var(--shc-primary-dark) !important; transform: scale(1.05);
}
.novato-shc button.shc-ai-send:disabled { opacity: .5 !important; }

.shc-ai-examples { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; margin-top: .85rem; }
.shc-ai-examples-label {
  font-size: .7rem; color: var(--shc-muted); font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em;
}
.novato-shc button.shc-chip {
  background: #ffffff !important; border: 1px solid var(--shc-border) !important;
  border-radius: 999px !important; padding: .4rem 1rem !important;
  cursor: pointer !important; font-size: .72rem !important; font-weight: 600 !important;
  color: var(--shc-muted) !important; transition: all .2s !important;
  font-family: inherit !important; text-transform: none !important;
  letter-spacing: 0 !important; display: inline-flex !important;
  align-items: center !important; line-height: 1.2 !important;
  height: auto !important; min-height: 0 !important; width: auto !important;
  text-decoration: none !important; box-shadow: none !important;
  background-color: #ffffff !important;
}
.novato-shc button.shc-chip:hover {
  background: var(--shc-primary) !important; background-color: var(--shc-primary) !important;
  color: #ffffff !important; border-color: var(--shc-primary) !important;
  transform: translateY(-1px);
}

/* ================================================================
   PRESET CARDS
   ================================================================ */
.shc-preset-grid {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.novato-shc button.shc-preset-card {
  position: relative; cursor: pointer !important;
  background: #ffffff !important; background-color: #ffffff !important;
  border: 1px solid var(--shc-border) !important; border-radius: 16px !important;
  padding: 1.5rem 1.25rem !important; text-align: left !important;
  transition: all .3s !important; display: flex !important;
  flex-direction: column !important; gap: .5rem !important;
  font-family: inherit !important; color: var(--shc-text) !important;
  text-transform: none !important; letter-spacing: 0 !important;
  font-weight: 400 !important; height: auto !important;
  min-height: 0 !important; width: auto !important;
  text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.04) !important;
}
.novato-shc button.shc-preset-card:hover {
  border-color: var(--shc-primary) !important;
  transform: translateY(-4px);
  box-shadow: 0 16px 32px rgba(30,58,82,.12) !important;
}
.shc-preset-icon {
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--shc-primary-soft); color: var(--shc-primary);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: .25rem;
}
.shc-preset-icon img {
  width: 100%; height: 100%; object-fit: cover; border-radius: 14px;
}
.shc-preset-card h5 {
  margin: .15rem 0; font-size: 1.05rem; font-weight: 700;
  color: var(--shc-primary); letter-spacing: -.01em;
}
.shc-preset-card p {
  margin: 0; font-size: .8rem; color: var(--shc-muted);
  flex: 1; line-height: 1.5;
}
.shc-preset-stats {
  display: flex; gap: .75rem; padding: .65rem 0;
  border-top: 1px solid var(--shc-border);
  font-size: .72rem; color: var(--shc-muted); font-weight: 500;
}
.shc-preset-stats span { display: flex; align-items: center; gap: .25rem; }
.shc-preset-stats strong { color: var(--shc-primary); font-weight: 700; }
.shc-preset-discount {
  color: var(--shc-success) !important; font-weight: 700 !important;
  background: #ecfdf5; padding: .15rem .5rem; border-radius: 999px;
  font-size: .68rem !important;
}
.shc-preset-price {
  display: flex; align-items: baseline; justify-content: space-between;
  padding-top: .65rem; border-top: 1px solid var(--shc-border);
}
.shc-preset-price small {
  color: var(--shc-muted); font-size: .68rem;
  text-transform: uppercase; letter-spacing: .04em;
}
.shc-preset-price strong {
  font-size: 1.2rem; color: var(--shc-primary); font-weight: 800;
}
.shc-badge {
  position: absolute; top: .85rem; right: .85rem;
  padding: .3rem .7rem; font-size: .62rem; font-weight: 700;
  border-radius: 999px; text-transform: uppercase; letter-spacing: .05em;
}
.shc-badge-pop\00FCler { background: #fef3c7; color: #92400e; }
.shc-badge-\00F6nerilen { background: #dbeafe; color: #1e40af; }
.shc-badge-yeni { background: #dcfce7; color: #166534; }
.shc-badge-kolay { background: #ede9fe; color: #6d28d9; }

/* Sifirdan Kur */
.novato-shc button.shc-custom-start {
  display: flex !important; align-items: center !important; gap: 1rem !important;
  width: 100% !important; padding: 1.25rem 1.5rem !important;
  cursor: pointer !important; background: #ffffff !important;
  background-color: #ffffff !important;
  border: 2px dashed var(--shc-border-hover) !important;
  border-radius: 16px !important; font-family: inherit !important;
  color: var(--shc-text) !important; transition: all .25s !important;
  text-align: left !important; margin-top: 1.25rem !important;
  text-transform: none !important; letter-spacing: 0 !important;
  font-weight: 400 !important; height: auto !important;
  min-height: 0 !important; text-decoration: none !important;
  box-shadow: none !important;
}
.novato-shc button.shc-custom-start:hover {
  border-color: var(--shc-primary) !important; border-style: solid !important;
  background: var(--shc-primary-soft) !important;
  background-color: var(--shc-primary-soft) !important;
  transform: translateY(-2px);
}
.shc-custom-start-icon {
  width: 48px; height: 48px; border-radius: 14px;
  background: var(--shc-primary-soft); color: var(--shc-primary);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.novato-shc button.shc-custom-start strong {
  font-size: 1rem; font-weight: 700; color: var(--shc-primary);
  display: block; margin-bottom: .15rem;
}
.novato-shc button.shc-custom-start small {
  color: var(--shc-muted); font-size: .8rem; font-weight: 400;
}
.novato-shc button.shc-custom-start > div:not(.shc-custom-start-icon) { flex: 1; }
.shc-custom-arrow { color: var(--shc-primary); transition: transform .2s; }
.novato-shc button.shc-custom-start:hover .shc-custom-arrow { transform: translateX(4px); }

/* Karsilastir link */
.shc-step0-actions { display: flex; justify-content: center; margin: 1.25rem 0; }
.novato-shc button.shc-link-btn {
  background: transparent !important; background-color: transparent !important;
  border: none !important; color: var(--shc-primary) !important;
  font-family: inherit !important; font-size: .85rem !important;
  font-weight: 600 !important; cursor: pointer !important;
  padding: .5rem 1rem !important; text-decoration: none !important;
  text-transform: none !important; letter-spacing: 0 !important;
  height: auto !important; min-height: 0 !important; width: auto !important;
  box-shadow: none !important; display: inline-flex !important;
  align-items: center !important; gap: .4rem !important;
  transition: all .2s !important;
}
.novato-shc button.shc-link-btn:hover {
  color: var(--shc-primary-dark) !important; transform: translateY(-1px);
}

/* ================================================================
   STEP 1 — Room Selection + Floor Plan
   ================================================================ */
.shc-step1-layout {
  display: grid; grid-template-columns: 1fr 320px; gap: 1.5rem; align-items: start;
}
@media (max-width: 900px) { .shc-step1-layout { grid-template-columns: 1fr; } }

.shc-room-grid {
  display: grid; gap: .85rem;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}
.shc-room-card {
  background: white; border: 1px solid var(--shc-border);
  border-radius: 14px; padding: 1.15rem 1rem; text-align: center;
  transition: all .25s; cursor: default;
}
.shc-room-card:hover { border-color: var(--shc-border-hover); }
.shc-room-card.has-count {
  border-color: var(--shc-primary); background: var(--shc-primary-soft);
  box-shadow: 0 4px 16px rgba(30,58,82,.1);
}
.shc-room-card-icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--shc-surface); color: var(--shc-muted);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto .55rem; transition: all .25s;
}
.shc-room-card.has-count .shc-room-card-icon {
  background: var(--shc-primary); color: #ffffff;
}
.shc-room-card h5 {
  margin: 0 0 .65rem; font-size: .9rem; font-weight: 600; color: var(--shc-text);
}
/* Counter */
.shc-counter {
  display: inline-flex; align-items: center; gap: 0;
  border-radius: var(--shc-radius-sm); overflow: hidden;
  box-shadow: var(--shc-shadow);
}
.novato-shc button.shc-counter-btn {
  width: 32px !important; height: 32px !important; border-radius: 0 !important;
  border: 1px solid var(--shc-border) !important;
  background: #ffffff !important; background-color: #ffffff !important;
  color: var(--shc-primary) !important; font-size: 1.05rem !important;
  font-weight: 700 !important; cursor: pointer !important;
  display: flex !important; align-items: center !important;
  justify-content: center !important; line-height: 1 !important;
  padding: 0 !important; transition: all .15s !important;
  text-transform: none !important; letter-spacing: 0 !important;
  text-decoration: none !important; min-height: 0 !important;
  box-shadow: none !important; font-family: inherit !important;
}
.novato-shc button.shc-counter-btn:first-child {
  border-top-left-radius: var(--shc-radius-sm) !important;
  border-bottom-left-radius: var(--shc-radius-sm) !important;
  border-right: none !important;
}
.novato-shc button.shc-counter-btn:last-child {
  border-top-right-radius: var(--shc-radius-sm) !important;
  border-bottom-right-radius: var(--shc-radius-sm) !important;
  border-left: none !important;
}
.novato-shc button.shc-counter-btn:hover {
  background: var(--shc-primary) !important; background-color: var(--shc-primary) !important;
  border-color: var(--shc-primary) !important; color: #ffffff !important;
}
.shc-counter-value {
  min-width: 38px; text-align: center; font-weight: 700; font-size: .88rem;
  color: var(--shc-text); height: 32px; display: inline-flex;
  align-items: center; justify-content: center;
  background: var(--shc-surface); border-top: 1px solid var(--shc-border);
  border-bottom: 1px solid var(--shc-border);
}

/* ================================================================
   FLOOR PLAN
   ================================================================ */
.shc-floorplan-wrap {
  background: var(--shc-surface); border: 1px solid var(--shc-border);
  border-radius: 16px; padding: 1rem; position: sticky; top: 1rem;
}
.shc-floorplan-header {
  display: flex; align-items: center; gap: .4rem;
  font-size: .72rem; font-weight: 700; color: var(--shc-primary);
  text-transform: uppercase; letter-spacing: .05em;
  margin-bottom: .75rem; padding-bottom: .55rem;
  border-bottom: 1px solid var(--shc-border);
}
.shc-floorplan {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px;
  min-height: 120px;
}
.shc-fp-room {
  background: #ffffff; border: 2px solid var(--shc-border);
  border-radius: var(--shc-radius-sm); padding: .55rem .4rem;
  text-align: center; transition: all .3s;
  animation: shc-fp-in .3s ease;
  cursor: pointer; min-height: 60px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .2rem;
}
@keyframes shc-fp-in { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }
.shc-fp-room:hover { border-color: var(--shc-primary); }
.shc-fp-room.is-active {
  border-color: var(--shc-primary); background: var(--shc-primary-soft);
}
.shc-fp-room-name {
  font-size: .62rem; font-weight: 700; color: var(--shc-primary);
  line-height: 1.1; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; max-width: 100%;
}
.shc-fp-room-devices {
  font-size: .55rem; color: var(--shc-muted); font-weight: 500;
}
.shc-fp-room-icons {
  display: flex; gap: 1px; flex-wrap: wrap; justify-content: center;
}
.shc-fp-room-icons svg { width: 10px; height: 10px; color: var(--shc-primary); opacity: .6; }
/* Salon = genis (2 kolon), giris-koridor = yatay genis */
.shc-fp-room[data-fp-type="salon"],
.shc-fp-room[data-fp-type="oturma-odasi"] { grid-column: span 2; }
.shc-fp-room[data-fp-type="giris-koridor"],
.shc-fp-room[data-fp-type="bahce"] { grid-column: span 3; }

.shc-floorplan-empty {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: .5rem; padding: 2rem 1rem;
  color: var(--shc-muted);
}
.shc-floorplan-empty p { margin: 0; font-size: .78rem; text-align: center; }

/* Step 2 mini floor plan */
.shc-floorplan-mini {
  display: flex; gap: 4px; flex-wrap: wrap;
  padding: .5rem 0; margin-bottom: .5rem;
  justify-content: center;
}
.shc-fp-mini-room {
  background: var(--shc-primary-soft); border: 1px solid var(--shc-primary);
  border-radius: 6px; padding: .25rem .55rem;
  font-size: .62rem; font-weight: 600; color: var(--shc-primary);
  cursor: pointer; transition: all .2s;
}
.shc-fp-mini-room:hover, .shc-fp-mini-room.is-active {
  background: var(--shc-primary); color: #ffffff;
}

/* Step 3 final floor plan */
.shc-floorplan-final {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 6px; margin-bottom: 1.5rem; padding: 1rem;
  background: var(--shc-surface); border: 1px solid var(--shc-border);
  border-radius: 16px;
}
.shc-fp-final-room {
  background: #ffffff; border: 2px solid var(--shc-border);
  border-radius: var(--shc-radius-sm); padding: .65rem .5rem;
  text-align: center; min-height: 70px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .25rem;
}
.shc-fp-final-room[data-fp-type="salon"],
.shc-fp-final-room[data-fp-type="oturma-odasi"],
.shc-fp-final-room[data-fp-type="_main"] { grid-column: span 2; border-color: var(--shc-primary); }
.shc-fp-final-room[data-fp-type="giris-koridor"],
.shc-fp-final-room[data-fp-type="bahce"] { grid-column: 1 / -1; }
.shc-fp-final-room-name { font-size: .68rem; font-weight: 700; color: var(--shc-primary); }
.shc-fp-final-room-count {
  font-size: .58rem; color: var(--shc-muted); font-weight: 500;
}
.shc-fp-final-room-cost {
  font-size: .7rem; font-weight: 700; color: var(--shc-text); margin-top: .15rem;
}

/* ================================================================
   STEP 2 — Device Customization
   ================================================================ */
.shc-step2-header { margin-bottom: .75rem; }
.shc-step2-title { text-align: left !important; margin-bottom: .5rem !important; }
.shc-step2-layout {
  display: grid; grid-template-columns: 220px minmax(0, 1fr) 260px;
  gap: 1.25rem; align-items: start;
}
@media (max-width: 1100px) {
  .shc-step2-layout { grid-template-columns: minmax(0, 1fr) 260px; }
  .shc-sidebar-tips { display: none; }
}
@media (max-width: 800px) {
  .shc-step2-layout { grid-template-columns: 1fr; }
  .shc-sidebar-recos { position: static !important; }
}
.shc-sidebar { position: sticky; top: 1rem; }

/* Sidebar tutar */
.shc-sidebar-total {
  background: linear-gradient(135deg, #0f2236, #1e3a52);
  color: #ffffff; padding: 1.15rem; border-radius: var(--shc-radius);
  margin-bottom: .75rem; text-align: center;
  box-shadow: 0 4px 16px rgba(30,58,82,.2);
}
.shc-sidebar-total-label {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .06em;
  opacity: .7; margin-bottom: .3rem;
}
.shc-sidebar-total strong {
  display: block; font-size: 1.6rem; font-weight: 800; color: #ffffff;
  letter-spacing: -.02em;
}
.shc-total-breakdown {
  margin-top: .65rem; padding-top: .65rem;
  border-top: 1px solid rgba(255,255,255,.15); text-align: left;
}
.shc-bd-row {
  display: flex; justify-content: space-between;
  font-size: .72rem; padding: .2rem 0; color: rgba(255,255,255,.7);
}
.shc-bd-row span:last-child { font-weight: 600; color: #ffffff; }

/* Sidebar cards & buttons */
.shc-sidebar-card {
  background: var(--shc-surface); border: 1px solid var(--shc-border);
  border-radius: var(--shc-radius); padding: 1rem;
}
.shc-sidebar-title {
  margin: 0 0 .75rem; font-size: .78rem; font-weight: 700;
  color: var(--shc-primary); text-transform: uppercase;
  letter-spacing: .05em; display: flex; align-items: center; gap: .4rem;
}
.novato-shc button.shc-btn.shc-cart-review-btn {
  width: 100% !important; display: flex !important;
  margin-bottom: .75rem !important; padding: .8rem 1rem !important;
  font-size: .75rem !important; gap: .4rem !important;
}
.shc-sidebar-actions {
  display: flex; flex-direction: column; gap: .5rem; margin-bottom: .75rem;
}
.novato-shc button.shc-btn.shc-sidebar-continue,
.novato-shc button.shc-btn.shc-sidebar-back {
  width: 100% !important; display: flex !important;
  padding: .75rem 1rem !important; font-size: .75rem !important;
}

/* Ipuclari */
.shc-tips-list { margin: 0; padding: 0; list-style: none; }
.shc-tips-list li {
  position: relative; padding: .45rem 0 .45rem 1rem;
  font-size: .75rem; line-height: 1.5; color: #334155;
  border-bottom: 1px solid var(--shc-border);
}
.shc-tips-list li:last-child { border-bottom: none; }
.shc-tips-list li::before {
  content: ""; position: absolute; left: 0; top: .8rem;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--shc-primary);
}

/* AJAX arama sonuclari */
.shc-ajax-results { margin-top: .5rem; }
.shc-ajax-heading {
  font-size: .7rem; font-weight: 600; text-transform: uppercase;
  color: var(--shc-muted); padding: .4rem 0; border-top: 1px dashed var(--shc-border);
  margin-bottom: .25rem; letter-spacing: .03em;
}

/* Oneriler */
.shc-recos-empty { font-size: .75rem; color: var(--shc-muted); font-style: italic; }
.shc-reco-item {
  padding: .55rem 0; border-bottom: 1px solid var(--shc-border);
  font-size: .75rem; line-height: 1.45; color: #334155;
}
.shc-reco-item:last-child { border-bottom: none; }
.shc-reco-item strong {
  display: block; color: var(--shc-primary); font-size: .78rem; margin-bottom: .1rem;
}

/* AI review result */
#shc-review-result {
  font-size: .78rem; line-height: 1.5; color: var(--shc-text);
  border-color: var(--shc-primary); background: var(--shc-primary-soft);
  margin-bottom: .75rem;
}
#shc-review-result h5 {
  margin: 0 0 .5rem; font-size: .8rem; color: var(--shc-primary); font-weight: 700;
}
#shc-review-result p { margin: 0 0 .55rem; color: #334155; }
#shc-review-result ul { margin: .35rem 0 0; padding-left: 1rem; }
#shc-review-result li { margin-bottom: .3rem; color: #334155; }

/* ================================================================
   ROOMS LIST — Step 2 content
   ================================================================ */
.shc-rooms-list { display: flex; flex-direction: column; gap: .85rem; }
.shc-room-block {
  background: white; border: 1px solid var(--shc-border);
  border-radius: var(--shc-radius); padding: 1rem;
  transition: border-color .2s;
}
.shc-room-block:hover { border-color: var(--shc-border-hover); }
.shc-room-block[data-type="_main"] {
  background: linear-gradient(135deg, var(--shc-primary-soft) 0%, #ffffff 100%);
  border-color: var(--shc-primary); border-width: 2px;
}
.shc-room-block[data-type="_main"] .shc-room-block-header h4 { color: var(--shc-primary); }
.shc-room-block-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: .65rem;
}
.shc-room-block-header h4 {
  margin: 0; font-size: .95rem; font-weight: 700; color: var(--shc-text);
}
.shc-room-subtotal {
  color: var(--shc-primary-dark); font-weight: 700; font-size: .88rem;
  background: var(--shc-primary-soft); padding: .2rem .65rem;
  border-radius: 999px;
}
.shc-device-line {
  display: flex; align-items: center; gap: .65rem;
  padding: .55rem 0; border-top: 1px solid var(--shc-border);
}
.shc-device-line:nth-child(2) { border-top: none; }
.shc-device-thumb {
  width: 38px; height: 38px; border-radius: var(--shc-radius-sm);
  object-fit: cover; background: var(--shc-surface); flex-shrink: 0;
  border: 1px solid var(--shc-border);
}
.shc-device-info { flex: 1; min-width: 0; }
.shc-device-info strong {
  font-size: .82rem; display: block; color: var(--shc-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.shc-device-info small { color: var(--shc-muted); font-size: .7rem; }
.shc-device-line-total {
  font-weight: 700; min-width: 78px; text-align: right;
  font-size: .82rem; color: var(--shc-text);
}
.shc-device-remove {
  background: none; border: none; cursor: pointer;
  color: var(--shc-muted); font-size: 1rem; padding: .15rem;
  width: 26px; height: 26px; display: flex; align-items: center;
  justify-content: center; border-radius: 6px; transition: all .15s;
}
.shc-device-remove:hover { color: var(--shc-danger); background: #fef2f2; }

/* Add device */
.shc-add-device-row {
  margin-top: .65rem; padding-top: .65rem;
  border-top: 1px dashed var(--shc-border);
}
.novato-shc button.shc-add-device-btn {
  display: inline-flex !important; align-items: center !important;
  justify-content: center !important; gap: .35rem !important;
  width: 100% !important; padding: .65rem .85rem !important;
  background: #ffffff !important; background-color: #ffffff !important;
  border: 1px dashed var(--shc-primary) !important;
  border-radius: var(--shc-radius-sm) !important;
  color: var(--shc-primary) !important; font-family: inherit !important;
  font-size: .78rem !important; font-weight: 600 !important;
  cursor: pointer !important; transition: all .15s !important;
  text-decoration: none !important; height: auto !important;
  min-height: 0 !important; line-height: 1.2 !important;
  box-shadow: none !important; text-transform: none !important;
  letter-spacing: 0 !important;
}
.novato-shc button.shc-add-device-btn:hover {
  background: var(--shc-primary-soft) !important;
  background-color: var(--shc-primary-soft) !important;
  border-style: solid !important;
}
.novato-shc button.shc-add-device-btn.is-open {
  background: var(--shc-primary) !important;
  background-color: var(--shc-primary) !important;
  color: #ffffff !important; border-style: solid !important;
  border-color: var(--shc-primary) !important;
}

.shc-add-device-wrap {
  margin-top: .55rem; padding: .75rem;
  background: var(--shc-surface); border: 1px solid var(--shc-border);
  border-radius: var(--shc-radius-sm); animation: shc-fade .2s ease;
}
.novato-shc input.shc-add-search,
.novato-shc input[type="search"].shc-add-search,
.novato-shc input[type="text"].shc-add-search {
  display: block !important; width: 100% !important;
  padding: .65rem .85rem !important; border: 1px solid var(--shc-border) !important;
  border-radius: var(--shc-radius-sm) !important;
  background: #ffffff !important; background-color: #ffffff !important;
  color: var(--shc-text) !important; font-family: inherit !important;
  font-size: .85rem !important; margin: 0 0 .55rem 0 !important;
  outline: none !important; box-shadow: none !important;
  height: auto !important; min-height: 0 !important; line-height: 1.4 !important;
  -webkit-appearance: none !important; appearance: none !important;
}
.novato-shc input.shc-add-search:focus {
  border-color: var(--shc-primary) !important;
  box-shadow: 0 0 0 3px rgba(30,58,82,.1) !important;
}
.novato-shc input.shc-add-search::placeholder { color: #94a3b8 !important; }

.shc-cat-filters { display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: .55rem; }
.novato-shc button.shc-cat-chip {
  background: #ffffff !important; background-color: #ffffff !important;
  border: 1px solid var(--shc-border) !important; border-radius: 999px !important;
  padding: .3rem .75rem !important; cursor: pointer !important;
  font-size: .68rem !important; font-weight: 600 !important;
  color: var(--shc-muted) !important; transition: all .15s !important;
  font-family: inherit !important; text-transform: none !important;
  letter-spacing: 0 !important; display: inline-flex !important;
  align-items: center !important; line-height: 1.2 !important;
  height: auto !important; min-height: 0 !important; width: auto !important;
  text-decoration: none !important; box-shadow: none !important;
}
.novato-shc button.shc-cat-chip:hover {
  background: var(--shc-primary-soft) !important;
  background-color: var(--shc-primary-soft) !important;
  color: var(--shc-primary) !important; border-color: var(--shc-primary) !important;
}
.novato-shc button.shc-cat-chip.is-active {
  background: var(--shc-primary) !important;
  background-color: var(--shc-primary) !important;
  color: #ffffff !important; border-color: var(--shc-primary) !important;
}

.shc-add-empty {
  text-align: center; padding: 1.25rem .5rem;
  color: var(--shc-muted); font-size: .82rem; font-style: italic;
}
.shc-add-device-panel {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: .45rem; background: transparent; border: none; padding: 0;
}
.novato-shc button.shc-add-card {
  display: flex !important; align-items: center !important;
  gap: .5rem !important; padding: .55rem .6rem !important;
  background: #ffffff !important; background-color: #ffffff !important;
  border: 1px solid var(--shc-border) !important;
  border-radius: var(--shc-radius-sm) !important;
  cursor: pointer !important; transition: all .15s !important;
  text-align: left !important; font-family: inherit !important;
  width: 100% !important; height: auto !important; min-height: 0 !important;
  text-decoration: none !important; color: var(--shc-text) !important;
  text-transform: none !important; letter-spacing: 0 !important;
  font-weight: 400 !important; box-shadow: none !important;
}
.novato-shc button.shc-add-card:hover {
  border-color: var(--shc-primary) !important;
  background: var(--shc-primary-soft) !important;
  background-color: var(--shc-primary-soft) !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(30,58,82,.08) !important;
}
.shc-add-card-thumb {
  width: 36px; height: 36px; border-radius: var(--shc-radius-sm);
  object-fit: cover; background: var(--shc-surface);
  border: 1px solid var(--shc-border); flex-shrink: 0;
}
.shc-add-card-info { flex: 1; min-width: 0; }
.shc-add-card-info strong {
  display: block; font-size: .75rem; font-weight: 600; color: var(--shc-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: .1rem;
}
.shc-add-card-info small { display: block; font-size: .7rem; color: var(--shc-primary); font-weight: 600; }
.shc-add-card-plus {
  display: flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--shc-primary); color: #ffffff;
  font-size: .9rem; font-weight: 700; flex-shrink: 0;
}

/* ================================================================
   STEP 3 — Summary
   ================================================================ */
.shc-step3-layout {
  display: grid; grid-template-columns: 1fr 380px; gap: 1.5rem; align-items: start;
}
@media (max-width: 900px) { .shc-step3-layout { grid-template-columns: 1fr; } }

.shc-summary {
  background: white; border: 1px solid var(--shc-border);
  border-radius: var(--shc-radius); padding: 1rem;
}
.shc-summary-room {
  padding: .65rem 0; border-bottom: 1px solid var(--shc-border);
}
.shc-summary-room:last-child { border-bottom: none; }
.shc-summary-room h5 {
  margin: 0 0 .3rem; font-size: .88rem; color: var(--shc-primary);
  font-weight: 700;
}
.shc-summary-room ul {
  margin: 0; padding-left: 1rem;
  font-size: .78rem; color: var(--shc-muted); line-height: 1.6;
}

.shc-totals {
  padding: 1rem 1.15rem; background: white;
  border: 1px solid var(--shc-border); border-radius: var(--shc-radius);
  margin-bottom: 1rem;
}
.shc-totals-row {
  display: flex; justify-content: space-between;
  padding: .3rem 0; font-size: .85rem; color: var(--shc-muted);
}
.shc-totals-row.grand {
  font-size: 1.1rem; font-weight: 800; color: var(--shc-text);
  padding-top: .65rem; border-top: 2px solid var(--shc-primary);
  margin-top: .4rem;
}
.shc-totals-row.discount { color: var(--shc-success); }
.shc-totals-row.install { color: var(--shc-muted); font-style: italic; }

/* Contact form */
.shc-contact {
  background: white; border: 1px solid var(--shc-border);
  padding: 1rem 1.15rem; border-radius: var(--shc-radius);
  margin-bottom: 1rem;
}
.shc-contact-title {
  margin: 0 0 .85rem; font-size: .85rem; font-weight: 700;
  color: var(--shc-primary);
}
.shc-form-row {
  display: grid; gap: .55rem;
  grid-template-columns: 1fr 1fr; margin-bottom: .55rem;
}
@media (max-width: 600px) { .shc-form-row { grid-template-columns: 1fr; } }
.shc-contact input[type="text"],
.shc-contact input[type="tel"],
.shc-contact input[type="email"] {
  width: 100%; padding: .7rem .85rem;
  border-radius: var(--shc-radius-sm); border: 1px solid var(--shc-border);
  background: white; color: var(--shc-text);
  font-family: inherit; font-size: .85rem;
  transition: border-color .2s, box-shadow .2s;
  margin-bottom: .55rem;
}
.shc-contact input:focus {
  outline: none; border-color: var(--shc-primary);
  box-shadow: 0 0 0 3px rgba(30,58,82,.1);
}
.shc-kvkk {
  display: flex; align-items: flex-start; gap: .5rem;
  margin-top: .55rem; font-size: .75rem; color: var(--shc-muted);
}
.shc-kvkk input { margin-top: .15rem; accent-color: var(--shc-primary); }

/* ================================================================
   BUTTONS
   ================================================================ */
.novato-shc .shc-actions {
  display: flex !important; gap: .55rem; flex-wrap: wrap; margin-top: 1rem;
}
.novato-shc .shc-actions-grid {
  display: grid !important; grid-template-columns: 1fr 1fr; gap: .55rem;
}
@media (max-width: 600px) { .novato-shc .shc-actions-grid { grid-template-columns: 1fr !important; } }

.novato-shc button.shc-btn {
  padding: .85rem 1.5rem !important; border-radius: var(--shc-radius-sm) !important;
  border: 1px solid transparent !important; cursor: pointer !important;
  font-family: inherit !important; font-size: .78rem !important;
  font-weight: 700 !important; text-transform: none !important;
  letter-spacing: .01em !important;
  display: inline-flex !important; align-items: center !important;
  justify-content: center !important; gap: .45rem !important;
  transition: all .2s !important; line-height: 1.2 !important;
  box-shadow: var(--shc-shadow) !important;
  text-decoration: none !important; height: auto !important;
  min-height: 0 !important; width: auto !important;
}
.novato-shc button.shc-btn:disabled { opacity: .5 !important; cursor: not-allowed !important; }
.novato-shc button.shc-btn:focus-visible,
.novato-shc button.shc-preset-card:focus-visible,
.novato-shc button.shc-custom-start:focus-visible,
.novato-shc button.shc-chip:focus-visible,
.novato-shc button.shc-counter-btn:focus-visible,
.novato-shc button.shc-add-card:focus-visible {
  outline: 2px solid var(--shc-accent) !important;
  outline-offset: 2px !important;
}

.novato-shc button.shc-btn-primary {
  background: var(--shc-primary) !important;
  background-color: var(--shc-primary) !important;
  color: #ffffff !important; border-color: var(--shc-primary) !important;
}
.novato-shc button.shc-btn-primary:hover:not(:disabled) {
  background: var(--shc-primary-dark) !important;
  background-color: var(--shc-primary-dark) !important;
  border-color: var(--shc-primary-dark) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(30,58,82,.25) !important;
}

.novato-shc button.shc-btn-ghost {
  background: #ffffff !important; background-color: #ffffff !important;
  border: 1px solid var(--shc-border) !important; color: var(--shc-muted) !important;
}
.novato-shc button.shc-btn-ghost:hover {
  background: var(--shc-surface) !important;
  background-color: var(--shc-surface) !important;
  border-color: var(--shc-primary) !important; color: var(--shc-primary) !important;
}

.novato-shc button.shc-btn-cart,
.novato-shc button.shc-btn-pdf {
  background: var(--shc-primary) !important;
  background-color: var(--shc-primary) !important;
  color: #ffffff !important; border-color: var(--shc-primary) !important;
}
.novato-shc button.shc-btn-cart:hover,
.novato-shc button.shc-btn-pdf:hover {
  background: var(--shc-primary-dark) !important;
  background-color: var(--shc-primary-dark) !important;
  border-color: var(--shc-primary-dark) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(30,58,82,.25) !important;
}

.novato-shc button.shc-btn-wa {
  background: var(--shc-wa-green) !important;
  background-color: var(--shc-wa-green) !important;
  color: #ffffff !important; border-color: var(--shc-wa-green) !important;
}
.novato-shc button.shc-btn-wa:hover {
  background: #1eb958 !important; background-color: #1eb958 !important;
  border-color: #1eb958 !important; transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(37,211,102,.3) !important;
}

/* ================================================================
   TOAST & LOADER
   ================================================================ */
.shc-toast {
  position: fixed; bottom: 2rem; left: 50%; transform: translateX(-50%);
  background: var(--shc-text); color: white;
  padding: .85rem 1.25rem; border-radius: 12px;
  box-shadow: var(--shc-shadow-xl); z-index: 9999;
  font-size: .85rem; max-width: 90vw;
  animation: shc-toast-in .3s ease;
}
@keyframes shc-toast-in { from { opacity: 0; transform: translateX(-50%) translateY(20px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
.shc-toast.error { background: var(--shc-danger); }
.shc-toast.success { background: var(--shc-primary); }
.shc-loader {
  position: fixed; inset: 0; background: rgba(255,255,255,.8);
  z-index: 9998; display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
.shc-loader-inner {
  display: flex; flex-direction: column; align-items: center; gap: .75rem;
}
.shc-loader-inner span { font-size: .82rem; color: var(--shc-muted); font-weight: 500; }
.shc-spinner {
  width: 40px; height: 40px; border-radius: 50%;
  border: 3px solid rgba(30,58,82,.15);
  border-top-color: var(--shc-primary);
  animation: shc-spin .8s linear infinite;
}
@keyframes shc-spin { to { transform: rotate(360deg); } }

/* ================================================================
   MODAL
   ================================================================ */
.shc-modal {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  padding: 2rem 1rem; animation: shc-fade .2s ease;
}
.shc-modal-backdrop {
  position: absolute; inset: 0; background: rgba(15,23,42,.6);
  backdrop-filter: blur(4px);
}
.shc-modal-dialog {
  position: relative; background: #ffffff; border-radius: 20px;
  box-shadow: var(--shc-shadow-xl); max-width: 1200px;
  width: 100%; max-height: 90vh; display: flex; flex-direction: column;
}
.shc-modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.15rem 1.5rem; border-bottom: 1px solid var(--shc-border);
  background: var(--shc-surface); border-radius: 20px 20px 0 0;
}
.shc-modal-header h3 {
  margin: 0; font-size: 1.1rem; font-weight: 700; color: var(--shc-primary);
}
.novato-shc button.shc-modal-close {
  background: transparent !important; background-color: transparent !important;
  border: none !important; color: var(--shc-muted) !important;
  cursor: pointer !important; width: 36px !important; height: 36px !important;
  border-radius: var(--shc-radius-sm) !important;
  display: flex !important; align-items: center !important;
  justify-content: center !important; padding: 0 !important;
  transition: all .15s !important; font-family: inherit !important;
  text-transform: none !important; letter-spacing: 0 !important;
  min-height: 0 !important; box-shadow: none !important; line-height: 1 !important;
}
.novato-shc button.shc-modal-close:hover {
  background: var(--shc-surface) !important;
  background-color: var(--shc-surface) !important;
  color: var(--shc-primary) !important;
}
.shc-modal-body { padding: 1.5rem; overflow-y: auto; flex: 1; }

/* Compare grid */
.shc-compare-grid { display: grid; gap: 1rem; }
.shc-compare-col {
  background: #ffffff; border: 1px solid var(--shc-border);
  border-radius: 14px; padding: 1.25rem 1.15rem;
  display: flex; flex-direction: column; gap: .5rem;
  transition: all .25s;
}
.shc-compare-col:hover {
  border-color: var(--shc-primary); box-shadow: var(--shc-shadow-md);
}
.shc-compare-name { font-size: 1rem; font-weight: 700; color: var(--shc-primary); }
.shc-compare-price {
  display: flex; flex-direction: column; padding: .65rem 0;
  border-top: 1px solid var(--shc-border); border-bottom: 1px solid var(--shc-border);
}
.shc-compare-price strong { font-size: 1.3rem; font-weight: 800; color: var(--shc-primary); }
.shc-compare-price small {
  font-size: .68rem; color: var(--shc-success); font-weight: 600;
  text-transform: uppercase; letter-spacing: .05em; margin-top: .1rem;
}
.shc-compare-desc { margin: 0; font-size: .75rem; color: var(--shc-muted); line-height: 1.5; }
.shc-compare-stats { display: flex; gap: .55rem; margin: .35rem 0; }
.shc-compare-stat {
  flex: 1; text-align: center; background: var(--shc-surface);
  padding: .5rem; border-radius: var(--shc-radius-sm);
}
.shc-compare-stat strong { display: block; font-size: 1.15rem; font-weight: 800; color: var(--shc-primary); }
.shc-compare-stat small {
  display: block; font-size: .62rem; color: var(--shc-muted);
  text-transform: uppercase; letter-spacing: .04em; margin-top: .1rem;
}
.shc-compare-section-title {
  margin: .55rem 0 .2rem; font-size: .7rem; font-weight: 700;
  color: var(--shc-primary); text-transform: uppercase; letter-spacing: .04em;
}
.shc-compare-col ul {
  margin: 0; padding-left: 1rem; font-size: .72rem; color: #334155; line-height: 1.6;
}
.novato-shc button.shc-compare-select {
  margin-top: auto !important; padding: .7rem 1rem !important;
  font-size: .72rem !important; width: 100% !important;
}
@media (max-width: 800px) {
  .shc-compare-grid { grid-template-columns: 1fr !important; }
}

/* ================================================================
   MOBILE RESPONSIVE
   ================================================================ */
@media (max-width: 768px) {
  .novato-shc { margin: .5rem; border-radius: 14px; }
  .shc-step { padding: 1.25rem 1rem; }
  .shc-header { padding: 1.75rem 1rem 1.25rem; }
  .shc-title { font-size: 1.35rem; }
  .shc-subtitle { font-size: .8rem; }
  .shc-step-label { display: none; }
  .shc-preset-grid { grid-template-columns: 1fr; }
  .shc-room-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .65rem; }
  .shc-step1-layout { grid-template-columns: 1fr; }
  .shc-floorplan-wrap { position: static; }
  .shc-step2-layout { grid-template-columns: 1fr; }
  .shc-sidebar { position: static !important; }
  .shc-sidebar-tips { display: none; }
  .shc-step3-layout { grid-template-columns: 1fr; }
  .shc-floorplan { grid-template-columns: repeat(2, 1fr); }
  .shc-fp-room[data-fp-type="giris-koridor"],
  .shc-fp-room[data-fp-type="bahce"] { grid-column: span 2; }
  .shc-floorplan-final { grid-template-columns: repeat(2, 1fr); }
  .shc-fp-final-room[data-fp-type="giris-koridor"],
  .shc-fp-final-room[data-fp-type="bahce"] { grid-column: 1 / -1; }
  .shc-ai-form { flex-direction: column; }
  .novato-shc button.shc-ai-send { width: 100% !important; height: 40px !important; }
  .shc-novai { padding: 1rem; }
  .novato-shc button.shc-custom-start { padding: 1rem !important; }
  .shc-add-device-panel { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .novato-shc { margin: 0; border-radius: 0; }
  .shc-step { padding: 1rem .75rem; }
  .shc-header { padding: 1.5rem .75rem 1rem; }
  .shc-title { font-size: 1.15rem; }
  .shc-room-grid { grid-template-columns: repeat(2, 1fr); }
  .shc-room-card { padding: .85rem .65rem; }
  .shc-room-card h5 { font-size: .8rem; }
  .shc-device-line { gap: .4rem; }
  .shc-device-thumb { width: 30px; height: 30px; }
  .shc-device-info strong { font-size: .75rem; }
  .shc-device-line-total { min-width: 60px; font-size: .75rem; }
  .novato-shc .shc-actions-grid { grid-template-columns: 1fr !important; }
  .shc-floorplan-mini { justify-content: flex-start; }
  .shc-progress { gap: .3rem; padding: .4rem .5rem; }
  .shc-step-num { width: 20px; height: 20px; font-size: .6rem; }
  .shc-step-line { width: 16px; }
}

/* ================================================================
   ACCESSIBILITY: prefers-reduced-motion
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
  .novato-shc *,
  .novato-shc *::before,
  .novato-shc *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .shc-toast { animation: none; }
  .shc-modal { animation: none; }
}

/* ================================================================
   TEXT OVERFLOW SAFETY
   ================================================================ */
.shc-ai-msg {
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
}
.shc-preset-card h5,
.shc-preset-desc,
.shc-compare-name,
.shc-compare-desc,
.shc-fp-room-name,
.shc-fp-final-room-name,
.shc-device-info strong,
.shc-device-info small {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.shc-preset-card h5 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ─── v2.2: AI Hero variant — Novai daha öne çıkar ─── */
.shc-novai.shc-novai-hero {
    background: #ffffff;
    box-shadow: 0 10px 40px rgba(30, 58, 82, 0.10), 0 2px 10px rgba(59, 130, 246, 0.08);
    border: 1px solid rgba(30, 58, 82, 0.12);
    position: relative;
}
.shc-novai.shc-novai-hero::before {
    content: "ÖNERİLEN";
    position: absolute;
    top: -10px; left: 20px;
    background: linear-gradient(90deg, #1e3a52, #3b82f6);
    color: #fff; font-size: 10px; font-weight: 700;
    padding: 4px 10px; border-radius: 12px;
    letter-spacing: 1px;
    box-shadow: 0 2px 8px rgba(30, 58, 82, 0.25);
}
.shc-novai-badge {
    display: inline-block;
    font-size: 10px; font-weight: 600;
    background: linear-gradient(90deg, #fbbf24, #f59e0b);
    color: #78350f;
    padding: 2px 8px; border-radius: 10px;
    margin-left: 6px; vertical-align: middle;
    animation: shc-pulse 2s ease-in-out infinite;
}
@keyframes shc-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.05); opacity: 0.9; }
}
.shc-novai.shc-novai-hero .shc-novai-greeting strong {
    color: #1e3a52;
}
/* Preset kartları biraz küçülsün, AI daha dikkat çeksin */
@media (min-width: 768px) {
    .shc-preset-grid { margin-top: 1rem; }
}

/* ─── v2.3: Global overflow + box-sizing guard (mobil taşma fix) ─── */
.novato-shc, .novato-shc * { box-sizing: border-box; }
.novato-shc { max-width: 100%; overflow-x: hidden; }
.novato-shc img, .novato-shc svg { max-width: 100%; height: auto; }
.novato-shc textarea, .novato-shc input[type="text"], .novato-shc input[type="email"], .novato-shc input[type="tel"] {
    max-width: 100%; min-width: 0;
}
.shc-preset-grid, .shc-room-grid, .shc-device-grid, .shc-step2-layout, .shc-step1-layout, .shc-form-row {
    min-width: 0;
}

/* ─── v2.2: Mobile responsive audit fix ─── */
@media (max-width: 640px) {
    .shc-novai-header { flex-wrap: wrap; gap: 8px; }
    .shc-novai-status { margin-left: auto; font-size: 11px; }
    .shc-preset-card { padding: 12px; font-size: 14px; }
    .shc-preset-stats { flex-wrap: wrap; gap: 6px; font-size: 11px; }
    .shc-step2-layout { grid-template-columns: 1fr !important; }
    .shc-sidebar-tips, .shc-sidebar-recos { order: 2; }
    .shc-sidebar-total strong { font-size: 20px !important; }
    .shc-actions-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
    .shc-actions-grid .shc-btn { padding: 10px 8px !important; font-size: 13px !important; }
    .shc-form-row { grid-template-columns: 1fr !important; }
    .shc-step1-layout { grid-template-columns: 1fr !important; }
    .shc-room-grid { grid-template-columns: repeat(2, 1fr); }
    .shc-chip { font-size: 12px; padding: 6px 10px; }
}
@media (max-width: 420px) {
    .shc-title { font-size: 20px !important; }
    .shc-subtitle { font-size: 13px; }
    .shc-room-grid { grid-template-columns: 1fr; }
    .shc-ai-examples { flex-wrap: wrap; gap: 6px; }
}

/* ─── v2.3: Mobil overflow ek koruması — Step 2/3 + Novai hero ─── */
@media (max-width: 640px) {
    .shc-novai { padding: 1rem; }
    .shc-novai.shc-novai-hero { padding: 1rem; margin: 0 0 .5rem; }
    .shc-novai-hero::before { left: 12px; }
    .shc-novai-avatar { width: 40px; height: 40px; }
    .shc-novai-intro strong { font-size: .95rem; }
    .shc-ai-form { flex-wrap: wrap; }
    .shc-ai-form textarea { width: 100%; }
    .shc-ai-examples { flex-wrap: wrap; }

    /* Step 2 chip bar — yatay scroll ile taşmayı önle */
    .shc-room-chips, .shc-step2-tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap !important; }
    .shc-room-chips::-webkit-scrollbar, .shc-step2-tabs::-webkit-scrollbar { height: 3px; }

    /* Device line / cart rows — uzun ürün isimleri taşmasın */
    .shc-device-row, .shc-cart-row, .shc-room-devices { min-width: 0; }
    .shc-device-row *, .shc-cart-row * { min-width: 0; }
    .shc-device-name, .shc-product-name { word-break: break-word; overflow-wrap: anywhere; }

    /* Preset kartında uzun açıklama */
    .shc-preset-card h5, .shc-preset-card p { word-break: break-word; }

    /* Novai chat mesaj baloncukları */
    #shc-review-result { max-width: 100%; }
    .shc-novai-msg { max-width: 95%; }
    .shc-novai-body { word-break: break-word; overflow-wrap: anywhere; }
    .shc-novai-input-row { flex-wrap: nowrap; }
    .shc-novai-input { min-width: 0; }
    .shc-novai-send { padding: 8px 12px !important; }
}

/* ==========================================================
   Novai Chat Panel
   ========================================================== */
#shc-review-result { padding: 0 !important; overflow: hidden; display: flex; flex-direction: column; max-height: 560px; }
.shc-novai-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 14px; border-bottom: 1px solid #e5e7eb; background: #f9fafb;
}
.shc-novai-header h5 { margin: 0; font-size: 14px; font-weight: 600; color: #111827; }
.shc-novai-header-title { display: flex; align-items: center; gap: 8px; }
.shc-novai-chat-avatar { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; background: #fff; flex-shrink: 0; }
.shc-novai-clear {
    background: transparent; border: none; font-size: 20px; line-height: 1;
    width: 26px; height: 26px; border-radius: 50%; cursor: pointer; color: #6b7280;
}
.shc-novai-clear:hover { background: #e5e7eb; color: #111827; }
.shc-novai-messages {
    flex: 1; min-height: 160px; max-height: 380px; overflow-y: auto;
    padding: 12px 14px; display: flex; flex-direction: column; gap: 10px;
    background: #fff; scroll-behavior: smooth;
}
.shc-novai-empty { margin: 0; font-size: 13px; color: #6b7280; text-align: center; padding: 20px 10px; }
.shc-novai-msg { max-width: 90%; display: flex; }
.shc-novai-msg-user { align-self: flex-end; }
.shc-novai-msg-ai { align-self: flex-start; }
.shc-novai-body {
    padding: 8px 12px; border-radius: 12px; font-size: 13px; line-height: 1.5;
    word-wrap: break-word; word-break: break-word;
}
.shc-novai-msg-user .shc-novai-body {
    background: #1e3a8a; color: #fff; border-bottom-right-radius: 4px;
}
.shc-novai-msg-ai .shc-novai-body {
    background: #f3f4f6; color: #111827; border-bottom-left-radius: 4px;
}
.shc-novai-body p { margin: 0 0 6px 0; }
.shc-novai-body p:last-child { margin-bottom: 0; }
.shc-novai-body ul { margin: 6px 0; padding-left: 20px; }
.shc-novai-body li { margin: 2px 0; }
.shc-novai-body code {
    background: rgba(0,0,0,0.08); padding: 1px 5px; border-radius: 3px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px;
}
.shc-novai-msg-user .shc-novai-body code { background: rgba(255,255,255,0.2); }
.shc-novai-typing .shc-novai-body { opacity: 0.7; font-style: italic; }
.shc-novai-input-row {
    display: flex; gap: 8px; padding: 10px 12px;
    border-top: 1px solid #e5e7eb; background: #f9fafb;
}
.shc-novai-input {
    flex: 1; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 8px;
    font-size: 13px; background: #fff; outline: none;
}
.shc-novai-input:focus { border-color: #1e3a8a; box-shadow: 0 0 0 2px rgba(30,58,138,0.1); }
.shc-novai-send { padding: 8px 16px !important; font-size: 13px !important; white-space: nowrap; }
.shc-novai-send:disabled { opacity: 0.6; cursor: not-allowed; }
@media (max-width: 480px) {
    #shc-review-result { max-height: 460px; }
    .shc-novai-messages { max-height: 280px; }
    .shc-novai-body { font-size: 12.5px; }
}