/* Shared floating action standard: chat and notes use one navy/gold visual language. */
:root {
  --floating-action-size: 56px;
  --floating-action-gap: 12px;
  --floating-action-inset: 32px;
  --floating-action-radius: 16px;
  --floating-action-navy: #071f4f;
  --floating-action-gold: #c5aa64;
  --floating-action-bg: linear-gradient(180deg, #fffdf7 0%, #eadbc1 100%);
  --floating-action-shadow: 0 12px 26px rgba(15, 23, 42, 0.16), inset 0 0 0 1px rgba(255, 255, 255, 0.68);
}

body:not(.is-logged-out) .mobile-chat-toggle,
body:not(.is-logged-out) .global-notes-toggle {
  width: var(--floating-action-size);
  min-width: var(--floating-action-size);
  height: var(--floating-action-size);
  min-height: var(--floating-action-size);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--floating-action-navy);
  border-radius: var(--floating-action-radius);
  background: var(--floating-action-bg);
  color: var(--floating-action-navy);
  -webkit-text-fill-color: var(--floating-action-navy);
  box-shadow: var(--floating-action-shadow);
  box-sizing: border-box;
}

body:not(.is-logged-out) .global-notes-toggle i,
body:not(.is-logged-out) .global-notes-toggle svg,
body:not(.is-logged-out) .global-notes-toggle-icon {
  width: 22px;
  height: 22px;
  color: var(--floating-action-navy);
  stroke: var(--floating-action-navy);
  fill: none;
  stroke-width: 2.2;
}

@media (min-width: 769px) {
  body:not(.is-logged-out) .mobile-chat-toggle {
    position: fixed;
    right: var(--floating-action-inset);
    bottom: var(--floating-action-inset);
    padding: 8px;
    z-index: 10042;
  }

  body:not(.is-logged-out) .global-notes-widget {
    position: fixed;
    right: calc(var(--floating-action-inset) + var(--floating-action-size) + var(--floating-action-gap));
    bottom: var(--floating-action-inset);
    left: auto;
    top: auto;
    z-index: 10041;
  }
}

/* Desktop floating actions keep their standard corner position; mobile home is sourced in mobile-menu.css. */
body:not(.is-logged-out) .mobile-chat-toggle-logo {
  width: 38px;
  height: 38px;
  object-fit: contain;
  display: block;
  filter: sepia(0.46) saturate(1.22) hue-rotate(350deg) contrast(1.05);
  opacity: 0.94;
}

body:not(.is-logged-out) .mobile-chat-toggle:hover,
body:not(.is-logged-out) .global-notes-toggle:hover {
  transform: translateY(-2px);
}

body:not(.is-logged-out) .app-count-badge {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 18px;
  width: auto;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  -webkit-text-fill-color: #fff;
  border: 2px solid #fff;
  font-size: 10px;
  line-height: 14px;
  font-weight: 900;
  letter-spacing: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 8px rgba(15, 23, 42, 0.16);
  box-sizing: border-box;
}

body:not(.is-logged-out) .tab-count-badge {
  position: static;
  min-width: 22px;
  width: auto;
  height: 18px;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 999px;
  background: linear-gradient(180deg, #fffdf7 0%, #eadbc1 100%);
  color: var(--floating-action-navy);
  -webkit-text-fill-color: var(--floating-action-navy);
  border: 1.5px solid var(--floating-action-navy);
  font-size: 10px;
  line-height: 14px;
  font-weight: 900;
  letter-spacing: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  :root {
    --floating-action-size: 48px;
    --floating-action-half-size: 24px;
    --floating-action-gap: 10px;
    --floating-action-inset: max(18px, env(safe-area-inset-right));
    --mobile-action-dock-offset: 58px;
    --mobile-action-dock-bottom: max(16px, calc(12px + env(safe-area-inset-bottom)));
  }

  body:is(.client-mode, .office-mode):not(.is-logged-out):not(.ana-menu-active) {
    --corner-chat-lift: calc(var(--mobile-action-dock-bottom) + var(--floating-action-size) + 12px);
    --corner-chat-width: min(316px, calc(100vw - 28px));
    --corner-chat-height: min(560px, calc(100dvh - var(--corner-chat-lift) - 18px));
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-widget,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle {
    position: fixed;
    top: auto;
    right: auto;
    bottom: var(--mobile-action-dock-bottom);
    width: var(--floating-action-size);
    min-width: var(--floating-action-size);
    height: var(--floating-action-size);
    min-height: var(--floating-action-size);
    margin: 0;
    transform: translateX(-50%);
    box-sizing: border-box;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-widget {
    left: calc(50% - var(--mobile-action-dock-offset) - var(--floating-action-half-size));
    transform: none;
    z-index: 10042;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle {
    left: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 2px solid var(--floating-action-navy);
    border-radius: var(--floating-action-radius);
    background: var(--floating-action-bg);
    color: var(--floating-action-navy);
    -webkit-text-fill-color: var(--floating-action-navy);
    box-shadow: var(--floating-action-shadow);
    z-index: 10043;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
    -webkit-tap-highlight-color: transparent;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle {
    left: calc(50% + var(--mobile-action-dock-offset));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px;
    z-index: 10042;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle {
    width: 100%;
    min-width: 100%;
    height: 100%;
    min-height: 100%;
    padding: 0;
    border-radius: var(--floating-action-radius);
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-panel {
    position: fixed;
    left: 14px;
    right: 14px;
    bottom: var(--corner-chat-lift);
    width: auto;
    min-width: 0;
    max-width: none;
    height: var(--corner-chat-height);
    max-height: calc(100dvh - var(--corner-chat-lift) - 18px);
    transform: none;
    box-sizing: border-box;
    z-index: 15130;
  }

  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) .global-notes-widget,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) .global-notes-widget,
  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) #mobile-nav-toggle,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) #mobile-nav-toggle,
  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) .mobile-chat-toggle,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) .mobile-chat-toggle {
    position: fixed;
    top: auto;
    right: auto;
    bottom: var(--mobile-action-dock-bottom);
    width: var(--floating-action-size);
    min-width: var(--floating-action-size);
    height: var(--floating-action-size);
    min-height: var(--floating-action-size);
    margin: 0;
    z-index: 15140;
    pointer-events: auto;
    box-sizing: border-box;
  }

  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) .global-notes-widget,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) .global-notes-widget {
    left: calc(50% - var(--mobile-action-dock-offset) - var(--floating-action-half-size));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: none;
  }

  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) .global-notes-toggle,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) .global-notes-toggle {
    display: inline-flex;
    width: 100%;
    min-width: 100%;
    height: 100%;
    min-height: 100%;
    padding: 0;
  }

  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) #mobile-nav-toggle,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) #mobile-nav-toggle {
    left: calc(50% - var(--floating-action-half-size));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 2px solid var(--floating-action-navy);
    border-radius: var(--floating-action-radius);
    background: var(--floating-action-bg);
    color: var(--floating-action-navy);
    -webkit-text-fill-color: var(--floating-action-navy);
    box-shadow: var(--floating-action-shadow);
    transform: none;
  }

  body.office-mode:not(.is-logged-out):has(#dosya-detay-modal.active) .mobile-chat-toggle,
  body.office-mode:not(.is-logged-out):has(#muvekkil-detay-modal.active) .mobile-chat-toggle {
    left: calc(50% + var(--mobile-action-dock-offset) - var(--floating-action-half-size));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px;
    transform: none;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle:hover,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle:hover {
    transform: translateX(-50%) translateY(-1px);
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle:active,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle:active {
    transform: translateX(-50%) translateY(1px) scale(0.98);
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle i,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle svg,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle i,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle svg,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle-icon {
    width: 20px;
    height: 20px;
    color: var(--floating-action-navy);
    stroke: var(--floating-action-navy);
    stroke-width: 2.25;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle-logo {
    width: 30px;
    height: 30px;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .app-count-badge {
    top: -6px;
    right: -6px;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-page-nav {
    bottom: calc(var(--mobile-action-dock-bottom) + var(--floating-action-size) + 12px);
  }
}

@media (max-width: 390px) {
  :root {
    --floating-action-size: 44px;
    --floating-action-half-size: 22px;
    --floating-action-gap: 8px;
    --mobile-action-dock-offset: 52px;
    --mobile-action-dock-bottom: max(14px, calc(10px + env(safe-area-inset-bottom)));
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle {
    padding: 6px;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-chat-toggle-logo {
    width: 28px;
    height: 28px;
  }

  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle i,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .mobile-nav-toggle svg,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle i,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle svg,
  body.office-mode:not(.is-logged-out):not(.ana-menu-active) .global-notes-toggle-icon {
    width: 18px;
    height: 18px;
  }
}
body:not(.is-logged-out) .assigned-work-popover {
  position: fixed;
  right: calc(var(--floating-action-inset, 32px) + var(--floating-action-size, 56px) + var(--floating-action-gap, 12px));
  bottom: var(--corner-chat-lift, calc(var(--floating-action-inset, 32px) + var(--floating-action-size, 56px) + 8px));
  width: var(--corner-chat-width, 316px);
  max-width: calc(100vw - 48px);
  height: var(--corner-chat-height, min(580px, calc(100vh - 120px)));
  max-height: calc(100vh - var(--corner-chat-lift, 96px) - 24px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 2px solid #C5AA64;
  border-radius: 10px;
  background: #CDB592;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.35);
  z-index: 10040;
}

body:not(.is-logged-out) .assigned-work-popover.hidden {
  display: none;
}

@media (min-width: 769px) {
  body.office-mode.ana-menu-active:not(.is-logged-out) {
    --home-popup-content-left: var(--main-menu-sidebar-width, 288px);
    --home-popup-gutter: 72px;
    --home-popup-center-x: calc(var(--home-popup-content-left) + ((100vw - var(--home-popup-content-left)) / 2));
    --home-popup-width: min(420px, calc(100vw - var(--home-popup-content-left) - var(--home-popup-gutter)));
  }

  body.office-mode.ana-menu-active:not(.is-logged-out) #global-notes-widget[data-home-rail="1"] {
    position: static;
    width: 0;
    min-width: 0;
    height: 0;
    min-height: 0;
    margin: 0;
  }

  body.office-mode.ana-menu-active:not(.is-logged-out) #global-notes-widget[data-home-rail="1"] #global-notes-panel {
    position: fixed;
    top: 50%;
    left: var(--home-popup-center-x);
    right: auto;
    bottom: auto;
    width: var(--home-popup-width);
    max-width: calc(100vw - var(--home-popup-content-left) - var(--home-popup-gutter));
    height: min(580px, calc(100vh - 132px));
    max-height: calc(100vh - 132px);
    transform: translate(-50%, -50%);
  }

  body.office-mode.ana-menu-active:not(.is-logged-out) .assigned-work-popover {
    top: 50%;
    left: var(--home-popup-center-x);
    right: auto;
    bottom: auto;
    width: var(--home-popup-width);
    max-width: calc(100vw - var(--home-popup-content-left) - var(--home-popup-gutter));
    height: min(520px, calc(100vh - 132px));
    max-height: calc(100vh - 132px);
    transform: translate(-50%, -50%);
  }
}

@media (max-width: 768px) {
  body.ana-menu-active:not(.is-logged-out) #global-notes-widget[data-home-rail="1"] {
    position: static;
    width: 0;
    min-width: 0;
    height: 0;
    min-height: 0;
    margin: 0;
  }
}

.assigned-work-popover-head {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.92);
  color: #0f2556;
  border-bottom: 1px solid rgba(197, 170, 100, 0.36);
}

.assigned-work-popover-head > div:first-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.assigned-work-popover-head strong {
  font-size: 13px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.assigned-work-popover-head span {
  color: #667085;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
}

.assigned-work-popover-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 10px 8px;
  padding: 0 10px;
  height: 34px;
  border: 1.5px solid rgba(177, 151, 105, 0.52);
  border-radius: 8px;
  background: #ffffff;
  color: #B19769;
}

.assigned-work-popover-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #071f4f;
  font-size: 12px;
  font-weight: 850;
}

.assigned-work-popover-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  padding: 0 10px 10px;
}

.assigned-work-popover-summary .notes-stat {
  min-width: 0;
  padding: 7px;
  border: 1px solid rgba(197, 170, 100, 0.36);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
}

.assigned-work-popover-summary .notes-stat span {
  display: block;
  color: #64748b;
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.assigned-work-popover-summary .notes-stat b {
  display: block;
  margin-top: 3px;
  color: #071f4f;
  font-size: 14px;
  font-weight: 950;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assigned-work-popover-content {
  min-height: 0;
  overflow: auto;
  padding: 0 10px 10px;
}

.assigned-work-popover-card {
  width: 100%;
  margin-bottom: 8px;
  padding: 12px;
  border: 1px solid rgba(15, 37, 86, 0.10);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  color: #0f2556;
  text-align: left;
  box-shadow: 0 9px 18px rgba(15, 23, 42, 0.055);
}

.assigned-work-popover-card strong {
  display: block;
  font-size: 12px;
  font-weight: 950;
  line-height: 1.2;
  text-transform: uppercase;
}

.assigned-work-popover-card span,
.assigned-work-popover-card p {
  display: block;
  margin: 4px 0 0;
  color: #475569;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
}

.assigned-work-popover .notes-empty {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 18px;
  color: #64748b;
  text-align: center;
}

.assigned-work-popover .notes-empty i,
.assigned-work-popover .notes-empty svg {
  width: 36px;
  height: 36px;
  color: #0f2556;
  stroke: #c5aa64;
}

.assigned-work-popover .notes-empty b {
  color: #071f4f;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}

.assigned-work-popover .notes-empty span {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
}


@media (max-width: 768px) {
  body:not(.is-logged-out) .assigned-work-popover {
    right: calc(max(22px, env(safe-area-inset-right)) + var(--floating-action-size, 54px) + var(--floating-action-gap, 10px));
    left: auto;
    bottom: var(--corner-chat-lift, calc(max(22px, env(safe-area-inset-bottom)) + var(--floating-action-size, 54px) + 8px));
    width: var(--corner-chat-width, min(316px, calc(100vw - 28px)));
    max-width: calc(100vw - 28px);
    height: var(--corner-chat-height, min(560px, calc(100dvh - 92px)));
    max-height: calc(100dvh - var(--corner-chat-lift, 84px) - 18px);
  }
}
