/* Bestseller Manual Entry and File Upload Styles */

/* 1. Main Entry Grid Table */
table.bsbl-entry {
  width: 100%;
  border-collapse: collapse;
  margin-top: 15px;
  margin-bottom: 25px;
  font-family: inherit;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #777777; /* Sharp outline border */
}

/* Dark high-contrast header */
table.bsbl-entry th {
  background-color: #0a408c; /* Dark premium blue */
  color: #ffffff !important; /* Pure white text */
  padding: 6px 10px;
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  border-bottom: 2px solid #052663;
  vertical-align: middle;
}

table.bsbl-entry td {
  padding: 4px 8px; /* Extremely compressed row padding */
  vertical-align: middle; /* Perfect baseline vertical alignment */
  border-bottom: 1px solid #cccccc; /* Clear gridlines */
}

/* Alternating high-contrast row background colors so white textfields and radio buttons pop */
table.bsbl-entry tr:nth-child(odd),
.bsbl-field-info tr:nth-child(odd) {
  background-color: #f7faff; /* Ultra-light blue-white */
}

table.bsbl-entry tr:nth-child(even),
.bsbl-field-info tr:nth-child(even) {
  background-color: #e8f1fc; /* Beautiful contrasting soft blue */
}

/* Row hover highlight */
table.bsbl-entry tr:hover,
.bsbl-field-info tr:hover {
  background-color: #dbeaff;
}

/* Remove default margins, paddings, and line-height offsets on Drupal wrapper elements */
table.bsbl-entry .form-item,
table.bsbl-entry .js-form-item,
table.bsbl-entry .form-type-textfield,
table.bsbl-entry .form-no-label {
  margin: 0 !important;
  padding: 0 !important;
  line-height: normal !important;
}

/* Form fields nested inside table */
table.bsbl-entry input.bsbl-isbn-input,
table.bsbl-entry input.bsbl-count-input {
  width: 100%;
  height: 28px; /* Identical forced height for perfect alignment */
  box-sizing: border-box;
  padding: 2px 8px;
  border: 1px solid #666666; /* Sharp high-contrast border */
  border-radius: 4px;
  background-color: #ffffff; /* White input stands out beautifully on row background */
  color: #111111; /* Pure dark text */
  font-size: 13px;
  font-weight: 500;
  transition: border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
}

table.bsbl-entry input.bsbl-isbn-input:focus,
table.bsbl-entry input.bsbl-count-input:focus {
  border-color: #005bb5;
  outline: 0;
  box-shadow: 0 0 4px rgba(0, 91, 181, 0.4);
}

/* Row Number indicator column */
td.bsbl-entry-rownum {
  width: 30px;
  text-align: center;
  font-weight: 700;
  color: #333333;
  font-size: 13px;
}

/* Column Width Controls */
td.bsbl-entry-isbn {
  width: 180px;
}

td.bsbl-entry-count {
  width: 80px;
}

td.bsbl-entry-title {
  vertical-align: middle;
}

div.bsbl-entry-title {
  display: flex;
  align-items: center;
  height: 28px; /* Matches adjacent textfields' exact height for perfect vertical centering */
  margin: 0 !important;
  padding: 0 !important;
}

td.bsbl-entry-title span {
  font-size: 13px;
  color: #222222;
  font-weight: 500;
  line-height: 1.2;
}

/* Hidden Category column */
th.bsbl-entry-cat,
td.bsbl-entry-cat {
  width: 0;
  display: none !important;
}

/* Clear Buttons Container */
td.bsbl-entry-clear,
th.bsbl-entry-clear {
  width: 45px;
  text-align: center;
}

/* Compact Premium Button styling */
.bsbl-clear-row-btn,
.bsbl-clear-all-btn {
  height: 28px; /* Matches form input height precisely for perfect alignment */
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  border: 1.5px solid #555555; /* Sharp high contrast border */
  border-radius: 4px;
  padding: 0 8px;
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
  color: #222222;
  transition: all 0.1s ease;
  min-width: 28px;
}

.bsbl-clear-row-btn:hover {
  background-color: #d9534f; /* Soft red hover for clear action */
  color: #ffffff;
  border-color: #c9302c;
}

.bsbl-clear-all-btn {
  background-color: #f0f0f0;
  border-color: #444444;
}

.bsbl-clear-all-btn:hover {
  background-color: #222222;
  color: #ffffff;
  border-color: #000000;
}

/* 2. File Upload Form & Steps */
.bsbl-upload-step-msg {
  font-size: 14px;
  font-weight: 700;
  color: #444444;
  margin-bottom: 15px;
}

input.bsbl-submit,
.bsbl-submit {
  margin-top: 15px;
  margin-bottom: 15px;
  background-color: #0a408c;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  padding: 8px 18px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  transition: background-color 0.15s ease-in-out;
  font-size: 14px;
}

input.bsbl-submit:hover,
.bsbl-submit:hover {
  background-color: #052663;
}

/* 3. Column Identification Rotated Mapper (Step 2 Upload) */
.bsbl-field-info {
  width: 100%;
  border-collapse: collapse;
  margin-top: 15px;
  margin-bottom: 25px;
  border: 1px solid #777777;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

table.bsbl-entry th,
.bsbl-field-info th {
  background-color: #0a408c !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  padding: 6px 10px !important;
  border-bottom: 2px solid #052663 !important;
  vertical-align: middle !important;
  text-align: left;
}

.bsbl-field-info th {
  text-align: center !important;
  border: 1px solid #052663 !important;
}

.bsbl-field-info td {
  padding: 5px 10px;
  border: 1px solid #bbbbbb;
  font-size: 13px;
  vertical-align: middle;
}

/* Radio button cells have zero padding so label spans 100% of cell bounds */
.bsbl-field-info td.bsbl-radio-cell {
  padding: 0 !important;
  text-align: center !important;
  vertical-align: stretch !important; /* Stretches label to fill entire cell height */
}

/* Full-width clickable label for radio cell */
.bsbl-radio-cell-label {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 38px !important; /* Comfortable large clickable cell height */
  cursor: pointer !important;
  margin: 0 !important;
  padding: 6px 10px !important; /* Keep cell padding inside label */
  box-sizing: border-box !important;
  transition: background-color 0.1s ease;
}

.bsbl-radio-cell-label:hover {
  background-color: #d0e4ff !important; /* Beautiful highlight on hover */
}

/* Reset Drupal wrappers and center radio buttons vertically and horizontally */
.bsbl-field-info .form-item,
.bsbl-field-info .js-form-item,
.bsbl-field-info .form-type-radio {
  margin: 0 !important;
  padding: 0 !important;
  line-height: normal !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Make radio button stand out outline ring */
.bsbl-field-info input[type="radio"] {
  margin: 0 auto !important;
  display: block !important;
  cursor: pointer !important;
  transform: scale(1.15) !important; /* Balanced neat size scale */
  accent-color: #0a408c !important; /* Themes the checked radio with our brand blue */
  /* Clean, thinner medium-contrast outer border ring */
  outline: 1px solid #555555 !important;
  outline-offset: 1px !important;
  border-radius: 50% !important;
}

/* 4. Form Select and File Upload Inputs (Step 1) */
.form-item-upload,
.form-item-outlets {
  margin-top: 15px;
  margin-bottom: 20px;
}

.form-item-upload label,
.form-item-outlets label {
  font-weight: 700;
  color: #222222;
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
}

.form-item-upload .description {
  font-size: 12px;
  color: #555555;
  margin-top: 4px;
  line-height: 1.4;
  max-width: 600px;
}

select#edit-outlets {
  height: 32px;
  border: 1.5px solid #666666;
  border-radius: 4px;
  padding: 2px 8px;
  font-size: 13px;
  font-weight: 600;
  background-color: #ffffff;
  color: #111111;
  min-width: 100px;
  cursor: pointer;
}

select#edit-outlets:focus {
  border-color: #0a408c;
  outline: 0;
  box-shadow: 0 0 4px rgba(10, 64, 140, 0.4);
}

input[type="file"].form-file {
  font-size: 13px;
  color: #222222;
  padding: 4px 8px;
  border: 1.5px solid #666666;
  border-radius: 4px;
  background-color: #ffffff;
  cursor: pointer;
}

/* 5. Custom Inline Status Messages Styles */
.bsbl-messages-inline {
  margin-top: 10px;
  margin-bottom: 20px;
  width: 100%;
}

.bsbl-messages-inline .messages {
  margin: 8px 0 !important;
  padding: 12px 18px !important;
  border-radius: 6px;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.5;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.bsbl-messages-inline .messages ul {
  margin: 0 !important;
  padding: 0 0 0 15px !important;
}

.bsbl-messages-inline .messages li {
  margin: 4px 0 !important;
  padding: 0 !important;
  list-style-type: disc !important;
}

.bsbl-messages-inline .messages--status {
  background-color: #edf7ed !important;
  color: #1e4620 !important;
  border-left: 6px solid #4caf50 !important;
  border-top: 1px solid rgba(76, 175, 80, 0.2) !important;
  border-right: 1px solid rgba(76, 175, 80, 0.2) !important;
  border-bottom: 1px solid rgba(76, 175, 80, 0.2) !important;
}

.bsbl-messages-inline .messages--warning {
  background-color: #fff8e1 !important;
  color: #b78103 !important;
  border-left: 6px solid #ffb300 !important;
  border-top: 1px solid rgba(255, 179, 0, 0.2) !important;
  border-right: 1px solid rgba(255, 179, 0, 0.2) !important;
  border-bottom: 1px solid rgba(255, 179, 0, 0.2) !important;
}

.bsbl-messages-inline .messages--error {
  background-color: #fde8e8 !important;
  color: #9b1c1c !important;
  border-left: 6px solid #f05252 !important;
  border-top: 1px solid rgba(240, 82, 82, 0.2) !important;
  border-right: 1px solid rgba(240, 82, 82, 0.2) !important;
  border-bottom: 1px solid rgba(240, 82, 82, 0.2) !important;
}

/* 6. Manual Entry Outlets Field Styles */
.bsbl-entry-outlets-container {
  margin-top: 15px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  background-color: #f7faff;
  padding: 10px 16px;
  border: 1px solid #d0e1fd;
  border-radius: 6px;
  max-width: 450px;
}

.bsbl-entry-outlets-container .form-item-outlets {
  display: flex;
  align-items: center;
  margin: 0 !important;
}

.bsbl-entry-outlets-container label {
  font-size: 13.5px;
  font-weight: 700;
  color: #222222;
  margin-right: 15px;
  margin-bottom: 0 !important;
  white-space: nowrap;
}

.bsbl-entry-outlets-container input[type="number"].bsbl-entry-outlets-input {
  width: 75px !important;
  height: 30px !important;
  border: 1.5px solid #666666 !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111111 !important;
  background-color: #ffffff !important;
  text-align: center !important;
}

.bsbl-entry-outlets-container input[type="number"].bsbl-entry-outlets-input:focus {
  border-color: #0a408c !important;
  outline: 0 !important;
  box-shadow: 0 0 4px rgba(10, 64, 140, 0.4) !important;
}