/* ==========================================
   IBSA – B2BKing Bulk Order Form Overrides
   File: /wp-content/uploads/ibsa/b2bking-overrides.css
   ========================================== */

/* ---------
   IBSA vars
   --------- */
:root{
  --ibsa-blue: #253067;     /* pas aan naar jullie exacte IBSA blauw */
  --ibsa-blue-hover: #0069AA;
  --ibsa-text: #00245e;
  --ibsa-gray-100: #F6F7F9;
  --ibsa-gray-200: #E6E9EE;
  --ibsa-gray-500: #6B7280;
}

/* ------------------------------------------
   1) Typography: alles Arial binnen order form
   ------------------------------------------ */
html body .b2bking_bulkorder_form_container,
html body .b2bking_bulkorder_form_container *{
  font-family: Arial, sans-serif !important;
}

/* Titels iets strakker */
html body #b2bking_myaccount_bulkorder_title{
  font-family: Arial, sans-serif !important;
  color: var(--ibsa-text) !important;
}

/* ---------------------------
   2) Container: cleaner / IBSA
   --------------------------- */
html body .b2bking_bulkorder_form_container_cream{
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.08) !important;
}

/* Headerbar iets rustiger (optioneel) */
html body .b2bking_bulkorder_form_container_top_indigo.b2bking_bulkorder_form_container_top_cream{
  border-radius: 0 !important;
}

/* ------------------------------------
   3) Primary buttons: "Toevoegen" (per rij)
   ------------------------------------ */
html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add,
html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add:focus,
html body .b2bking_bulkorder_form_container:not(.nonadaptive)
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add{
  border-radius: 0 !important;
  background: var(--ibsa-blue) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  min-height: 42px !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add:hover{
  background: var(--ibsa-blue-hover) !important;
}

/* Voorraad states blijven duidelijk */
html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add.b2bking_none_in_stock{
  background: #B6B6B6 !important;
  color: #fff !important;
}
html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add.b2bking_low_in_stock{
  background: #E06A6A !important;
  color: #fff !important;
}

/* View options button: neutraal */
html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add.b2bking_cream_view_options_button{
  background: #fff !important;
  color: #222 !important;
  border: 1px solid rgba(0,0,0,.2) !important;
  font-weight: 600 !important;
  border-radius: 0 !important;
}
html body button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add.b2bking_cream_view_options_button:hover{
  background: #F3F4F6 !important;
}

/* -------------------------------------------------
   4) Bottom action buttons (add/save/update/delete)
   ------------------------------------------------- */
html body button.b2bking_bulkorder_form_container_bottom_add_button{
  border-radius: 0 !important;
  background: var(--ibsa-blue) !important;
  color: #fff !important;
  border: none !important;
}
html body button.b2bking_bulkorder_form_container_bottom_add_button:hover{
  background: var(--ibsa-blue-hover) !important;
}

html body button.b2bking_bulkorder_form_container_bottom_save_button,
html body button.b2bking_bulkorder_form_container_bottom_update_button,
html body button.b2bking_bulkorder_form_container_bottom_delete_button{
  border-radius: 0 !important;
  background: var(--ibsa-gray-500) !important;
  color: #fff !important;
  border: none !important;
}
html body button.b2bking_bulkorder_form_container_bottom_save_button:hover,
html body button.b2bking_bulkorder_form_container_bottom_update_button:hover,
html body button.b2bking_bulkorder_form_container_bottom_delete_button:hover{
  filter: brightness(0.92) !important;
}

/* -------------------------------------------
   5) Floating buttons (Add selected / View cart)
   ------------------------------------------- */
html body #b2bking_cream_add_selected.active,
html body #b2bking_cream_view_cart{
  border-radius: 0 !important;
  background: var(--ibsa-blue) !important;
  color: #fff !important;
  border: none !important;
  min-height: 42px !important;
  padding: 8px 20px !important;
}
html body #b2bking_cream_view_cart:hover,
html body #b2bking_cream_add_selected:hover{
  background: var(--ibsa-blue-hover) !important;
  filter: none !important;
}

/* -----------------------------
   6) Inputs: cleaner + rechthoekig
   ----------------------------- */
html body input.b2bking_bulkorder_form_container_content_line_qty_indigo.b2bking_bulkorder_form_container_content_line_qty_cream{
  border-radius: 0 !important;
  border-top: 1px solid rgba(0,0,0,.2) !important;
  border-bottom: 1px solid rgba(0,0,0,.2) !important;
}

html body .b2bking_cream_input_button.b2bking_cream_input_minus_button,
html body .b2bking_cream_input_button.b2bking_cream_input_plus_button{
  border-radius: 0 !important;
}

/* Focus outlines uit (B2BKing doet dit ook al, maar consistent) */
html body .b2bking_bulkorder_form_container *:focus{
  outline: 0 !important;
}

/* --------------------------
   7) Thumbnails groter (IBSA)
   -------------------------- */
html body img.b2bking_bulkorder_indigo_image,
html body img.b2bking_bulkorder_indigo_image.b2bking_bulkorder_cream_image,
html body img.b2bking_livesearch_image{
  width: 80px !important;
  height: 80px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  background: transparent;
}

/* Meer lucht tussen thumb en tekst */
html body .b2bking_bulkorder_indigo_product_container{
  gap: 14px;
}

/* Mobiel iets compacter */
@media (max-width: 665px){
  html body img.b2bking_bulkorder_indigo_image,
  html body img.b2bking_bulkorder_indigo_image.b2bking_bulkorder_cream_image,
  html body img.b2bking_livesearch_image{
    width: 48px !important;
    height: 48px !important;
  }
}

/* ---------------------------
   8) Kleine polish (optioneel)
   --------------------------- */
html body .b2bking_bulkorder_cream_sku,
html body .b2bking_bulkorder_cream_stock{
  font-family: Arial, sans-serif !important;
}




 /* ==========================================
   IBSA – Staffelblok (B2BKing tiered pricing)
   ========================================== */

/* Basis: geen WooCommerce border/box */
html body table.b2bking_tiered_price_table.shop_table{
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border-collapse: collapse !important;
  overflow: hidden;
  width: 100%;
  margin: 0 !important;
}

/* Header: IBSA blauw, strak */
html body table.b2bking_tiered_price_table.shop_table thead th{
  background: var(--ibsa-blue, #007BC7) !important;
  color: #fff !important;
  font-family: Arial, sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-transform: none !important;
  padding: 10px 14px !important;
  border: 0 !important;
}

/* Body cells: rustige lijnen, geen verticale borders */
html body table.b2bking_tiered_price_table.shop_table tbody td{
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  color: var(--ibsa-text, #0B1F2A) !important;
  padding: 10px 14px !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--ibsa-gray-200, #E6E9EE) !important;
  background: #fff !important;
  vertical-align: middle;
}

/* Laatste rij: geen extra bottom-border */
html body table.b2bking_tiered_price_table.shop_table tbody tr:last-child td{
  border-bottom: 0 !important;
}

/* Rijtjes: subtiele zebra voor leesbaarheid */
html body table.b2bking_tiered_price_table.shop_table tbody tr:nth-child(even) td{
  background: var(--ibsa-gray-100, #F6F7F9) !important;
}

/* Hover: heel subtiel (handig omdat het klikbaar is) */
html body table.b2bking_tiered_price_table.shop_table.b2bking_tiered_clickable tbody tr:hover td{
  filter: brightness(0.98);
  cursor: pointer;
}

/* Actieve staffelregel (B2BKing voegt vaak .b2bking_tiered_active toe; als die er niet is, werkt het nog via :has hieronder) */
html body table.b2bking_tiered_price_table.shop_table tbody tr.b2bking_tiered_active td{
  background: rgba(0, 123, 199, 0.08) !important;
  font-weight: 700 !important;
}

/* Fallback: als B2BKing de active class niet zet, dan highlighten we de rij waar de actuele prijs staat (vaak in een <ins>) */
html body table.b2bking_tiered_price_table.shop_table tbody tr:has(ins) td{
  background: rgba(0, 123, 199, 0.08) !important;
  font-weight: 700 !important;
}

/* Oude prijs (doorgestreept) subtieler */
html body table.b2bking_tiered_price_table.shop_table del,
html body table.b2bking_tiered_price_table.shop_table del .amount{
  opacity: 0.55;
}

/* Nieuwe prijs (ins) netjes en IBSA kleur */
html body table.b2bking_tiered_price_table.shop_table ins,
html body table.b2bking_tiered_price_table.shop_table ins .amount{
  color: var(--ibsa-blue, #007BC7) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
}

/* Mobiel: compacter */
@media (max-width: 665px){
  html body table.b2bking_tiered_price_table.shop_table thead th{
    font-size: 13px !important;
    padding: 9px 10px !important;
  }
  html body table.b2bking_tiered_price_table.shop_table tbody td{
    font-size: 13px !important;
    padding: 9px 10px !important;
  }
}