/* Insta Smart Audit Pro — App CSS (Clean UI19)
   Frontend UI cleanup (no behavior changes): remove duplicated/conflicting blocks.
*/

/* Global safety */
body.isa-audit-route{ overflow-x:hidden; }
.isa-app, .isa-app *{ box-sizing:border-box; }
.isa-app button, .isa-app input, .isa-app select, .isa-app textarea{ font-family: inherit; }

/* ===== App Theme ===== */
.isa-app{
  --bg:#0b0f17;
  --bg2:#111a2e;
  --card:rgba(255,255,255,.04);
  --card2:rgba(255,255,255,.06);
  --border:rgba(255,255,255,.10);
  --stroke:var(--border);
  --text:rgba(255,255,255,.94);
  --muted:rgba(255,255,255,.68);
  --primary:#bc39f4;
  --primary2:#396afc;
  --success:#22c55e;
  --danger:#ef4444;
  --warning:#f59e0b;
  --radius:22px;
  --shadow:0 25px 50px -12px rgba(0,0,0,.55);
  --shadow-soft:0 10px 30px rgba(0,0,0,.25);

  color:var(--text);
  background:
    radial-gradient(circle at 12% 10%, rgba(188,57,244,0.22) 0%, transparent 55%),
    radial-gradient(circle at 88% 18%, rgba(57,106,252,0.16) 0%, transparent 60%),
    linear-gradient(135deg, var(--bg) 0%, var(--bg2) 100%);
  border-radius: calc(var(--radius) + 6px);
  padding: 40px 20px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--shadow);
}

.isa-app[data-isa-theme="light"]{
  --bg:#f6f7fb;
  --bg2:#eef2ff;
  --card:rgba(255,255,255,.78);
  --card2:rgba(255,255,255,.92);
  --border:rgba(20,20,30,.12);
  --text:rgba(10,12,18,.92);
  --muted:rgba(10,12,18,.65);
  --shadow:0 14px 40px rgba(10,12,18,.10);
}

/* ===== Layout ===== */
.isa-app__topbar{
  max-width:1050px;
  margin:0 auto 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.isa-app__brand .isa-app__title{ font-size:20px; font-weight:900; letter-spacing:.2px; }
.isa-app__brand .isa-app__subtitle{ font-size:13px; color:var(--muted); margin-top:2px; }

.isa-app__themeToggle{
  width:42px; height:42px;
  border-radius:12px;
  border:1px solid var(--border);
  background:var(--card);
  box-shadow: var(--shadow-soft);
  cursor:pointer;
  display:grid; place-items:center;
  color:var(--text);
}

.isa-app__main{ max-width:1050px; margin:0 auto; }

/* ===== Cards ===== */
.isa-card{
  border:1px solid var(--border);
  background:var(--card);
  border-radius: var(--radius);
  box-shadow: 0 8px 32px rgba(0,0,0,.20);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow:hidden;
}
.isa-card--panel{ padding:14px; margin: 0 0 14px 0; }
.isa-card--panel:last-child{ margin-bottom:0; }

/* The full report wrapper should not look like a separate card (avoid nested-card effect) */
.isa-report-wrap{
  border:0 !important;
  background: transparent !important;
  box-shadow:none !important;
  padding: 0 !important;
}

/* ===== Form ===== */
.isa-form__row{ display:flex; gap:10px; flex-wrap:wrap; }
.isa-input{
  flex:1;
  min-width:240px;
  height:48px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(0,0,0,.40);
  color:var(--text);
  outline:none;
}
.isa-app[data-isa-theme="light"] .isa-input{ background: rgba(255,255,255,.92); }
.isa-input:focus{
  border-color: rgba(188,57,244,.55);
  box-shadow: 0 0 0 3px rgba(188,57,244,.18);
}

.isa-btn{
  height:46px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid var(--border);
  cursor:pointer;
  font-weight:900;
  color:var(--text);
  background: rgba(255,255,255,.08);
  transition: transform .12s ease, filter .12s ease, background .12s ease, border-color .12s ease;
}
.isa-btn:active{ transform: translateY(1px); filter: brightness(1.05); }
.isa-btn:focus-visible{ outline:none; box-shadow: 0 0 0 3px rgba(188,57,244,.18); border-color: rgba(188,57,244,.55); }
.isa-btn[disabled], .isa-btn:disabled{ opacity:.65; cursor:not-allowed; }

.isa-btn--primary{
  background: linear-gradient(90deg, var(--primary), var(--primary2));
  border-color: rgba(188,57,244,.35);
}

.isa-alert{
  margin-top:12px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(0,0,0,.40);
}
.isa-alert--danger{ border-color: rgba(239,68,68,.35); }
.isa-alert--warning{ border-color: rgba(245,158,11,.35); }
.isa-muted{ color:var(--muted); }

/* ===== Summary Header ===== */
.isa-summaryCard{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border-radius: 18px;
  border:1px solid var(--border);
  background: var(--card2);
}
.isa-summaryCard__left{ display:flex; align-items:center; gap:10px; min-width:0; }
.isa-summaryCard__right{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

.isa-avatar{ width:52px; height:52px; border-radius: 18px; object-fit:cover; border:1px solid var(--border); }
.isa-name{ font-weight:900; font-size:14px; }
.isa-handle{ color:var(--muted); font-size:13px; }

.isa-metric{
  display:grid;
  gap:2px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.05);
  min-width:0;
}
.isa-metric span{ font-size:11px; color:var(--muted); }
.isa-metric strong{ font-size:13px; }

/* ===== KPI grid ===== */
.isa-kpiGrid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:10px;
  margin-top:12px;
}
@media (min-width:560px){ .isa-kpiGrid{ grid-template-columns: repeat(4, 1fr); } }

.isa-kpiCard{
  padding:12px;
  border-radius:16px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.05);
  display:grid;
  gap:4px;
  min-width:0;
}
.isa-kpiCard span{ font-size:11px; color:var(--muted); }
.isa-kpiCard strong{ font-size:15px; font-weight:900; line-height:1.2; }
.isa-kpiCard small{ font-size:11px; color:var(--muted); line-height:1.4; }

/* ===== AI Output containment ===== */
.isa-ai-output{ overflow-wrap:anywhere; word-break:break-word; }
.isa-ai-output *{ max-width:100%; }
.isa-ai-output img, .isa-ai-output video{ max-width:100%; height:auto; }
.isa-ai-output pre, .isa-ai-output code{ white-space: pre-wrap; word-break: break-word; }
.isa-ai-output ul, .isa-ai-output ol{ padding-inline-start: 22px; }

/* ===== Accordion (Flat, unified card) ===== */
.isa-acc{ display:flex; flex-direction:column; gap:12px; }

.isa-acc-item{
  border: 1px solid var(--border);
  background: rgba(15,23,42,.30);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 4px 25px rgba(0,0,0,.20);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.isa-acc-btn{
  width:100%;
  border:0;
  background: linear-gradient(90deg, rgba(188,57,244,.08), rgba(57,106,252,.05));
  color: var(--text);
  padding: 16px 20px;
  display:flex;
  align-items:center;
  gap: 12px;
  cursor:pointer;
  text-align:right;
  font-weight: 900;
}
.isa-acc-btn:hover{ background: rgba(255,255,255,.05); }

.isa-acc-leading{
  width:34px; height:34px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  flex: 0 0 auto;
}
.isa-acc-leading svg{ width:18px; height:18px; display:block; }

.isa-acc-title{
  flex:1 1 auto;
  min-width:0;
  font-size: 14px;
  line-height: 1.3;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}

.isa-acc-icon{
  flex: 0 0 auto;
  margin-inline-start: auto;
  transition: transform .22s ease;
  opacity: .9;
}
.isa-acc-icon svg{ width:18px; height:18px; display:block; }
.isa-acc-item.is-open .isa-acc-icon{ transform: rotate(180deg); color: var(--primary); }

.isa-acc-panel{ border-top: 1px solid rgba(255,255,255,.06); }
.isa-acc-panel[hidden]{ display:none; }

.isa-acc-panel__inner{
  padding: 20px;
}

/* Clean imported legacy sections to avoid nested-card look INSIDE accordion panels */
.isa-acc-panel__inner .isa-pro-section,
.isa-acc-panel__inner .isa-premium-section,
.isa-acc-panel__inner .isa-card,
.isa-acc-panel__inner .isa-box,
.isa-acc-panel__inner .isa-pro-card{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Highlight box */
.isa-highlight{
  display:block;
  margin: 12px 0 14px;
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.09);
  line-height: 1.85;
  position: relative;
}
.isa-highlight:before{
  content:"";
  position:absolute;
  inset: 10px auto 10px 10px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(188,57,244,.95), rgba(57,106,252,.95));
}
html[dir="rtl"] .isa-highlight:before{ inset: 10px 10px 10px auto; }
.isa-highlight *{ margin:0; }

/* Mobile tweaks */
@media (max-width: 760px){
  .isa-app{
    position: relative;
    left: 50%; right: 50%;
    margin-left: -50vw; margin-right: -50vw;
    width: 100vw; max-width: 100vw;
    overflow-x: hidden;
    min-height: 100vh;
    padding: 14px 12px 26px;
  }
  .isa-app__topbar, .isa-app__main{ max-width:none; }
  .isa-form__row{ flex-direction:column; }
  .isa-input{ min-width:0; font-size:16px; }
  .isa-btn{ width:100%; }
  .isa-acc-title{ white-space: normal; overflow: visible; text-overflow: unset; }
}


/* ===== Share Icons (Guest Preview) ===== */
.isa-shareIcons{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.isa-shareIcon{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: var(--text);
  text-decoration:none;
  line-height: 1;
  min-height: 44px; /* touch friendly */
}
.isa-shareIcon svg{
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}
.isa-shareIcon span{
  font-size: 13px;
  color: var(--muted);
}
.isa-shareIcon:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow-soft);
}
@media (max-width: 520px){
  .isa-shareIcons{ gap: 8px; }
  .isa-shareIcon{ flex: 1 1 calc(50% - 8px); justify-content:center; padding: 10px; }
  .isa-shareIcon span{ font-size: 12px; }
}

/* ===== Guest Learn Panel ===== */
.isa-card--learn{ padding: 0 !important; }
.isa-learn{
  padding: 18px 16px;
}
.isa-learn__head{ margin-bottom: 14px; }
.isa-learn__title{
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .2px;
}
.isa-learn__sub{
  margin-top: 6px;
  font-size: 13px;
  color: var(--muted);
}
.isa-hookGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.isa-hookCard{
  border: 1px solid var(--border);
  background: var(--card);
  border-radius: 18px;
  padding: 12px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap: 10px;
  min-height: 110px;
}
.isa-hookText{
  font-size: 13px;
  color: var(--text);
  line-height: 1.45;
}
.isa-miniBtn{
  align-self:flex-start;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.06);
  color: var(--text);
  font-weight: 700;
  cursor: pointer;
}
.isa-miniBtn:hover{ box-shadow: var(--shadow-soft); transform: translateY(-1px); }

.isa-strengths{
  margin-top: 14px;
  border: 1px dashed rgba(255,255,255,.14);
  border-radius: 18px;
  padding: 12px;
  background: rgba(255,255,255,.03);
}
.isa-strengths__title{
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 8px;
}
.isa-strengths__list{
  margin: 0;
  padding: 0 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.isa-ctaRow{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.isa-ctaRow .isa-btn{ flex: 1 1 240px; }
@media (max-width: 820px){
  .isa-hookGrid{ grid-template-columns: 1fr; }
  .isa-hookCard{ min-height: unset; }
}

/* Small toast */
.isa-toast{
  position: fixed;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: var(--text);
  box-shadow: var(--shadow-soft);
  z-index: 999999;
  max-width: min(520px, calc(100vw - 30px));
  font-size: 13px;
}