/* ========================
   Minimal black / white / gray
   Small buttons + fixes
   ======================== */

/* Greyscale variables */
.gac-trigger,
.gac-modal{
  --gac-primary: #111;
  --gac-primary-light: #f0f0f0;
  --gac-primary-dark: #000;
  --gac-accent: #555;
  --gac-success: #111;
  --gac-text: #111;
  --gac-text-light: #6b7280;
  --gac-border: #e5e7eb;
  --gac-bg: #ffffff;
  --gac-bg-soft: #f7f7f7;
  --gac-shadow: 0 12px 40px rgba(0,0,0,.12);
  --gac-radius: 12px;
  --gac-radius-sm: 8px;
}

/* Trigger (small) */
.gac-trigger{
  margin:.3rem 0 .4rem .5rem !important;
  padding:.4rem .7rem !important;
  border:1.5px solid var(--gac-primary) !important;
  border-radius:14px !important;
  background:var(--gac-primary) !important;
  color:#fff !important;
  cursor:pointer !important;
  font-weight:600 !important;
  font-size:.82rem !important;
  line-height:1 !important;
  transition:all .2s ease !important;
  box-shadow:none !important;
}
.gac-trigger:hover{ background:#222 !important; transform:translateY(-1px) !important; }
.gac-trigger:active{ background:#000 !important; transform:translateY(0) !important; }

/* Modal shell */
body .gac-modal, html body .gac-modal{
  position:fixed !important; inset:0 !important;
  width:100vw !important; height:100vh !important;
  display:none !important; align-items:center !important; justify-content:center !important;
  z-index:2147483647 !important; pointer-events:auto !important;
}
body .gac-modal.show, html body .gac-modal.show{ display:flex !important; }

body .gac-backdrop, html body .gac-backdrop{
  position:absolute !important; inset:0 !important;
  background:rgba(0,0,0,.45) !important; z-index:1 !important;
}

/* Dialog */
body .gac-dialog, html body .gac-dialog{
  position:relative !important;
  width:min(980px,95vw) !important; max-width:980px !important; max-height:90vh !important;
  overflow:auto !important; background:var(--gac-bg) !important;
  border-radius:var(--gac-radius) !important; box-shadow:var(--gac-shadow) !important;
  display:flex !important; flex-direction:column !important; z-index:2 !important; margin:auto !important;
}

/* Header */
.gac-head{
  display:flex !important; align-items:center !important; gap:10px !important;
  padding:14px 16px !important; border-bottom:1.5px solid var(--gac-border) !important; background:var(--gac-bg-soft) !important;
}
.gac-title{ font-size:1.1rem !important; font-weight:700 !important; color:var(--gac-text) !important; }
.gac-x{
  margin-left:auto !important; border:0 !important; background:transparent !important;
  font-size:22px !important; cursor:pointer !important; color:var(--gac-text-light) !important;
  width:30px !important; height:30px !important; display:flex !important; align-items:center !important; justify-content:center !important;
  border-radius:50% !important; transition:all .2s ease !important;
}
.gac-x:hover{ background:rgba(0,0,0,.06) !important; color:var(--gac-text) !important; }
.gac-meta{ display:flex !important; gap:8px !important; align-items:center !important; font-size:.82rem !important; color:var(--gac-text-light) !important; }
.gac-test{ display:none !important; }
.gac-quota{
  background:var(--gac-bg) !important; padding:.2rem .5rem !important; border-radius:999px !important;
  border:1px solid var(--gac-border) !important; font-weight:600 !important; color:var(--gac-text) !important; font-size:.78rem !important;
}

/* Tabs (small) */
.gac-tabs{
  display:flex !important; gap:6px !important; padding:10px 12px !important;
  border-bottom:1px solid var(--gac-border) !important; background:var(--gac-bg) !important;
}
.gac-tabs button{
  border:1.5px solid var(--gac-border) !important; background:var(--gac-bg) !important;
  padding:.32rem .6rem !important; border-radius:999px !important; cursor:pointer !important;
  font-weight:500 !important; color:var(--gac-text) !important; transition:all .2s ease !important; font-size:.8rem !important; line-height:1 !important;
}
.gac-tabs button:hover{ background:var(--gac-bg-soft) !important; }
.gac-tabs button.on{ background:#111 !important; border-color:#111 !important; color:#fff !important; }

/* Ẩn Advanced & Quick (nếu tồn tại) */
.gac-adv, .gac-adv-grid,
.gac-tabs .tab-advanced, .gac-tabs .tab-quick,
.gac-actions .btn-advanced, .gac-actions .btn-quick,
.gac-advanced, .gac-quick { display:none !important; }

/* Body grid */
.gac-body{
  display:grid !important; grid-template-columns:1.1fr 1fr !important;
  gap:16px !important; padding:16px !important; background:var(--gac-bg) !important;
}

/* Left form */
.gac-left .gac-field{ margin-bottom:.8rem !important; }
.gac-label{ font-weight:600 !important; margin-bottom:.35rem !important; color:var(--gac-text) !important; font-size:.9rem !important; }
.gac-chips{ display:flex !important; flex-wrap:wrap !important; gap:.35rem !important; }

/* Chip (small) */
.chip{
  border:1.5px solid var(--gac-border) !important; background:var(--gac-bg) !important;
  padding:.28rem .55rem !important; border-radius:999px !important; cursor:pointer !important;
  color:var(--gac-text) !important; font-weight:500 !important; font-size:.8rem !important; transition:all .2s ease !important; line-height:1 !important;
}
.chip:hover{ border-color:#111 !important; background:#f2f2f2 !important; }
.chip.on{ border-color:#111 !important; background:#111 !important; color:#fff !important; transform:translateY(-1px) !important; }

.gac-rows{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:10px !important; }
.gac-adv{ margin-top:.4rem !important; }

.gac-left textarea,
.gac-left select,
.gac-left input[type="number"]{
  width:100% !important; padding:.5rem .65rem !important;
  border:1.5px solid var(--gac-border) !important; border-radius:8px !important;
  background:var(--gac-bg) !important; color:var(--gac-text) !important;
  font-family:inherit !important; font-size:.9rem !important; transition:all .2s ease !important;
}
.gac-left textarea{ min-height:74px !important; resize:vertical !important; }
.gac-left textarea:focus,
.gac-left select:focus,
.gac-left input[type="number"]:focus{
  outline:none !important; border-color:#111 !important; box-shadow:0 0 0 3px #e5e5e5 !important;
}

/* Right output */
.gac-right{ display:flex !important; flex-direction:column !important; gap:14px !important; }
.gac-output-section{
  border:1.5px solid var(--gac-border) !important; border-radius:12px !important; overflow:hidden !important; background:var(--gac-bg) !important;
}
.gac-section-title{
  background:var(--gac-bg-soft) !important; padding:.5rem .8rem !important; font-weight:700 !important; font-size:.9rem !important;
  color:var(--gac-text) !important; border-bottom:1.5px solid var(--gac-border) !important;
}
.gac-output{ padding:.8rem !important; background:var(--gac-bg) !important; min-height:70px !important; }
.gac-media-output{ min-height:56px !important; }
.gac-media-item{
  padding:.5rem !important; margin:.35rem 0 !important; background:var(--gac-bg) !important;
  border:1px solid var(--gac-border) !important; border-radius:8px !important; line-height:1.5 !important; color:var(--gac-text) !important;
}
.gac-media-item strong{ color:#333 !important; display:block !important; margin-bottom:.25rem !important; font-size:.82rem !important; }
.gac-out-title{ font-weight:700 !important; margin-top:.45rem !important; color:#333 !important; font-size:.85rem !important; text-transform:uppercase !important; letter-spacing:.4px !important; }
.gac-out-title:first-child{ margin-top:0 !important; }
.gac-out-titlev{ margin-bottom:.65rem !important; font-size:1rem !important; font-weight:600 !important; color:var(--gac-text) !important; }
.gac-out-msg{ white-space:pre-wrap !important; line-height:1.6 !important; color:var(--gac-text) !important; }

/* Actions (small) */
.gac-actions{ display:flex !important; gap:.35rem !important; flex-wrap:wrap !important; }
.gac-actions button{
  border:1.5px solid var(--gac-border) !important; background:var(--gac-bg) !important;
  padding:.38rem .6rem !important; border-radius:999px !important; cursor:pointer !important;
  font-weight:500 !important; transition:all .2s ease !important; color:var(--gac-text) !important; font-size:.82rem !important; line-height:1 !important;
}
.gac-actions button:hover{ background:var(--gac-bg-soft) !important; }

/* Primary actions (Generate + Insert) — always visible */
.gac-gen,
.gac-insert{
  background:#111 !important; border-color:#111 !important; color:#fff !important; font-weight:600 !important;
}
.gac-gen:hover, .gac-insert:hover{ background:#222 !important; transform:translateY(-1px) !important; }
.gac-busy .gac-gen{ opacity:.7 !important; cursor:progress !important; }

/* Variants */
.gac-variants{
  border:1px solid var(--gac-border) !important; border-radius:12px !important; padding:.7rem !important; background:var(--gac-bg-soft) !important;
}
.gac-vtitle{ font-weight:600 !important; margin-bottom:.45rem !important; color:var(--gac-text) !important; font-size:.9rem !important; }
.gac-card{
  border:1.5px solid var(--gac-border) !important; border-radius:8px !important;
  padding:.5rem .65rem !important; margin:.35rem 0 !important; background:var(--gac-bg) !important; cursor:pointer !important; transition:all .2s ease !important;
}
.gac-card:hover{ border-color:#111 !important; background:#f2f2f2 !important; transform:translateX(3px) !important; }
.gac-card .gac-vtitle{ font-size:.9rem !important; color:#111 !important; }
.gac-card .gac-vmsg{ font-size:.82rem !important; color:var(--gac-text-light) !important; margin-top:.25rem !important; }

/* Raw debug */
.gac-raw summary{ cursor:pointer !important; font-weight:600 !important; padding:.45rem !important; color:var(--gac-text-light) !important; font-size:.82rem !important; }
.gac-raw pre{
  background:#111 !important; color:#eee !important; padding:.7rem .9rem !important; border-radius:8px !important;
  max-height:30vh !important; overflow:auto !important; font-size:.82rem !important; line-height:1.4 !important;
}

/* Footer */
.gac-foot{
  display:flex !important; gap:.4rem !important; justify-content:flex-end !important;
  padding:10px 12px !important; border-top:1.5px solid var(--gac-border) !important; background:var(--gac-bg) !important;
}
.gac-foot button{
  padding:.45rem .8rem !important; border:1.5px solid var(--gac-border) !important; border-radius:999px !important;
  background:var(--gac-bg) !important; cursor:pointer !important; font-weight:600 !important; transition:all .2s ease !important; font-size:.82rem !important; line-height:1 !important;
}

/* Responsive */
@media (max-width:800px){
  .gac-body{ grid-template-columns:1fr !important; }
  .gac-rows{ grid-template-columns:1fr !important; }
  .gac-adv-grid{ grid-template-columns:repeat(2,1fr) !important; }
}