/*== ShyFox Findbar =================================================================================================================================

Ctrl + F


*/

findbar{
  --findbar-pad: 8px;
  --fndbr-btn-wdt: 30px;
  
  position: fixed !important;
  z-index: 5 !important;
  
  bottom: calc(var(--bottom-margin) + var(--margin));
  left: calc(
    (
      100vw
      - var(--findbar-wdt)
      - var(--left-margin)
      - var(--right-margin)
    ) / 2
  );
  
  height: calc(var(--toolbar-item-hgt) * 2);
  padding-top: var(--toolbar-item-hgt) !important;
  width: var(--findbar-wdt);
  
  /* styles for input textbox */
  .findbar-textbox{
    position: absolute;
    top: var(--findbar-pad);
    left: var(--findbar-pad);
    width: calc(
      var(--findbar-wdt) 
      - var(--findbar-pad) * 2.5
      - var(--fndbr-btn-wdt) * 3
    ) !important;
  }
  
  /* put buttons to right place */
  .findbar-closebutton,
  .findbar-find-next,
  .findbar-find-previous
  {
    position: absolute;
    top: var(--findbar-pad);
    margin-inline-start: 0px !important;
    margin-inline-end: 0px !important;
  }
  .findbar-closebutton {right: var(--findbar-pad);}
  .findbar-find-next {right: calc(var(--fndbr-btn-wdt) + var(--findbar-pad) / 2 )}
  .findbar-find-previous {right: calc(var(--fndbr-btn-wdt) * 2 + var(--findbar-pad) / 2 )}
  
  /* some design */
  background: var(--tb-col) !important;
  transition: var(--transition) !important;
  & > * {opacity: var(--dyn-opct);}
  
  /* corners, shadow */
  border: var(--outline) !important;
  outline: var(--shadow) !important;
  border-radius: var(--big-rounding) !important;
  
  /* rounded buttons */
  .findbar-textbox, .findbar-closebutton,
  .findbar-find-next, .findbar-find-previous
  {border-radius: var(--rounding) !important;}
}

findbar[hidden]{
  margin-bottom: unset !important;
  transition-delay: unset !important;
  visibility: visible !important;
  opacity: 0 !important;
  pointer-events: none !important;
  bottom: calc(
    0px 
    - var(--toolbar-item-hgt) * 2
    - var(--margin) * 2
  ) !important;
}

/* adaptive findbar width */
@media (max-width: 1500px) {
   :root{
     --findbar-wdt: calc(
       100vw
       - var(--left-margin)
       - var(--right-margin)
       - var(--margin) * 2
     ) !important;
  }
}