/* ==========================================================
   BASKET2 / SEARCH RESULTS – DESKTOP WIDESCREEN (min-width:1500px)
   Consolidated – preserves current behaviour + styling
   ========================================================== */

/* ===== Reset (Meyer) ===== */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{
  margin:0; padding:0; border:0;
  font-size:100%; font:inherit; vertical-align:baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section{ display:block; }
body{ line-height:1; }
ol, ul{ list-style:none; }
blockquote, q{ quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after{ content:''; content:none; }
table{ border-collapse:collapse; border-spacing:0; }

/* ===== Album theme vars ===== */
:root{
  --album-green-deep:#223B3B;
  --album-green:#2F4F4F;
  --album-green-mid:#385F5F;

  --paper:#FBFAF6;
  --paper-2:#F3F0E8;
  --ink:#1F2424;

  --mint:#BFE6D3;
  --mint-2:#8EC9AE;

  --enamel:#2B3434;
  --brass:#D5C08A;

  --shadow: 0.6vh 0.6vh 0.45vh rgba(0,0,0,0.18);
  --shadow-strong: 0.85vh 0.85vh 0.6vh rgba(0,0,0,0.24);

  --rhs-text:#F6F3E8;
  --rhs-border: rgba(213,192,138,0.62);
}

/* ===== Basics ===== */
a{ text-decoration:none; }
a:visited{ color:inherit; }
img{ width:100%; height:100%; object-fit:contain; }

/* ===== No page scroll (3-panel layout) ===== */
html, body{ height:100%; overflow:hidden; }
.SR_wrapper{ height:100vh; overflow:hidden; }

/* ===== Page grid ===== */
.SR_wrapper{
  display:grid;
  grid-template-columns:repeat(100, 1fr);
  grid-auto-rows:auto;
}

/* ===== MID scroll only ===== */
.SR_MID{
  grid-column:15/87;
  position:relative;
  background-color: var(--paper-2) !important;
  height:100vh;
  overflow-y:auto;
  overflow-x:hidden;
}

/* ===== LHS / RHS panels ===== */
.SR_LHS,
.B_LHS,
.SR_RHS{
  background-color: var(--album-green) !important;
  color:#F6F3E8;
  font-family:Arial, Helvetica, sans-serif;
  height:100vh;
  position:sticky;
  top:0;
  overflow-x:hidden;
}

.SR_LHS{ grid-column:1/15; left:0; font-size:0.8vw; font-weight:bold; line-height:2vh; }
.SR_RHS{ grid-column:87/101; right:0; font-size:1.1vw; padding-left:.8vw; padding-right:1vw; }
.B_LHS { grid-column:1/15; left:0; font-size:0.8vw; font-weight:bold; }

/* ===== LHS filter buttons (SR) ===== */
.SR_LHS_FILTER_button,
.SR_LHS_FILTER_button_selected{
  display:flex;
  align-items:center;
  padding-left:0.3vw;
  width:6vw;
  height:2.3vh;
  border-radius:0.6vw;
  background-color: var(--enamel);
  font-weight:600;
  transition:all linear 80ms;
}
.SR_LHS_FILTER_button{
  font-size:0.6vw;
  border: rgba(213,192,138,0.70) 0.1vw solid;
  color: var(--brass);
}
.SR_LHS_FILTER_button_selected{
  font-size:0.65vw;
  border: rgba(142,201,174,0.95) 0.1vw solid;
  color: var(--mint);
}
.SR_LHS_FILTER_button:active,
.SR_LHS_FILTER_button_selected:active{
  -webkit-transform:translateY(0.1vh);
  transform:translate(0.1vh, 0.1vh);
}
.SR_LHS_FILTER_button:hover{
  color: var(--mint);
  border-color: rgba(142,201,174,0.85);
}
.SR_LHS_FILTER_button_selected:hover{
  color: var(--mint);
  border-color: rgba(142,201,174,0.95);
}

/* ===== Items container variants ===== */
.SR_MID_itemsForSaleContainer4,
.SR_MID_itemsForSaleContainer5,
.SR_MID_itemsForSaleContainer6{
  display:grid;
  box-sizing:border-box;
  padding:1vw;
  gap:1vw;
}
.SR_MID_itemsForSaleContainer4{ grid-template-columns:repeat(4, 1fr); }
.SR_MID_itemsForSaleContainer5{ grid-template-columns:repeat(5, 1fr); }
.SR_MID_itemsForSaleContainer6{ grid-template-columns:repeat(6, 1fr); }

/* ===== Card base + hover ===== */
.SR_MID_itemForSale{
  font-family:Arial, Helvetica, sans-serif;
  color: var(--ink);
  font-weight:750;
  font-size:0.7vw;
  line-height:0.9vw;

  display:grid;
  grid-template-columns:repeat(12, 1fr);
  align-content:space-between;
  position:relative;

  background: var(--paper) !important;
  border: 0.15vw solid rgba(47,79,79,0.35) !important;
  border-radius: 0.45vw !important;
  padding:0.5vw;

  box-shadow:
    0 1px 2px rgba(0,0,0,0.06),
    0 6px 18px rgba(0,0,0,0.10) !important;

  transition: box-shadow 0.18s ease,
              border-color 0.18s ease,
              transform 0.08s linear;
}
.SR_MID_itemForSale:hover{
  border-color: var(--mint-2) !important; /* MATCH oneListing2/searchResults2 */
  box-shadow:
    0 3px 6px rgba(0,0,0,0.10),
    0 12px 26px rgba(0,0,0,0.14) !important;
}
.SR_MID_itemForSale:active{ transform: translateY(0.08vh); }

.SR_MID_pictureOfStamp{ grid-column:1/13; align-self:start; }

/* Description link hover */
.SR_MID_itemDescription{
  grid-column:1/13;
  padding:0.2vw 0;
  display:flex;
  align-self:flex-start;
  margin:0.1vw 0.3vw 0 0.3vw;
}
.SR_MID_itemDescription a{
  color: var(--ink) !important;
  border:0.1vw solid transparent !important;
  border-radius:0.3vw !important;
}
.SR_MID_itemDescription a:hover{
  background: #F3F0E8 !important;
  border-color: rgba(47,79,79,0.35) !important;
}

/* Watch icon */
.SR_MID_addToWatchList,
.SR_MID_noWatchList{
  grid-column:1/3;
  background-image:url("../../images/DISPLAY3/binoculars1.jpg");
  background-repeat:no-repeat;
  background-size:contain;
  background-position:left;
  padding-left:1vw;
  margin-top:0.5vw;
  position:relative;
}
.SR_MID_noWatchList{ opacity:0; }
.SR_MID_addToWatchList:hover{ background-image:url("../../images/DISPLAY3/binoculars2.jpg"); }
.SR_MID_addToWatchList2,
.SR_MID_addToWatchList3{ background-image:url("../../images/DISPLAY3/binoculars3.jpg"); }
.SR_MID_addToWatchList2:hover,
.SR_MID_addToWatchList3:hover{ background-image:url("../../images/DISPLAY3/binoculars2.jpg"); }

/* Basket icon */
.SR_MID_addToBasket{
  grid-column:11/13;
  background-image:url("../../images/DISPLAY3/cart1.jpg");
  background-repeat:no-repeat;
  background-size:contain;
  background-position:right;
  padding-right:1vw;
  margin-top:0.5vw;
  position:relative;
  border:none;
}
.SR_MID_addToBasket:hover{ background-image:url("../../images/DISPLAY3/cart2.jpg"); border:none; }
.SR_MID_addToBasket2{ background-image:url("../../images/DISPLAY3/cart3.jpg"); }
.SR_MID_addToBasket2:hover{ background-image:url("../../images/DISPLAY3/cart4.jpg"); }

/* Price pill */
.SR_MID_itemPrice{
  grid-column:3/11;
  justify-self:center;
  display:flex;
  justify-content:space-evenly;
  margin-top:0.5vw;
  padding:0.2vw;

  background: var(--enamel) !important;
  color: #F6F3E8 !important;

  border: 0.10vw solid rgba(213,192,138,0.65) !important;
  border-radius:0.45vw !important;

  font-size:1vw;

  box-shadow:
    0 1px 2px rgba(0,0,0,0.06),
    0 6px 18px rgba(0,0,0,0.10) !important;

  transition: box-shadow 0.18s ease, border-color 0.18s ease;
}
.SR_MID_itemPrice:hover{
  border-color: var(--mint-2) !important;
  box-shadow:
    0 3px 6px rgba(0,0,0,0.10),
    0 12px 26px rgba(0,0,0,0.14) !important;
}
.SR_MID_itemPrice *, .SR_MID_itemPrice a{ color:#F6F3E8 !important; }

/* Tooltips */
.SR_MID_addToWatchList::before,
.SR_MID_addToBasket::before{
  --scale:0;
  position:absolute;
  top:-0.5vh;
  left:50%;
  transform:translateX(-50%) translateY(-100%) scale(var(--scale));
  transition:150ms transform;
  transform-origin:bottom center;

  content:attr(data-tooltip);
  padding:0.5vh;
  border-radius:0.5vh;
  text-align:center;
  width:3.3vw;
  background: var(--album-green-mid);
  color: var(--mint);
}
.SR_MID_addToWatchList:hover::before,
.SR_MID_addToBasket:hover::before{ --scale:1; }
.SR_MID_removeFromBasket::before{ color:#ffd1d1; background:#5a1b1b; }

/* Pagination */
.div_SR_MID_pagination ul{ text-align:center; }
.div_SR_MID_pagination li{
  display:inline-block;
  margin-right:1vh;
  background-color: var(--enamel);
  color:#F6F3E8;
  font-size:1.5vw;
  border-radius:0.3vw;
  border:0.1vw solid var(--enamel);
  padding:0.3vw;
}
.div_SR_MID_pagination a{ color:#F6F3E8; }
.div_SR_MID_pagination a:hover{ color: var(--mint); }

/* ===== RHS buttons ===== */
.SR_RHS_title{ font-size:1vw; font-weight:600; color:#F6F3E8; }

.SR_RHS_links{
  font-size:1.2vw;
  font-weight:600;
  text-align:center;
  padding:0.5vw;

  border:0.15vw solid var(--rhs-border) !important;
  border-radius:1.5vw;
  position:relative;

  background-color: var(--enamel) !important;
  color: var(--rhs-text) !important;

  width:9.4vw;
  left:0.7vw;

  transition:all linear 80ms;
  box-shadow: var(--shadow);
}
.SR_RHS_links:hover{
  color: var(--mint) !important;
  border-color: rgba(142,201,174,0.85) !important;
  box-shadow: var(--shadow-strong);
  cursor:pointer;
}
.SR_RHS_links:active{
  -webkit-transform:translateY(0.1vh);
  transform:translate(0.1vh, 0.1vh);
}

.SR_RHS_homepageTitle{
  font-size:1.4vw;
  font-weight:600;
  border: 0.2vw solid var(--rhs-border) !important;
  color: var(--rhs-text) !important;
  border-radius:1.5vw;
  background-color: var(--enamel) !important;
  transition:all linear 80ms;
}
.SR_RHS_homepageTitle:active{
  -webkit-transform:translateY(0.1vh);
  transform:translate(0.1vh, 0.1vh);
}
.space_between_buttons{ height:0.7vh; }

/* View buttons */
#SR_RHS_view input,
#SR_RHS_view_selected input{
  width:9.8vw;
  height:4.4vh;
  font-size:0.9vw;
  left:1.2vw;
  text-align:center;
  line-height:0;
  background-color: var(--enamel);
  border-color: var(--rhs-border) !important;
  color: var(--rhs-text) !important;
}
#SR_RHS_view input:hover,
#SR_RHS_view_selected input:hover{
  border-color: rgba(142,201,174,0.85) !important;
  color: var(--mint) !important;
}
#SR_RHS_view_selected input{
  border-color: rgba(142,201,174,0.95) !important;
  color: var(--mint) !important;
  box-shadow: 0 0 0.35em rgba(142,201,174,0.35), var(--shadow-strong) !important;
}

/* ===== Basket LHS content ===== */
.B_LHS>div{ position:relative; padding:0.5vw 1vw; top:0; }
.B_LHS_top_title_1{ font-size:1.3vw; }
.B_LHS_top_title{ font-size:1vw; }
.B_LHS_top_title_2{ font-size:1.3vw; }
.B_LHS_para{ font-size:0.8vw; }
.add_for_free_postage{ font-size:1.35vh; text-align:center; }

/* logo */
.SR_LHS_logo{ text-align:center; padding:0.6vw 0; }
.SR_LHS_logo img{ width:9.5vw; height:auto; display:inline-block; }

/* br spacing */
.B_LHS br{ line-height:0.8vh; }

/* action buttons (only real links like “See Offers Details”) */
.B_LHS_links{
  font-size:1.2vw;
  font-weight:600;

  display:flex;
  justify-content:center;
  align-items:center;

  width:7vw;
  height:1.8vh;
  margin:0.4vh auto !important;

  border:0.15vw solid rgba(213,192,138,0.65);
  border-radius:1.5vw;

  background-color: var(--enamel);
  color:#F6F3E8;

  transition:all linear 80ms;
  box-shadow: var(--shadow);
}
.B_LHS_links:hover{
  color: var(--mint) !important;
  border-color: rgba(142,201,174,0.85) !important;
  box-shadow: var(--shadow-strong);
  cursor:pointer;
}
.B_LHS_links:active{ transform: translateY(0.1vh); }

/* offers button sizing tweak */
.B_LHS_offers_btn{
  width:10vw;
  padding:0.5vw;
  font-size:2vh;
}

/* info labels (non-clickable) */
.B_LHS_info{
  font-size:1.15vw;
  font-weight:600;
  text-align:center;

  display:flex;
  justify-content:center;
  align-items:center;

  width:7vw;
  height:2.0vh;
  margin:0.45vh auto;

  background:#F6F3E8;
  color:#1F2424;

  border:0.10vw solid #1F2424;
  border-radius:0.7vw;

  box-shadow:none;
  cursor:default;
}
.B_LHS_info:hover,
.B_LHS_info:active{
  background:#F6F3E8;
  color:#1F2424;
  border-color:#1F2424;
  box-shadow:none;
  transform:none;
}

/* ===== Basket RHS buttons ===== */
.B_RHS_links{
  font-size:1.2vw;
  text-align:center;
  padding:0.5vw;

  border:0.15vw solid rgba(213,192,138,0.65) !important;
  border-radius:1.5vw;
  position:relative;
  text-decoration:none;

  background-color: var(--enamel) !important;
  color: var(--rhs-text) !important;

  width:10.9vw;
  left:0.7vw;

  transition:all linear 80ms;
  box-shadow: var(--shadow);
}
.B_RHS_links:hover{
  color: var(--mint) !important;
  border-color: rgba(142,201,174,0.85) !important;
  box-shadow: var(--shadow-strong);
}
.B_RHS_homepageTitle{
  font-size:1.4vw;
  font-weight:600;
  border: 0.2vw solid var(--rhs-border) !important;
  color: var(--rhs-text) !important;
  border-radius:1.5vw;
  background-color: var(--enamel) !important;
}

/* misc */
.copy2{ font-size:0.6vw; }
.basket_user_logged_in{ color: var(--brass); }
.basket_user_guest{ color:#ff8f8a; }
.basket_left_gap_3{ height:1.5vh; }
.sb_gap_right{ height:1vh; }

/* prev */
.PREV{
  transition:all linear 80ms;
  border-color: var(--rhs-border) !important;
  color: var(--rhs-text) !important;
}
.PREV:active{
  -webkit-transform:translateY(0.1vw);
  transform:translate(0.1vh, 0.1vh);
}

/* mount style */
.B_MID_pictureOfStamp,
.B_pictureOfStamp,
.basket_pictureOfStamp,
.SR_MID_pictureOfStamp{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  background-color:#2B2A26 !important;
  padding-top:0.9vh !important;
  padding-bottom:0.9vh !important;

  box-sizing:border-box !important;

  background-image: linear-gradient(
    to bottom,
    rgba(255,255,255,0.06),
    rgba(255,255,255,0.02)
  ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    inset 0 -1px 0 rgba(255,255,255,0.08) !important;
}
.B_MID_pictureOfStamp img,
.B_pictureOfStamp img,
.basket_pictureOfStamp img,
.SR_MID_pictureOfStamp img{
  width:100% !important;
  height:auto !important;
  max-height:100% !important;
  object-fit:contain !important;
  display:block !important;
}
.SR_MID_itemForSale:hover .B_MID_pictureOfStamp,
.SR_MID_itemForSale:hover .B_pictureOfStamp,
.SR_MID_itemForSale:hover .basket_pictureOfStamp,
.SR_MID_itemForSale:hover .SR_MID_pictureOfStamp{
  background-color:#1A1A1A !important;
}

/* RHS search (final) */
.SR_RHS_searchboxes{ display:flex; justify-content:center; }
.B_SR_RHS_searchboxes{
  display:block !important;
  position:relative !important;
  z-index:2 !important;

  width:10.5vw;
  height:4.5vh;
  border-radius:0.5vw;
  padding-left:0.8vw;

  font-size:1vw;
  font-weight:600;

  background:#F6F3E8 !important;
  color:#2f3e46 !important;

  border:1px solid #c7bfae !important;
  box-shadow:none !important;
  outline:none !important;

  background-clip:padding-box !important;
}
.B_SR_RHS_searchboxes::placeholder{ color:#8a8678 !important; opacity:1; }
.B_SR_RHS_searchboxes:focus{
  border-color:#caa95a !important;
  box-shadow:0 0 0 1px rgba(202,169,90,0.25) !important;
}

/* ==========================================================
   USER STATUS – elegant neutral guest styling
   ========================================================== */

.basket_user_logged_in{
  color: var(--brass);
  font-style: normal;
}

.basket_user_guest{
  color: #D8D2C2;      /* warm light grey (readable, calm, premium) */
  font-style: italic;  /* subtle status cue */
}

/* ==========================================================
   PANEL LINE-HEIGHT CONTROLS
   Profiles: MateView (tall), Dell (short/wide), Laptop, iPad landscape
   Paste at VERY END so it wins.
   ========================================================== */

/* ---------- Default fallbacks (if no media query matches) ---------- */
:root{
  --lhs-line: 2.0vh;     /* LHS + Basket LHS */
  --rhs-line: 2.2vh;     /* RHS */
}

.SR_LHS, .B_LHS{ line-height: var(--lhs-line) !important; }
.SR_RHS        { line-height: var(--rhs-line) !important; }


/* ==========================================================
   DESKTOP BAND (MateView + Dell) 1701–2200
   Split by aspect ratio like your index2 approach
   ========================================================== */

/* MateView / DESKTOP TALL (aspect <= 2/1) */
@media (min-width:1701px) and (max-width:2200px) and (max-aspect-ratio: 2/1){
  :root{
    --lhs-line: 2.05vh;
    --rhs-line: 2.25vh;
  }
}

/* Dell / DESKTOP SHORT-WIDE (aspect >= 2/1) */
@media (min-width:1701px) and (max-width:2200px) and (min-aspect-ratio: 2/1){
  :root{
    --lhs-line: 1.85vh;
    --rhs-line: 2.05vh;
  }
}


/* ==========================================================
   LAPTOP (1101–1700)
   ========================================================== */
@media (min-width:1101px) and (max-width:1700px){
  :root{
    --lhs-line: 1.9vh;
    --rhs-line: 2.25vh;
  }
}


/* ==========================================================
   iPad LANDSCAPE (768–1100, coarse pointer)
   (matches your SR2 stability approach)
   ========================================================== */
@media (min-width:768px) and (max-width:1100px)
  and (orientation:landscape) and (pointer:coarse){

  :root{
    --lhs-line: 1.7vh;
    --rhs-line: 2.4vh;
  }
}

/* ==========================================================
   iPad LANDSCAPE — FONT SIZE CONTROLS (LHS + RHS only)
   Safe, isolated, tweakable
   ========================================================== */

/* ==========================================================
   iPad LANDSCAPE — INDEPENDENT FONT SIZE CONTROLS
   LHS and RHS tuned separately (no desktop impact)
   ========================================================== */
@media (min-width:768px) and (max-width:1100px)
  and (orientation:landscape) and (pointer:coarse){

  /* ===== RHS (you said this was fine) ===== */
  :root{
    --ipad-rhs-font: 1.35vw;
    --ipad-rhs-title: 1.6vw;
    --ipad-rhs-btn: 1.15vw;
    --ipad-rhs-small: 1.05vw;
  }
  .SR_RHS{ font-size: var(--ipad-rhs-font) !important; }
  .SR_RHS_title{ font-size: var(--ipad-rhs-title) !important; }
  .SR_RHS_links,
  #SR_RHS_view input,
  #SR_RHS_view_selected input,
  .download-btn, .download-btn2{
    font-size: var(--ipad-rhs-btn) !important;
  }
  .SR_RHS .copy2{ font-size: var(--ipad-rhs-small) !important; }


  /* ===== LHS (independent controls) ===== */
  :root{
    --ipad-lhs-font: 1.10vw;     /* base LHS text */
    --ipad-lhs-title: 1.3vw;    /* LHS section titles */
    --ipad-lhs-btn: 1vw;      /* filter buttons */
    --ipad-lhs-input: 1.00vw;    /* search inputs */
    --ipad-lhs-small: 0.95vw;    /* helper text */
  }

  .SR_LHS,
  .B_LHS{
    font-size: var(--ipad-lhs-font) !important;
  }

  .SR_LHS_top_title,
  .B_LHS_top_title,
  .B_LHS_top_title_1,
  .B_LHS_top_title_2{
    font-size: var(--ipad-lhs-title) !important;
  }

  .SR_LHS_FILTER_button,
  .SR_LHS_FILTER_button_selected{
    font-size: var(--ipad-lhs-btn) !important;
  }

  .SR_LHS_searchboxes_inactive,
  .SR_LHS_searchboxes_active,
  .SR_LHS_searchtitle_box_inactive,
  .SR_LHS_searchtitle_box_active{
    font-size: var(--ipad-lhs-input) !important;
  }

  .SR_LHS_smallbreak,
  .SR_LHS_largebreak,
  .copy2,
  .details,
  .add_for_free_postage{
    font-size: var(--ipad-lhs-small) !important;
  }
  
  /* ===== iPad LHS button font control ===== */
.B_LHS_links,
.B_LHS_offers_btn{
  font-size: var(--ipad-lhs-btn) !important;
}

}


/* ===== HIDE MID SCROLLBAR (still scrolls) ===== */
.SR_MID{
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* old Edge/IE */
}
.SR_MID::-webkit-scrollbar{
  width: 0;
  height: 0;
}


.basket_text{
    font-size: 1vw;
}

/* ==========================================================
   BASKET2 — QVS HOME BUTTON PADDING MATCH WATCH2
   (affects ONLY the QVS Home pill)
   ========================================================== */

.SR_RHS_homepageTitle,
.B_RHS_homepageTitle{
  padding: 0.4vw 0.55vw !important;   /* copy feel from watch2 */
  line-height: 1.2 !important;         /* prevents cramped text */
}

/* ==========================================================
   BASKET2 — INFO BOXES: VERTICALLY CENTER TEXT (NO RESIZE)
   Paste at VERY END
   ========================================================== */

.B_LHS_info{
  /* keep YOUR sizing exactly as defined earlier */
  /* (do NOT restate width/min-height/padding here) */

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* key: make the text's line box match the box height */
  line-height: 2.0vh !important;
}

