/**
 * The Admin Styles file.
 *
 * This includes all of the styles used by the plugin's Admin pages.
 *
 * @link              https://billiworx.com
 * @since             1.0.0
 * @package           BilliWorx-Core
 * @subpackage        src\ui-admin\css
 * @author            Nigel Billingham <nigel@billiworx.com>
 */

/* ------------------- */
/* Admin Editor Styles */
/* ------------------- */

/* Editor Wrapper */

.editor-styles-wrapper {
  font-family:        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.billiworx-block-editor-ui {
  width:              100%;
  box-sizing:         border-box;
}

/* Editor Layout */

.bw-field {
  display:            flex;
  align-items:        center;
  gap:                12px;
  width:              100%;
  margin-bottom:      12px;
  box-sizing:         border-box;
}

.bw-label {
  flex:               0 0 200px;
  font-weight:        600;
}

.bw-control {
  flex:               1 1 auto;
  min-width:          0;
}

/* Editor Section */

.bw-section {
  margin-top:         24px;
  margin-bottom:      16px;
  padding-bottom:     8px;
  border-bottom:      1px solid #dcdcde;
}

.bw-section:first-child {
  margin-top:         0;
}

.bw-section-title {
  font-size:          16px;
  font-weight:        600;
  line-height:        1.4;
  margin:             0;
}
/* Editor Select Control */

.bw-select {
  width:              100%;
  padding:            6px 10px;
  border:             1px solid #8c8f94;
  border-radius:      4px;
  background:         #fff;
  font-size:          13px;
  box-sizing:         border-box;
}

.bw-select:focus {
  border-color:       #2271b1;
  box-shadow:         0 0 0 1px #2271b1;
  outline:            none;
}

/* Editor Textbox Control */

.bw-input {
  width:              100%;
  padding:            6px 10px;
  border:             1px solid #8c8f94;
  border-radius:      4px;
  background:         #fff;
  font-size:          13px;
  line-height:        1.4;
  box-sizing:         border-box;
}

.bw-input:focus {
  border-color:       #2271b1;
  box-shadow:         0 0 0 1px #2271b1;
  outline:            none;
}

/* Editor Textarea Control */

.bw-textarea {
  width:              100%;
  min-height:         120px;
  padding:            8px 10px;
  border:             1px solid #8c8f94;
  border-radius:      4px;
  resize:             vertical;
  box-sizing:         border-box;
}

.bw-textarea:focus {
  border-color:       #2271b1;
  box-shadow:         0 0 0 1px #2271b1;
  outline:            none;
}

/* Editor Input Group */

.bw-input-group {
  display:            flex;
  width:              100%;
}

.bw-input-group > * {
  border-radius:      0;
}

.bw-input-group > *:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.bw-input-group > *:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

/* Editor Primary Button */

.bw-button {
  display:            inline-flex;
  align-items:        center;
  justify-content:    center;
  padding:            6px 14px;
  border:             1px solid #2271b1;
  background:         #2271b1;
  color:              #fff;
  cursor:             pointer;
  text-decoration:    none;
  font-size:          13px;
  white-space:        nowrap;
}

.bw-button:hover {
  background:         #135e96;
}

/* Editor Secondary Button */

.bw-button-secondary {
  background:         #fff;
  color:              #2271b1;
}

/* ---------------- */
/* Admin Tab Styles */
/* ---------------- */

.nav-tab-disabled, .nav-tab-disabled:hover {
  background-color:   #dcdcde;
  color:              #bababc;
}

/* -------------------- */
/* Admin General Styles */
/* -------------------- */

table.form-table th, table.form-table td {
  padding-top:        10px;
  padding-bottom:     10px;
}

.min-width-200 {
  min-width:          400px;
}

/* ------------------ */
/* JSON Editor Styles */
/* ------------------ */

table.jsoneditor-tree td {
  padding-top:        0px!important;
  padding-bottom:     0px!important;
}

table.jsoneditor-values {
  margin-left:        8px!important;
}

button.jsoneditor-invisible {
  width:              8px!important;
}

/* ------------------------- */
/* Admin Page Loading Styles */
/* ------------------------- */

#loader {
  position:           fixed;
  width:              100%;
  left:               0px;
  right:              0px;
  top:                0px;
  bottom:             0px;
  background-color:   rgba( 255, 255, 255, 0.7 );
  z-index:            1;
}

@-webkit-keyframes spin {
  from { 
    -webkit-transform:rotate( 0deg ); 
  }
  to {
    -webkit-transform:rotate( 360deg );
  }
}

@keyframes spin {
  from {
    transform:        rotate( 0deg );
  }
  to {
    transform:        rotate( 360deg );
  }
}

#loader::after {
  content:            "";
  display:            block;
  position:           absolute;
  left:               48%;
  top:                40%;
  width:              40px;
  height:             40px;
  border-style:       solid;
  border-color:       black;
  border-top-color:   transparent;
  border-width:       4px;
  border-radius:      50%;
  -webkit-animation:  spin .8s linear infinite;
  animation:          spin .8s linear infinite;
}

#bc_body {
  /*display:    none;*/
}

/* ------------------ */
/* Admin Debug Styles */
/* ------------------ */

.bc-debug-button {
  padding-left:       4px!important; 
  padding-right:      4px!important;
  padding-top:        0px!important;
  padding-bottom:     0px!important;
  line-height:        12px!important;
  min-height:         18px!important;
  height:             18px!important;
}

/* ----------------- */
/* Admin Form Styles */
/* ----------------- */

.button-primary {
  margin-right:       8px!important;
}

h2, p {
  margin-block-start: 8px!important;
  margin-block-end:   8px!important;
}

/* Relates to the Add New button on admin screens */
.page-title-action {
  margin-left:        1px!important;
  margin-top:         16px!important;
}

.resizable {
  overflow-y:         scroll;
  resize:             vertical;
  min-height:         100px!important;
}

.ui-resizable-se { 
  bottom:             18px; 
  right:              50px; 
}

/* --------------------- */
/* Admin Log File Styles */
/* --------------------- */

.div-log {
  border:             solid 1px black;
  border-collapse:    separate;
  padding:            8px;
  background-color:   white;
  border-radius:      4px;
  height:             400px;
  width:              50px;
  min-width:          100%;
  overflow-x:         auto;
  overflow-y:         auto;
  white-space:        nowrap;
  font-size:          10px;
}

/* -------------------------- */
/* WordPress Thick Box Styles */
/* -------------------------- */

#TB_window, #TB_title, #TB_closeWindowButton, #TB_ajaxWindowTitle {
  border-radius:      .375rem!important;
}

#TB_ajaxContent {
  padding:            12px!important;
  /*overflow:           hidden!important;*/
}

/* ------------------- */
/* Admin Plugin Styles */
/* ------------------- */

.refresh-link {
  font-size:          small;
  font-weight:        300;
}

.file-radio-buttons {
  font-size:          small;
  font-weight:        300;
}

#poststuff {
  padding-top:        0px;
}

.tablenav {
  margin-top:         0px!important;
}

/* ----------------- */
/* Admin Other Fixes */
/* ----------------- */

/* Fix scrollbar issue when using a bootstrap modal */
/* More complex due to the use of a fixed-top       */
/* Not fixed as yet!                                */
#wpadminbar {
  padding-right:      0px!important;
}

#TB_window {
  overflow-y:         inherit;
  padding-right:      0px!important;
}

/* Fix to align checkboxes */
.column-cb {
  padding-left:       2px!important;
}

/* Aligns current-page input with parent paging-input span */

.paging-input .current-page {
  margin-top: -4px;
}