{"version":3,"sources":["cfio-admin.scss"],"names":[],"mappings":"AA2BE,4BACE,iBAzBY,QA4Bd,+BACE,QAAA,EAGF,oCACE,OAAA,mBACA,eAAA,EAEA,sCAAA,4CAAA,6CAGE,WAAA,WAIJ,8BACE,QAAA,KAKJ,MACE,SAAA,SACA,QAAA,KACA,UAAA,IAAA,OACA,IAAA,KACA,WAAA,KACA,QAAA,KAEA,eACE,MAAA,MAGF,YACE,QAAA,KACA,eAAA,OACA,IAAA,IACA,OAAA,EACA,QAAA,EACA,WAAA,KAEA,eACE,OAAA,EAIJ,YACE,QAAA,KACA,YAAA,OACA,IAAA,IACA,MAAA,KACA,QAAA,KAAA,KACA,UAAA,KACA,YAAA,IACA,MA5Ec,QA6Ed,iBAAA,YACA,gBAAA,KACA,OAAA,KACA,cAAA,KACA,OAAA,QACA,WAAA,MAAA,YAAA,GAAA,CAAA,iBAAA,YAAA,IAEA,kBACE,MApFc,QAqFd,iBA1Fa,QA6Ff,oBACE,iBAAA,kBACA,eAAA,KAIJ,eACE,KAAA,EACA,QAAA,KACA,UAAA,EACA,WAAA,MACA,iBAAA,KACA,cAAA,KAGF,WACE,QAAA,KAEA,mBACE,QAAA,MAMN,WAAA,YAEE,QAAA,KACA,eAAA,OACA,IAAA,KAEA,kBAAA,mBACE,OAAA,EAMF,sBACE,QAAA,KACA,eAAA,OACA,YAAA,WACA,IAAA,KAGF,oBACE,MAAA,KACA,QAAA,KACA,UAAA,KACA,MAxIc,QAyId,iBAhJa,QAiJb,cAAA,KASF,yBACE,QAAA,KACA,eAAA,OACA,gBAAA,OACA,YAAA,OACA,IAAA,KACA,WAAA,MACA,WAjKa,QAkKb,cAAA,KAEA,8BACE,UAAA,KACA,WAAA,OACA,YAAA,IAIJ,kBACE,QAAA,KACA,eAAA,OACA,IAAA,KAEA,uBACE,QAAA,KACA,UAAA,IAAA,KACA,gBAAA,cACA,YAAA,OACA,IAAA,KAAA,KAGF,uBACE,QAAA,KACA,eAAA,OACA,IAAA,IAIJ,sBACE,UAAA,KACA,MA1Lc,QA6LhB,kBACE,QAAA,KACA,YAAA,OACA,IAAA,KACA,QAAA,IAAA,KACA,iBAzMa,QA0Mb,cAAA,KAEA,6CACE,QAAA,EACA,eAAA,KAIJ,qBACE,QAAA,KACA,eAAA,OACA,IAAA,IACA,KAAA,EACA,UAAA,EAGF,uBACE,UAAA,KACA,YAAA,IAGF,gBACE,UAAA,KACA,MA1Nc,QA6NhB,qBACE,QAAA,KACA,IAAA,IACA,QAAA,EACA,eAAA,KACA,WAAA,IAGF,oBACE,QAAA,KACA,gBAAA,OACA,YAAA,OACA,MAAA,KACA,OAAA,KACA,MA3Oc,QA4Od,iBAAA,YACA,OAAA,KACA,cAAA,IACA,OAAA,QACA,WAAA,IAEA,0BACE,MArPY,QAsPZ,iBAAA,KAMN,kBACE,SAAA,MACA,MAAA,KACA,OAAA,KAGF,aACE,SAAA,SACA,UAAA,MACA,UAAA,kBACA,QAAA,KAAA,KACA,iBAAA,KACA,cAAA,IACA,WAAA,EAAA,IAAA,KAAA,gBACA,QAAA,EACA,SAAA,OACA,UAAA,cACA,WAAA,KAEA,sBACE,QAAA,EACA,UAAA,kBAGF,sBACE,YAAA,IAAA,MAAA,QAGF,oBACE,YAAA,IAAA,MAAA,QAKJ,WACE,QAAA,KACA,eAAA,OACA,YAAA,WACA,IAAA,KAEA,oBACE,YAAA,QAAA,CAAA,MAAA,CAAA,UACA,UAAA,KACA,YAAA,IACA,MAvSgB,QA0SlB,mBACE,QAAA,KACA,eAAA,OACA,IAAA,KACA,MAAA,KAGF,mBACE,QAAA,KACA,gBAAA,cACA,MAAA,KAKJ,iBACE,QAAA,KACA,eAAA,OACA,IAAA,IAEA,wBACE,UAAA,KAGF,wBACE,MAAA,KAIJ,YAAA,eAEE,MAAA,KACA,UAAA,KACA,WAAA,kBACA,cAAA,KACA,OAAA,eAGF,YACE,OAAA,KACA,QAAA,EAAA,eAGF,eACE,OAAA,MACA,QAAA,KAAA,eACA,OAAA,KAIF,aACE,SAAA,SACA,QAAA,KACA,gBAAA,OACA,YAAA,OACA,OAAA,KACA,QAAA,EAAA,KACA,UAAA,KACA,YAAA,IACA,MAAA,eACA,gBAAA,KACA,iBAnWW,QAoWX,OAAA,KACA,cAAA,KACA,OAAA,QACA,WAAA,IAGA,oBACE,SAAA,SACA,QAAA,EAGF,sBACE,SAAA,SACA,IAAA,IACA,KAAA,IACA,UAAA,qBACA,QAAA,EACA,MAAA,KACA,OAAA,KACA,OArYI,KAsYJ,aAAA,IACA,eAAA,MACA,iBAAA,IACA,kBAAA,EACA,QAAA,EAGF,mBACE,iBA/Xe,QAkYjB,oBACE,OAAA,KACA,UAAA,KAGF,mBACE,MAAA,eACA,iBApZa,QAsZb,yBACE,iBApZW,QAwZf,kBACE,iBA/YQ,QAiZR,wBACE,iBAjZY,QAqZhB,sBACE,YAAA,KACA,eAAA,KAEA,0CACE,QAAA,EAGF,4CACE,QAAA,EAIJ,sBACE,MAAA,kBACA,iBAAA,kBACA,eAAA,KAKJ,mBACE,QAAA,KACA,SAAA,MACA,MAAA,EACA,QAAA,MAEA,2BACE,QAAA,MAGF,4BACE,SAAA,SACA,MAAA,EACA,WAAA,gBACA,gBAAA,UAGF,2BACE,SAAA,SACA,UAAA,MACA,OAAA,MAAA,KAAA,EACA,WAAA,KACA,QAAA,KACA,cAAA,IACA,UAAA,aAAA,IAAA,KACA,WAAA,EAAA,KAAA,KAAA,eAGF,0BACE,UAAA,KACA,YAAA,IACA,cAAA,IAGF,yBACE,MAnde,KAodf,cAAA,KAGF,4BACE,QAAA,KACA,IAAA,KACA,gBAAA,SAIJ,wBACE,KAAO,QAAA,EAAY,UAAA,kBACnB,GAAO,QAAA,EAAY,UAAA,eAGrB,yBACE,MACE,eAAA,OAEA,eACE,QAAA,KACA,YAAA,OACA,IAAA,KACA,MAAA,KAGF,YACE,UAAA,IAAA,KAIJ,qBACE,QAAA,EACA,eAAA,MAIJ,yBACE,oCACE,OAAA,mBACA,eAAA,GAIJ,yBACE,MACE,IAAA,KACA,QAAA,KAEA,eACE,IAAA,KAGF,eACE,QAAA,KAKF,kBACE,cAAA,KAGF,uBACE,UAAA,KAGF,gBACE,UAAA,KAGF,qBACE,eAAA,OACA,IAAA","file":"cfio-admin.min.css","sourcesContent":["$white: #fff;\n$black: #000;\n\n$color-bg-page: #f1f5f9;\n$color-bg-light: #f5f6f8;\n$color-bg-lighter: #f8fafc;\n$color-bg-active: #e2e8f0;\n$color-bg-hover: #e1e2e4;\n\n$color-text-dark: #1a2537;\n$color-text-darker: #0f172a;\n$color-text-gray: #66727e;\n$color-text-muted: #555;\n\n$color-blue: #2196f3;\n$color-blue-hover: #1a7dd1;\n\n$color-red: #ff3e57;\n$color-red-hover: #f03a52;\n\n$color-green: #25d366;\n\n$color-disabled-bg: #e6e9ef;\n$color-disabled-text: #92a3b4;\n\n// page layout\n.toplevel_page_cfio {\n  #wpwrap {\n    background-color: $color-bg-page;\n  }\n\n  #wpcontent {\n    padding: 0;\n  }\n\n  #wpbody-content {\n    height: calc(100vh - 31px);\n    padding-bottom: 0;\n\n    *,\n    ::after,\n    ::before {\n      box-sizing: border-box;\n    }\n  }\n\n  #wpfooter {\n    display: none;\n  }\n}\n\n// plugin container\n.cfio {\n  position: relative;\n  display: flex;\n  flex-flow: row nowrap;\n  gap: 20px;\n  min-height: 100%;\n  padding: 20px;\n\n  &__sidebar {\n    width: 224px;\n  }\n\n  &__menu {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n\n    li {\n      margin: 0;\n    }\n  }\n\n  &__link {\n    display: flex;\n    align-items: center;\n    gap: 5px;\n    width: 100%;\n    padding: 10px 15px;\n    font-size: 14px;\n    font-weight: 500;\n    color: $color-text-dark;\n    background-color: transparent;\n    text-decoration: none;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    transition: color ease-in-out 0.2s, background-color ease-in-out 0.2s;\n\n    &:hover {\n      color: $color-text-darker;\n      background-color: $color-bg-lighter;\n    }\n\n    &--active {\n      background-color: $color-bg-active !important;\n      pointer-events: none;\n    }\n  }\n\n  &__content {\n    flex: 1;\n    padding: 20px;\n    min-width: 0;\n    min-height: 460px;\n    background-color: #fff;\n    border-radius: 20px;\n  }\n\n  &__tab {\n    display: none;\n\n    &--active {\n      display: block;\n    }\n  }\n}\n\n// tab layout\n.cfio-chat,\n.cfio-forms {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  &__title {\n    margin: 0;\n  }\n}\n\n// chat tab\n.cfio-chat {\n  &__connected {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 14px;\n  }\n\n  &__preview {\n    width: 100%;\n    padding: 15px;\n    font-size: 15px;\n    color: $color-text-gray;\n    background-color: $color-bg-light;\n    border-radius: 10px;\n  }\n}\n\n// forms tab\n\n.cfio-forms {\n  $forms: &;\n\n  &__placeholder {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 14px;\n    min-height: 200px;\n    background: $color-bg-light;\n    border-radius: 20px;\n\n    &-text {\n      font-size: 15px;\n      text-align: center;\n      line-height: 1.3;\n    }\n  }\n\n  &__list {\n    display: flex;\n    flex-direction: column;\n    gap: 15px;\n\n    &-head {\n      display: flex;\n      flex-flow: row wrap;\n      justify-content: space-between;\n      align-items: center;\n      gap: 10px 20px;\n    }\n\n    &-body {\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n    }\n  }\n\n  &__quantity {\n    font-size: 14px;\n    color: $color-text-gray;\n  }\n\n  &__item {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 8px 15px;\n    background-color: $color-bg-light;\n    border-radius: 10px;\n\n    &:hover #{$forms}__actions {\n      opacity: 1;\n      pointer-events: auto;\n    }\n  }\n\n  &__content {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    flex: 1;\n    min-width: 0;\n  }\n\n  &__shortcode {\n    font-size: 15px;\n    font-weight: 500;\n  }\n\n  &__id {\n    font-size: 13px;\n    color: $color-text-gray;\n  }\n\n  &__actions {\n    display: flex;\n    gap: 4px;\n    opacity: 0;\n    pointer-events: none;\n    transition: 0.2s;\n  }\n\n  &__action {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 30px;\n    height: 30px;\n    color: $color-text-gray;\n    background-color: transparent;\n    border: none;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: 0.2s;\n\n    &:hover {\n      color: $color-text-dark;\n      background-color: #fff;\n    }\n  }\n}\n\n// notices\n.cfio-notice-wrap {\n  position: fixed;\n  right: 20px;\n  bottom: 20px;\n}\n\n.cfio-notice {\n  position: relative;\n  min-width: 270px;\n  max-width: calc(100% - 40px);\n  padding: 10px 20px;\n  background-color: #fff;\n  border-radius: 6px;\n  box-shadow: 0 6px 12px rgba(0,0,0,.15);\n  opacity: 0;\n  overflow: hidden;\n  transform: translateY(0);\n  transition: 0.35s;\n\n  &--visible {\n    opacity: 1;\n    transform: translateY(-10px);\n  }\n\n  &--success {\n    border-left: 4px solid $color-green;\n  }\n\n  &--error {\n    border-left: 4px solid $color-red;\n  }\n}\n\n// form\n.cfio-form {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 10px;\n\n  &__preview {\n    font-family: Consolas, Monaco, monospace;\n    font-size: 15px;\n    font-weight: 700;\n    color: $color-text-darker;\n  }\n\n  &__fields {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n    width: 100%;\n  }\n\n  &__footer {\n    display: flex;\n    justify-content: space-between;\n    width: 100%;\n  }\n}\n\n// fields\n.cfio-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  &__label {\n    font-size: 14px;\n  }\n\n  &__value {\n    width: 100%;\n  }\n}\n\n.cfio-input,\n.cfio-textarea {\n  width: 100%;\n  font-size: 14px;\n  background: $color-bg-light !important;\n  border-radius: 10px;\n  border: none !important;\n}\n\n.cfio-input {\n  height: 40px;\n  padding: 0 15px !important;\n}\n\n.cfio-textarea {\n  height: 110px;\n  padding: 10px 15px !important;\n  resize: none;\n}\n\n// buttons\n.cfio-button {\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 40px;\n  padding: 0 15px;\n  font-size: 15px;\n  font-weight: 500;\n  color: $white !important;\n  text-decoration: none;\n  background-color: $color-blue;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  transition: 0.2s;\n  $button: &;\n\n  &__label {\n    position: relative;\n    z-index: 1;\n  }\n\n  &__spinner {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 2;\n    width: 20px;\n    height: 20px;\n    stroke: $white;\n    stroke-width: 8px;\n    stroke-linecap: round;\n    stroke-dasharray: 200;\n    stroke-dashoffset: 0;\n    opacity: 0;\n  }\n\n  &:hover {\n    background-color: $color-blue-hover;\n  }\n\n  &--small {\n    height: 34px;\n    font-size: 14px;\n  }\n\n  &--gray {\n    color: #000 !important;\n    background-color: $color-bg-light;\n\n    &:hover {\n      background-color: $color-bg-hover;\n    }\n  }\n\n  &--red {\n    background-color: $color-red;\n\n    &:hover {\n      background-color: $color-red-hover;\n    }\n  }\n\n  &--loading {\n    user-select: none;\n    pointer-events: none;\n\n    #{$button}__label {\n      opacity: 0;\n    }\n\n    #{$button}__spinner {\n      opacity: 1;\n    }\n  }\n\n  &:disabled {\n    color: $color-disabled-text !important;\n    background-color: $color-disabled-bg !important;\n    pointer-events: none;\n  }\n}\n\n// confirmation modal\n.cfio-confirmation {\n  display: none;\n  position: fixed;\n  inset: 0;\n  z-index: 99999;\n\n  &--active {\n    display: block;\n  }\n\n  &__overlay {\n    position: absolute;\n    inset: 0;\n    background: rgba(0,0,0,.45);\n    backdrop-filter: blur(3px);\n  }\n\n  &__window {\n    position: relative;\n    max-width: 340px;\n    margin: 120px auto 0;\n    background: #fff;\n    padding: 15px;\n    border-radius: 8px;\n    animation: okocrmFadeIn .2s ease;\n    box-shadow: 0 10px 30px rgba(0,0,0,.2);\n  }\n\n  &__title {\n    font-size: 18px;\n    font-weight: 600;\n    margin-bottom: 8px;\n  }\n\n  &__text {\n    color: $color-text-muted;\n    margin-bottom: 18px;\n  }\n\n  &__actions {\n    display: flex;\n    gap: 10px;\n    justify-content: flex-end;\n  }\n}\n\n@keyframes okocrmFadeIn {\n  from { opacity: 0; transform: translateY(-10px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n@media (max-width: 991px) {\n  .cfio {\n    flex-direction: column;\n\n    &__sidebar {\n      display: flex;\n      align-items: center;\n      gap: 20px;\n      width: 100%;\n    }\n\n    &__menu {\n      flex-flow: row wrap;\n    }\n  }\n\n  .cfio-forms__actions {\n    opacity: 1;\n    pointer-events: auto;\n  }\n}\n\n@media (max-width: 782px) {\n  .toplevel_page_cfio #wpbody-content {\n    height: calc(100vh - 46px);\n    padding-bottom: 0;\n  }\n}\n\n@media (max-width: 575px) {\n  .cfio {\n    gap: 15px;\n    padding: 15px;\n\n    &__sidebar {\n      gap: 15px;\n    }\n\n    &__content {\n      padding: 15px;\n    }\n  }\n\n  .cfio-forms {\n    &__item {\n      padding-right: 10px;\n    }\n\n    &__shortcode {\n      font-size: 14px;\n    }\n\n    &__id {\n      font-size: 12px;\n    }\n\n    &__actions {\n      flex-direction: column;\n      gap: 0;\n    }\n  }\n}\n"]}