/* İnsya Menu — açılır menü, alt menü, bölünmüş düğme (önek: iu-menu, iu-split) */
.iu-menu {
  min-width: 180px;
  outline: none;
}

.iu-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: var(--iu-row);
  padding: 0 10px 0 8px;
  border-radius: 6px;
  color: var(--iu-ink);
  cursor: pointer;
  outline: none;
  -webkit-user-select: none;
  user-select: none;
}

/* Seçili satır: temanın hover rengi, açılır pencereye uygun az vurgu (insya-ui.css --iu-pop-hover) */
.iu-menu-item:focus,
.iu-menu-item[aria-expanded="true"] {
  background: color-mix(in srgb, var(--iu-hover), var(--iu-accent) var(--iu-pop-hover));
}

.iu-menu-item[aria-disabled="true"] {
  opacity: 0.45;
  cursor: default;
}

.iu-menu-item.is-danger {
  color: var(--iu-danger);
}

.iu-menu-item.is-danger:focus {
  background: var(--iu-danger-soft, rgba(207, 10, 44, 0.08));
}

.iu-menu-ic {
  display: inline-flex;
  justify-content: center;
  width: 16px;
  color: var(--iu-ink-soft);
}

.iu-menu-item.is-danger .iu-menu-ic {
  color: inherit;
}

.iu-menu-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.iu-menu-caret {
  color: var(--iu-muted);
  font-size: 15px;
  line-height: 1;
}

.iu-menu-sep {
  height: 1px;
  margin: 4px -4px;
  background: color-mix(in srgb, var(--iu-ink) 8%, transparent);
}

.iu-menu-head {
  padding: 8px 10px 4px 8px;
  color: var(--iu-muted);
  font: 500 11.5px / 1.2 var(--iu-sans);
}

/* Bölünmüş düğme: ana eylem + ok düğmesi tek parça görünür */
.iu-split {
  display: inline-flex;
}

.iu-split > .iu-btn:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.iu-split > .iu-btn + .iu-btn {
  width: 26px;
  margin-left: -1px;
  padding: 0;
  justify-content: center;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.iu-split > .iu-btn + .iu-btn:empty::after,
.iu-btn[data-insya-menu].iu-btn--caret::after {
  content: '';
  width: 0;
  height: 0;
  border-top: 4px solid currentColor;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  opacity: 0.8;
}

.iu-btn.is-open {
  background: var(--iu-hover);
}

.iu-btn--primary.is-open {
  background: var(--iu-accent-strong);
}

/* Açılır menü kaynakları: öğe listesi (iu-menu-src) gizli durur, menü InsyaMenu ile açılınca vekil öğelerle çizilir */
.iu-menu-src {
  display: none;
}

/* Serbest içerikli açılır panel (form, kart, liste): InsyaMenu yerinde konumlar (iu-pop) */
.iu-menu-panel[hidden] {
  display: none;
}

.iu-menu-panel {
  padding: 10px;
}

.iu-menu-host {
  position: relative;
  display: inline-block;
}

/* Açılır menü oku */
.iu-caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 4px;
  border-top: 4px solid currentColor;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  vertical-align: middle;
}

/* Düğme grubu: bitişik düğmeler tek parça (açılır menü tetikleyicisi dahil) */
.iu-btn-group {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
}

.iu-btn-group > .iu-btn + .iu-btn,
.iu-btn-group > .iu-btn-group + .iu-btn,
.iu-btn-group > .iu-btn + .iu-btn-group {
  margin-left: -1px;
}

.iu-btn-group > .iu-btn:not(:first-child):not(:last-child),
.iu-btn-group > .iu-btn-group:not(:first-child):not(:last-child) > .iu-btn {
  border-radius: 0;
}

.iu-btn-group > .iu-btn:first-child:has(~ .iu-btn) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.iu-btn-group > .iu-btn:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.iu-btn-group > .iu-btn:not(:first-child):has(~ .iu-btn) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.iu-btn-group > .iu-btn:hover,
.iu-btn-group > .iu-btn:focus-visible,
.iu-btn-group > .iu-btn.is-open {
  z-index: 1;
}

.iu-btn-group--block {
  display: flex;
  width: 100%;
}

.iu-btn-group--block > .iu-btn {
  flex: 1 1 0;
}

/* Yazarken öneri listesi (iu-pop içinde): li.active seçili satır */
.iu-suggest {
  margin: 0;
  padding: 4px;
  list-style: none;
}

.iu-suggest a {
  display: block;
  padding: 5px 10px;
  border-radius: var(--iu-radius-sm);
  color: var(--iu-ink);
  text-decoration: none;
}

.iu-suggest li.active > a,
.iu-suggest a:hover {
  background: var(--iu-hover);
}
