/* thream Create Intention composer — premium responsive redesign, publishing logic untouched */

/* Backdrop */
div[class*="fixed"][class*="inset-0"][class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]){
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:28px!important;
  background:rgba(15,23,42,.46)!important;
  backdrop-filter:blur(10px) saturate(115%)!important;
}

/* Modal shell */
div[class*="fixed"][class*="inset-0"][class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]{
  position:relative!important;
  inset:auto!important;
  width:min(780px,calc(100vw - 56px))!important;
  max-width:780px!important;
  max-height:min(850px,92dvh)!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  border:1px solid rgba(226,232,240,.9)!important;
  border-radius:30px!important;
  background:#fff!important;
  padding:0 30px 28px!important;
  box-shadow:0 30px 90px rgba(15,23,42,.26),0 8px 28px rgba(15,23,42,.08)!important;
  color:#0f172a!important;
  font-family:'Plus Jakarta Sans',Inter,system-ui,sans-serif!important;
  scrollbar-width:thin!important;
  scrollbar-color:#cbd5e1 transparent!important;
}

/* Header */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child{
  position:sticky!important;
  top:0!important;
  z-index:12!important;
  margin:0 -30px!important;
  min-height:86px!important;
  padding:20px 30px!important;
  background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid #eef2f7!important;
  backdrop-filter:blur(18px)!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child>strong{
  font-size:20px!important;
  font-weight:850!important;
  letter-spacing:-.035em!important;
  color:#0f172a!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child>button:first-child{
  width:44px!important;
  height:44px!important;
  border-radius:14px!important;
  background:#f8fafc!important;
  border:1px solid #e9eef5!important;
  display:grid!important;
  place-items:center!important;
  color:#334155!important;
  transition:.18s ease!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child>button:first-child:hover{background:#eef4ff!important;color:#155eef!important}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child>button:last-child{
  min-height:46px!important;
  border-radius:14px!important;
  padding:0 21px!important;
  background:#155eef!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:850!important;
  box-shadow:0 10px 24px rgba(21,94,239,.22)!important;
  transition:.18s ease!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child>button:last-child:not(:disabled):hover{transform:translateY(-1px)!important;box-shadow:0 13px 28px rgba(21,94,239,.28)!important}

/* Post type switcher */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(2){
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:24px!important;
  padding:6px!important;
  border:1px solid #e6ecf4!important;
  border-radius:18px!important;
  background:#f7f9fc!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(2)>button{
  min-height:48px!important;
  border:0!important;
  border-radius:13px!important;
  background:transparent!important;
  color:#64748b!important;
  font-size:12px!important;
  font-weight:800!important;
  box-shadow:none!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(2)>button[class*="bg-blue-50"]{
  background:#fff!important;
  color:#155eef!important;
  box-shadow:0 2px 10px rgba(15,23,42,.07),inset 0 0 0 1px #d9e6ff!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(2)>button[class*="bg-rose-50"]{
  background:#fff!important;
  color:#d43c56!important;
  box-shadow:0 2px 10px rgba(15,23,42,.07),inset 0 0 0 1px #ffe0e6!important;
}

/* Intention selector */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3){
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  overflow:visible!important;
  margin-top:24px!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3)::before{
  content:'What is your intention?';
  grid-column:1/-1;
  font-size:12px;
  font-weight:850;
  letter-spacing:-.01em;
  color:#334155;
  margin-bottom:1px;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3)>button{
  min-width:0!important;
  min-height:58px!important;
  border-radius:15px!important;
  border:1px solid #e2e8f0!important;
  background:#fff!important;
  color:#475569!important;
  padding:10px 12px!important;
  white-space:normal!important;
  font-size:11px!important;
  font-weight:750!important;
  box-shadow:0 1px 2px rgba(15,23,42,.02)!important;
  transition:border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3)>button:hover{
  transform:translateY(-1px)!important;
  border-color:#c5d5ee!important;
  background:#fbfdff!important;
  box-shadow:0 5px 14px rgba(15,23,42,.05)!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3)>button[class*="bg-blue-600"]{
  border-color:#3b82f6!important;
  background:#eff6ff!important;
  color:#155eef!important;
  box-shadow:inset 0 0 0 1px rgba(21,94,239,.08),0 6px 16px rgba(21,94,239,.08)!important;
}

/* Audience selector */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) label:has(select){
  display:block!important;
  margin-top:24px!important;
  font-size:11px!important;
  font-weight:850!important;
  color:#475569!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) label:has(select)>select{
  min-height:56px!important;
  margin-top:8px!important;
  border-radius:15px!important;
  border:1px solid #dbe3ef!important;
  background:#fbfcfe!important;
  padding:0 16px!important;
  font-size:13px!important;
  color:#334155!important;
  box-shadow:none!important;
  outline:none!important;
}

/* Inputs */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Title (optional)"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Tags separated by commas"]{
  min-height:52px!important;
  border-radius:15px!important;
  border:1px solid #dbe3ef!important;
  background:#fff!important;
  padding:0 16px!important;
  font-size:13px!important;
  box-shadow:none!important;
  outline:none!important;
}

/* Main writing area */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) textarea[placeholder="What do you want to share?"]{
  min-height:210px!important;
  border-radius:18px!important;
  border:1px solid #dbe3ef!important;
  background:#fbfcfe!important;
  padding:20px!important;
  font-size:15px!important;
  line-height:1.7!important;
  outline:none!important;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.02)!important;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) textarea[placeholder="What do you want to share?"]:focus{
  background:#fff!important;
  border-color:#8fb5ff!important;
  box-shadow:0 0 0 4px rgba(21,94,239,.08)!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) textarea[placeholder="What do you want to share?"]::placeholder{color:#94a3b8!important}

/* Conditional fields */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[type="datetime-local"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Location or online"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Event link (optional)"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Organisation"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Deadline"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Location / remote"],
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) input[placeholder="Application link"]{
  min-height:50px!important;
  border-radius:14px!important;
  border:1px solid #dbe3ef!important;
  background:#fbfcfe!important;
  padding:0 14px!important;
  font-size:12px!important;
  outline:none!important;
}

/* Media */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) button:has(svg[class*="lucide-image"]){
  min-height:86px!important;
  border-radius:17px!important;
  border:1.5px dashed #bfd0e4!important;
  background:#f8fbff!important;
  color:#334155!important;
  font-size:11px!important;
  font-weight:850!important;
  flex-direction:column!important;
  gap:7px!important;
}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) button:has(svg[class*="lucide-image"]):hover{background:#f1f6ff!important;border-color:#8fb5ff!important}
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) button:has(svg[class*="lucide-image"]) svg{width:22px!important;height:22px!important;color:#155eef!important}

/* Options */
div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) label:has(input[type="checkbox"]){
  margin-top:12px!important;
  border:1px solid #e2e8f0!important;
  border-radius:15px!important;
  background:#fafbfc!important;
  padding:13px 14px!important;
}

/* Mobile */
@media(max-width:767px){
  div[class*="fixed"][class*="inset-0"][class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]){
    align-items:flex-end!important;
    padding:0!important;
    backdrop-filter:blur(6px)!important;
  }
  div[class*="fixed"][class*="inset-0"][class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]{
    width:100%!important;
    max-width:none!important;
    max-height:95dvh!important;
    border-radius:26px 26px 0 0!important;
    border-bottom:0!important;
    padding:0 18px 24px!important;
  }
  div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:first-child{
    margin:0 -18px!important;
    min-height:76px!important;
    padding:16px 18px!important;
  }
  div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(2){margin-top:18px!important}
  div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3){
    display:flex!important;
    overflow-x:auto!important;
    gap:8px!important;
    scrollbar-width:none!important;
    margin-top:20px!important;
    padding-top:25px!important;
    position:relative!important;
  }
  div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3)::before{
    position:absolute!important;
    top:0!important;
    left:0!important;
    margin:0!important;
  }
  div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"])>div[class*="max-w-[620px]"]>div:nth-child(3)>button{
    min-width:108px!important;
    min-height:54px!important;
  }
  div[class*="z-[120]"]:has(textarea[placeholder="What do you want to share?"]) textarea[placeholder="What do you want to share?"]{min-height:180px!important}
}