.nikoo-readmore{
  --nikoo-primary:#1d4ed8;
  --nikoo-accent:#f4b400;
  --nikoo-radius:14px;
  --nikoo-shadow:0 8px 24px rgba(0,0,0,.08);
  position:relative;
  width:100%;
}

.nikoo-readmore__content{
  position:relative;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:var(--nikoo-radius);
  padding:16px 18px 56px 18px;
  box-shadow:var(--nikoo-shadow);
  overflow:hidden;
}

/* Collapsed clamp */
.nikoo-readmore.is-collapsed .nikoo-readmore__content{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:var(--nikoo-lines,2);
  overflow:hidden;
}

/* Fade overlay */
.nikoo-readmore.is-collapsed .nikoo-readmore__content:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:64px;
  background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.92) 45%, rgba(255,255,255,1));
  pointer-events:none;
}

.nikoo-readmore__footer{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:12px 14px;
  display:flex;
  justify-content:center;
  align-items:center;
  pointer-events:none; /* allow overlay click-through except button */
}

.nikoo-readmore__btn{
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:170px;
  height:44px;
  padding:0 18px;
  border-radius:999px;
  border:2px solid rgba(29,78,216,.25);
    background:rgba(255,255,255,.88);
  color:var(--nikoo-primary);
  font-weight:700;
  cursor:pointer;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}

.nikoo-readmore__btn:hover{
  box-shadow:0 10px 24px rgba(29,78,216,.18);
  transform:translateY(-1px);
  border-color:var(--nikoo-primary);
}

.nikoo-readmore__btn:active{
  transform:translateY(0);
  box-shadow:0 6px 18px rgba(29,78,216,.12);
}

.nikoo-readmore__btn:focus{
  outline:none;
}

.nikoo-readmore__btn:focus-visible{
  box-shadow:0 0 0 3px rgba(244,180,0,.35);
}

/* Expanded state: footer goes under content */
.nikoo-readmore.is-expanded .nikoo-readmore__content{
  padding-bottom:16px;
}

.nikoo-readmore.is-expanded .nikoo-readmore__footer{
  position:static;
  padding-top:10px;
  pointer-events:auto;
}

/* Optional: make button accent when expanded */
.nikoo-readmore.is-expanded .nikoo-readmore__btn{
  border-color: rgba(244,180,0,.55);
  color:#111827;
}

/* RTL friendliness */
html[dir="rtl"] .nikoo-readmore__content{
  direction:rtl;
}