/* Root positioning */
.ddal-root{
  position: fixed;
  bottom: var(--ddal-bottom);
  z-index: var(--ddal-z);
  direction: rtl;
}
.ddal-root{ right: var(--ddal-side); }
:root{ --ddal-side-prop: right; }
.ddal-root{ right: auto; }
.ddal-root{
  /* We'll set via JS using inline style based on position */
}

/* Floating button */
.ddal-fab{
  display:flex;
  align-items:center;
  gap:10px;
  border:0;
  cursor:pointer;
  background: var(--ddal-accent);
  color:#fff;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 800;
  font-family: system-ui, -apple-system, "Segoe UI", Arial;
  line-height: 1;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
.ddal-fab:focus{
  outline: 3px solid rgba(0,0,0,.25);
  outline-offset: 3px;
}
.ddal-fab-icon{
  width: calc(var(--ddal-icon) - 18px);
  height: calc(var(--ddal-icon) - 18px);
  display:grid;
  place-items:center;
}
.ddal-fab-label{ font-size: 14px; }

/* Panel */
.ddal-panel{
  width: var(--ddal-panel);
  background: var(--ddal-bg);
  color: var(--ddal-text);
  border-radius: 16px;
  margin-top: 12px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 18px 40px rgba(0,0,0,.14);
  overflow:hidden;
}
.ddal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 12px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.ddal-title{ font-weight: 900; font-size: 16px; }
.ddal-close{
  width: 34px; height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  background: transparent;
  cursor:pointer;
  font-size: 18px;
}
.ddal-body{ padding: 12px; }
.ddal-row{ display:flex; gap:10px; margin-bottom: 10px; }

.ddal-btn{
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  cursor:pointer;
  font-weight: 800;
}
.ddal-btn:hover{ filter: brightness(.98); }
.ddal-btn:focus{ outline: 3px solid rgba(11,116,255,.25); outline-offset: 2px; }

.ddal-btn-danger{
  background: #fff;
  border-color: rgba(220, 38, 38, .25);
}

.ddal-toggle{
  width: 100%;
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight: 800;
}
.ddal-switch{
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: rgba(0,0,0,.12);
  position: relative;
}
.ddal-switch::after{
  content:"";
  position:absolute;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  top: 2px;
  right: 2px;
  background: #fff;
  box-shadow: 0 6px 14px rgba(0,0,0,.15);
  transition: transform .2s ease;
}
.ddal-toggle.is-on .ddal-switch{ background: rgba(11,116,255,.35); }
.ddal-toggle.is-on .ddal-switch::after{ transform: translateX(-20px); }

.ddal-sep{ height: 1px; background: rgba(0,0,0,.08); margin: 12px 0; }
.ddal-note{ margin-top: 10px; font-size: 12px; opacity: .7; }

/* Responsive: hide label on small screens */
@media (max-width: 520px){
  .ddal-fab-label{ display:none; }
  .ddal-panel{ width: min(var(--ddal-panel), calc(100vw - 24px)); }
}

/* ===== Accessibility effects on site (body classes) ===== */
body.ddal-contrast{
  filter: contrast(1.18);
}
body.ddal-grayscale{
  filter: grayscale(1);
}
/* If both contrast + grayscale: combine without fighting */
body.ddal-contrast.ddal-grayscale{
  filter: contrast(1.18) grayscale(1);
}

body.ddal-underline a{
  text-decoration: underline !important;
  text-underline-offset: 2px;
  text-decoration-thickness: 2px;
}

/* Strong focus outline */
body.ddal-focus :focus{
  outline: 3px solid #0b74ff !important;
  outline-offset: 2px !important;
}

/* Text sizing levels */
body.ddal-text-1{ font-size: 106%; }
body.ddal-text-2{ font-size: 115%; }