{"version":3,"sources":["webpack:///./assets/css/admin.scss"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAOQ,yFACE,aAMN,gDACE,gBACA,cAEA,uDACE,gBAMR,2BACE,oBAEA,kHAEE,aAGF,uDACE,kBAIA,8DACE,gBACA,eACA,gBACA,qBAKE,0FACE,aAGF,kGACE,+BACA,0BAKN,uEACE,kBAEA,qKAEE,aAEA,iLACE,aACA,gBAMN,kEACE,kBACA,MACA,SACA,OACA,QACA,iCACA,aACA,mBACA,uBACA,wFAIJ,uCACE,gBACA,gBACA,iBAEA,yCACE,qBACA,wBACA,6BAEA,+CACE,cAKN,kDACE,gBACA,eAGA,oDACE,qBACA,wBACA,6BAEA,0DACE,cAKN,wCACE,iBACA,gBACA,gBAIF,uDACE,kBAEA,4EACE,mBAGF,2EACE,kBACA,MACA,QACA,aACA,6CAOJ,2CACE,mBACA,aAGF,6CACE,gBAEA,gDACE,gBAIJ,yCACE,aACA,qBAGF,8CACE,iBAGF,gCACE,qBAGF,4CACE,aAGF,iDACE,kBACA,kBAGF,0CACE,cACA,cACA,qBACA,iBACA,eAEA,gDACE,0BAOJ,2CACE,gBACA,gCAII,kGACE,cAGF,oGACE,cAGF,sGACE,kBAGF,sGACE,iBAEA,4GACE,cACA,mBAON,2EACE,uBAGF,kEACE,aACA,mBACA,mBAGA,qEACE,kBACA,oBACA,gBAGF,yEACE,iBACA,UAIJ,6EACE,SACA,UACA,UACA,uBAEA,gFACE,qBACA,SACA,mBACA,kBACA,kBACA,eAEA,uFACE,mBACA,iBACA,kBAGF,mGACE,mBAGF,mFACE,iBAKN,2EACE,kBACA,qBAEA,iFACE,qBACA,aAGF,6EACE,gBACA,yBACA,gBAaN,mEACE,aACA,sBACA,8BAGF,wEACE,gBAEA,kFACE,aACA,mBAEA,wFACE,aAKF,wFACE,mBACA,SACA,gBAGF,4FACE,SAKN,0EACE,kBAEA,uFACE,kBACA,MACA,OACA,QACA,SACA,aACA,mBACA,kBAEA,0FACE,WACA,gBACA,mBACA,gBACA,SAGA,iGACE,cACA,cACA,iBAMR,kFACE,OACA,YACA,aAEA,qFACE,mBACA,SACA,gBAGF,qGACE,iBAEA,4GACE,cACA,iBACA,iBAGF,+GACE,eAEA,qHACE,cAKN,wGACE,cAMJ,mFACE,aACA,mBACA,mBAEA,sFACE,mBACA,SACA,gBACA,aAGF,6FACE,iBACA,cACA,yBACA,oBACA,iBACA,WACA,iBACA,6CAGF,oGACE,oBACA,OACA,yBACA,cACA,aACA,cAEA,mHACE,oBACA,cACA,+BAGA,wBAFU,CAGV,qIAYF,0HAGE,wBAFU,CAGV,qIAYF,wHAGE,wBAFU,CAGV,qIAYF,4HAGE,wBAFU,CAGV,qIAaJ,oGACE,iBACA,WACA,qBACA,mBACA,gBACA,oBACA,kBAEA,0GACE,mBACA,WAON,2FACE,kBAEF,0FACE,kBAEA,uHACE,iBAOF,+FACE,uBAIJ,qEACE,gBACA,aACA,mBACA,mBAEA,6EACE,qBACA,gBACA,wBACA,6CAIJ,qEACE,aACA,mBAEA,uFACE,UACA,SACA,UAEA,0FACE,SACA,mBACA,kBACA,kBACA,eACA,qBAEA,iGACE,iBACA,mBAGF,uGACE,eAKN,2FACE,iBAIJ,6DACE,mBACA,WAII,yEACE,gBAEA,yFACE,gBACA,gBACA,cACA,WACA,mBACA,aACA,kBACA,kBACA,yBACA,eAEA,8FACE,cAGF,mNAEE,mBACA,WAGF,sGACE,mBAGF,uGACE,mBACA,WAOV,kJAEE,UAGF,wJAEE,UACA,gBACA,uBACA,mBAGF,sJAEE,UAGF,4JAEE,UAGF,sJAEE,UAGF,wJAEE,SAGF,4EACE,kBACA,eACA,gBAEA,gFACE,eAEA,sFACE,aAKN,gFACE,gBACA,sDACA,yCAEA,qFACE,qDACA,mBAGF,iGACE,aACA,mBACA,mBAGE,wGACE,gBAGF,uGACE,gBAGF,yGACE,iBACA,kBACA,wCAGF,6GAEE,cAME,mIACE,cAGF,mIACE,cAMR,qGACE,iBAEA,uGAEE,qBACA,aAFI,CAGJ,yBACA,kBACA,iBAEA,6GACE,WACA,kBATE,CAgBZ,qFACE,sBACA,2BAEA,wFACE,qBAUV,wCACE,gBAEA,6JAIE,aAGF,kMAEE,cAGF,mDACE,qBACA,yBAGF,8GACE,cACA,aACA,gBACA,iBACA,kBACA,WACA,gBAWF,4DACE,4B","file":"admin_css/admin-0b7484d5.css","sourcesContent":["@import \"../../node_modules/@sparkpost/design-tokens/tokens.scss\";\n\ndiv#adminmenuwrap {\n  ul#adminmenu {\n    // Hide menu head.\n    li#toplevel_page_wpmailpro {\n      ul.wp-submenu {\n        li.wp-first-item {\n          display: none;\n        }\n      }\n    }\n\n    // Fix the Collapse menu item being bigger for some weird reason.\n    li#collapse-menu {\n      font-size: 0.8rem;\n      line-height: 2;\n\n      button {\n        line-height: 1.5;\n      }\n    }\n  }\n}\n\n#wpmp-admin-page-container {\n  padding-bottom: 3rem;\n\n  div.notice.license-activation,\n  div.notice.sending-limit-flag {\n    display: none;\n  }\n\n  div.admin-page-core-content {\n    position: relative;\n    //max-width: 1000px;\n\n    // Disable the \".wp-core-ui select\" base styles.\n    select {\n      min-height: auto;\n      max-width: 100%;\n      background: #fff;\n      background-size: auto;\n    }\n\n    nav.plugin-tabs {\n      button {\n        &:focus:after {\n          display: none;\n        }\n\n        &[aria-selected=\"true\"] {\n          background: rgba(#111, 0.025);\n          border-radius: 4px 4px 0 0;\n        }\n      }\n    }\n\n    div.tab-content {\n      position: relative;\n\n      *:focus,\n      *:focus-within {\n        outline: none;\n\n        &:after {\n          display: none;\n          box-shadow: none;\n        }\n      }\n    }\n\n    // Loader.\n    div.loader {\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      background: rgba(#fff, 0.25);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      backdrop-filter: saturate(90%) blur(3px);\n    }\n  }\n\n  p.help-link {\n    margin-top: 1rem;\n    font-size: 0.8rem;\n    text-align: right;\n\n    a {\n      text-decoration: none;\n      color: rgba(#111, 0.5);\n      text-shadow: 0px 1px 0px #fff;\n\n      &:hover {\n        color: color(blue, 700);\n      }\n    }\n  }\n\n  p.free-license-callout {\n    margin-top: 1rem;\n    font-size: 1rem;\n    //text-align: right;\n\n    a {\n      text-decoration: none;\n      color: rgba(#111, 0.5);\n      text-shadow: 0px 1px 0px #fff;\n\n      &:hover {\n        color: color(blue, 700);\n      }\n    }\n  }\n\n  p.field-desc {\n    font-size: 0.75rem;\n    line-height: 1.3;\n    margin-top: 0.5em;\n  }\n\n  // Header.\n  header.settings-page-header {\n    position: relative;\n\n    h1.wp-heading-inline {\n      margin-bottom: 0.5em;\n    }\n\n    div.feedback-notice {\n      position: absolute;\n      top: 0;\n      right: 0;\n      z-index: 5000;\n      box-shadow: 0px 5px 15px -5px rgba(#000, 0.25);\n    }\n  }\n\n  /**\n   * Utility classes.\n   */\n  .vertical-align {\n    align-items: center;\n    display: flex;\n  }\n\n  .restricted-width {\n    max-width: 30rem;\n\n    &.xl {\n      max-width: 45rem;\n    }\n  }\n\n  .align-bottom {\n    display: flex;\n    align-items: flex-end;\n  }\n\n  .dkim-record-value {\n    padding-left: 1em;\n  }\n\n  code {\n    word-break: break-all;\n  }\n\n  button[disabled] {\n    opacity: 0.325;\n  }\n\n  p.empty-table-message {\n    text-align: center;\n    font-style: italic;\n  }\n\n  span.copy-link {\n    color: color(blue, 700);\n    font-size: 85%;\n    display: inline-block;\n    margin-left: 0.5em;\n    cursor: pointer;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  /**\n   * Panels.\n   */\n  div.tab-section {\n    margin-top: 1rem;\n    background: rgba(#fff, 0.8);\n\n    &.section-verify-domain {\n      p.last-verification-status {\n        &.valid {\n          color: color(green, 700);\n        }\n\n        &.invalid {\n          color: color(red, 700);\n        }\n\n        span.icon {\n          margin-right: 0.5em;\n        }\n\n        span.text {\n          font-weight: bold;\n\n          small {\n            font-size: 80%;\n            font-weight: normal;\n          }\n        }\n      }\n    }\n\n    &.section-metrics {\n      > div:first-child {\n        padding: 0.75rem 1.25rem;\n      }\n\n      header {\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        //margin-bottom: 1rem;\n\n        h2 {\n          font-size: 1.25rem;\n          line-height: 1.75rem;\n          font-weight: 600;\n        }\n\n        button {\n          margin-left: auto;\n          width: 1em;\n        }\n      }\n\n      ul.filters-button {\n        margin: 0;\n        padding: 0;\n        width: 75%;\n        align-items: flex-start;\n\n        li {\n          display: inline-block;\n          margin: 0;\n          padding: 0.375em 1em;\n          border-radius: 2em;\n          font-size: 0.925rem;\n          cursor: pointer;\n\n          &.active {\n            background: color(gray, 200);\n            font-weight: bold;\n            border-radius: 2em;\n          }\n\n          &:hover:not(.active) {\n            background: #fafafa;\n          }\n\n          + li {\n            margin-left: 0.5em;\n          }\n        }\n      }\n\n      div.metrics-box {\n        text-align: center;\n        padding: 1.5rem 0.5rem;\n\n        .icon {\n          margin-bottom: 0.25rem;\n          fill: color(teal, 600);\n        }\n\n        p {\n          font-size: 0.9rem;\n          text-transform: uppercase;\n          font-weight: 300;\n\n          strong {\n            //\n          }\n        }\n      }\n    }\n  }\n\n  div.metrics-charts-container {\n    //margin-top: 1rem;\n\n    .first-col {\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n    }\n\n    div.metrics-box {\n      padding: 0.5rem 0;\n\n      .icon-col {\n        display: flex;\n        align-items: center;\n\n        .icon {\n          fill: color(blue, 700);\n        }\n      }\n\n      .content-col {\n        h3 {\n          font-size: 1.125rem;\n          margin: 0;\n          line-height: 1.1;\n        }\n\n        p.stat {\n          margin: 0;\n        }\n      }\n    }\n\n    div.pie-and-title {\n      position: relative;\n\n      header.title {\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n        bottom: 0;\n        display: flex;\n        align-items: center;\n        text-align: center;\n\n        h6 {\n          width: 100%;\n          font-size: 0.8rem;\n          font-weight: normal;\n          line-height: 1.3;\n          margin: 0;\n          //color: color(gray, 500);\n\n          strong {\n            display: block;\n            color: color(blue, 700);\n            font-size: 1.75em;\n          }\n        }\n      }\n    }\n\n    .engagement-box-container {\n      flex: 1;\n      height: 100%;\n      margin-top: 0;\n\n      h2 {\n        font-size: 1.125rem;\n        margin: 0;\n        line-height: 1.1;\n      }\n\n      div.engagement-box {\n        padding-top: 1rem;\n\n        p.stat {\n          color: color(blue, 700);\n          font-weight: bold;\n          font-size: 1.6rem;\n        }\n\n        p.caption {\n          font-size: 1rem;\n\n          small {\n            color: color(gray, 500);\n          }\n        }\n      }\n\n      hr + div.engagement-box {\n        padding-top: 0;\n      }\n    }\n  }\n\n  div.tab-section.section-sending-limit {\n    div.section-inner {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n\n      > h3 {\n        font-size: 1.125rem;\n        margin: 0;\n        line-height: 1.1;\n        margin: 0 1em;\n      }\n\n      p.numbers {\n        padding: 0.5em 1em;\n        line-height: 1;\n        background-color: color(gray, 300);\n        border-radius: 0.5rem;\n        font-size: 0.85rem;\n        color: #333;\n        font-weight: bold;\n        text-shadow: 0px 1px 0px rgba(#fff, 0.5);\n      }\n\n      div.progress-bar {\n        border-radius: 0.5rem;\n        flex: 1;\n        background-color: color(gray, 300);\n        height: 1.7rem;\n        margin: 0 1em;\n        padding: 0.2rem;\n\n        div.progresser {\n          border-radius: 0.4rem;\n          height: 1.3rem;\n          background-size: 41.54px 31.3px;\n          $light_c: color(blue, 600);\n          $dark_c: darken($light_c, 5%);\n          background-color: $light_c;\n          background-image: linear-gradient(\n            143deg,\n            $dark_c 30%,\n            $light_c 30%,\n            $light_c 50%,\n            $dark_c 50%,\n            $dark_c 80%,\n            $light_c 80%,\n            $light_c 100%\n          );\n        }\n\n        &.almost div.progresser {\n          $light_c: #e9672b;\n          $dark_c: darken($light_c, 6%);\n          background-color: $light_c;\n          background-image: linear-gradient(\n            143deg,\n            $dark_c 30%,\n            $light_c 30%,\n            $light_c 50%,\n            $dark_c 50%,\n            $dark_c 80%,\n            $light_c 80%,\n            $light_c 100%\n          );\n        }\n\n        &.full div.progresser {\n          $light_c: color(red, 600);\n          $dark_c: darken($light_c, 10%);\n          background-color: $light_c;\n          background-image: linear-gradient(\n            143deg,\n            $dark_c 30%,\n            $light_c 30%,\n            $light_c 50%,\n            $dark_c 50%,\n            $dark_c 80%,\n            $light_c 80%,\n            $light_c 100%\n          );\n        }\n\n        &.overflow div.progresser {\n          $light_c: color(yellow, 400);\n          $dark_c: darken($light_c, 2.5%);\n          background-color: $light_c;\n          background-image: linear-gradient(\n            143deg,\n            $dark_c 30%,\n            $light_c 30%,\n            $light_c 50%,\n            $dark_c 50%,\n            $dark_c 80%,\n            $light_c 80%,\n            $light_c 100%\n          );\n        }\n      }\n\n      a.upgrade-button {\n        font-weight: bold;\n        color: #fff;\n        text-decoration: none;\n        background: color(blue, 700);\n        font-size: 0.9rem;\n        padding: 0.25em 1.5em;\n        border-radius: 1em;\n\n        &:hover {\n          background: color(gray, 700);\n          color: #fff;\n        }\n      }\n    }\n  }\n\n  div.tab-section.email-sender-settings {\n    select.sender-mail-suffix {\n      padding-right: 3em;\n    }\n    div.force-sender-setting {\n      margin-top: 1.5rem;\n\n      span#force_sender_emailLabel {\n        font-weight: bold;\n      }\n    }\n  }\n\n  div.section-logs {\n    div.tab-section.date-range-section {\n      > div:first-child {\n        padding: 0.75rem 1.25rem;\n      }\n    }\n\n    nav.logs-table-navigator {\n      margin-top: 1rem;\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n\n      p.total {\n        margin: 0.5em auto 0 0;\n        font-size: 0.9rem;\n        color: rgba(#111, 0.6);\n        text-shadow: 0px 1px 0px rgba(#fff, 0.5);\n      }\n    }\n\n    nav.date-range-selectors {\n      display: flex;\n      flex-direction: row;\n\n      ul.range-selector {\n        width: 75%;\n        margin: 0;\n        padding: 0;\n\n        li {\n          margin: 0;\n          padding: 0.375em 1em;\n          border-radius: 2em;\n          font-size: 0.925rem;\n          cursor: pointer;\n          display: inline-block;\n\n          &.active {\n            font-weight: bold;\n            background: color(gray, 200);\n          }\n\n          &:not(.active) {\n            cursor: pointer;\n          }\n        }\n      }\n\n      button.refresh-button {\n        margin-left: auto;\n      }\n    }\n\n    table.logs-table {\n      table-layout: fixed;\n      width: 100%;\n\n      tbody {\n        tr {\n          td {\n            font-size: 0.9rem;\n\n            span.log-status {\n              font-size: 0.6rem;\n              font-weight: 500;\n              display: block;\n              width: 100%;\n              background: #dadada;\n              padding: 0.1em;\n              text-align: center;\n              border-radius: 2px;\n              text-transform: uppercase;\n              cursor: pointer;\n\n              > span {\n                display: block;\n              }\n\n              &.status-accepted,\n              &.status-delivered {\n                background: color(green, 700);\n                color: #fff;\n              }\n\n              &.status-error {\n                background: color(yellow, 300);\n              }\n\n              &.status-failed {\n                background: color(red, 700);\n                color: #fff;\n              }\n            }\n          }\n        }\n      }\n\n      th.col-date,\n      td.col-date {\n        width: 16%;\n      }\n\n      th.col-subject,\n      td.col-subject {\n        width: 22%;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      th.col-sender,\n      td.col-sender {\n        width: 24%;\n      }\n\n      th.col-recipient,\n      td.col-recipient {\n        width: 18%;\n      }\n\n      th.col-status,\n      td.col-status {\n        width: 15%;\n      }\n\n      th.col-actions,\n      td.col-actions {\n        width: 5%;\n      }\n\n      td.col-actions {\n        text-align: center;\n        padding-left: 0;\n        padding-right: 0;\n\n        svg {\n          cursor: pointer;\n\n          &:hover {\n            fill: color(blue, 700);\n          }\n        }\n      }\n\n      tr.col-actions-row {\n        background: #fff;\n        box-shadow: 0px 12px 25px -25px rgba(0, 0, 50, 0.45) inset;\n        border-bottom: 2px solid rgba(0, 0, 50, 0.05);\n\n        &.gray {\n          box-shadow: 0px 12px 25px -25px rgba(0, 0, 50, 0.6) inset;\n          background: #f5f8fa;\n        }\n\n        div.log-row-data {\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n\n          > div {\n            h6 {\n              font-size: 0.9rem;\n            }\n\n            p {\n              font-size: 0.8rem;\n            }\n\n            + div {\n              margin-left: 1rem;\n              padding-left: 1rem;\n              border-left: 1px solid rgba(#111, 0.1);\n            }\n\n            &.subject {\n              // min-width: 25rem;\n              max-width: 45%;\n              //width: 40%;\n            }\n\n            &.engagement {\n              span.icon {\n                &.positive {\n                  color: color(green, 700);\n                }\n\n                &.negative {\n                  color: color(red, 700);\n                }\n              }\n            }\n          }\n\n          > nav {\n            margin-left: auto;\n\n            a {\n              $c: color(blue, 700);\n              text-decoration: none;\n              color: $c;\n              border: 1px solid $c;\n              border-radius: 2em;\n              padding: 0.5em 1em;\n\n              &:hover {\n                color: #fff;\n                background: $c;\n              }\n            }\n          }\n        }\n      }\n\n      tr.col-actions-fake-row {\n        height: 0px !important;\n        overflow: hidden !important;\n\n        td {\n          padding: 0 !important;\n        }\n      }\n    }\n  }\n}\n\n/**\n * Email preview page.\n */\nbody.admin_page_wpmailpro-preview-email {\n  overflow: hidden;\n\n  #adminmenumain,\n  #wpadminbar,\n  //#wpbody-content *,\n  #wpfooter {\n    display: none;\n  }\n\n  #wpbody-content #wpmp-email-content-preview,\n  #wpbody-content #wpmp-email-content-preview div.email-preview-wrapper {\n    display: block;\n  }\n\n  #wpcontent {\n    padding: 0 !important;\n    margin-left: 0 !important;\n  }\n\n  #wpbody-content #wpmp-email-content-preview div.email-preview-wrapper {\n    display: block;\n    height: 100vh;\n    max-width: 800px;\n    margin-left: auto;\n    margin-right: auto;\n    width: 100%;\n    margin-top: 2rem;\n    //white-space: pre;\n    //padding-top: 2rem;\n  }\n\n  #wpbody-content #wpmp-email-content-preview div.email-preview-wrapper body {\n    //white-space: pre;\n  }\n}\n\nhtml.wp-toolbar {\n  #wpbody-content #wpmp-email-content-preview {\n    margin-top: -32px !important;\n  }\n}\n"],"sourceRoot":""}