/* =========================================
SPINWIZARD OFFER CARDS
Standalone card styling (replaces Thrive CSS)
========================================= */

/* Card container */
.free-spin-offer {
position:relative;
background:#fff;
border-radius:18px;
padding:18px;
box-shadow:0 4px 14px rgba(0,0,0,0.08);
border:10px solid #e6e6e6;
display:grid;
grid-template-columns:92px 1fr;
gap:14px;
transition:transform .15s ease, box-shadow .15s ease;
}

.free-spin-offer:hover{
transform:translateY(-2px);
box-shadow:0 10px 25px rgba(0,0,0,0.12);
}

/* Logo area */

.free-spin-offer img{
max-width:80px;
height:auto;
}

.offer-logo img{
max-width:800px;
margin:100px 0 4px;
height:auto;
}

/* Headline */

.free-spin-offer h3{
font-size:20px;
font-weight:700;
margin:0 0 4px;
color:#1f2937;
}

/* Sub headline */

.free-spin-offer .offer-subheadline{
font-size:14px;
color:#6b7280;
margin-bottom:6px;
}

/* Casino name */

.free-spin-offer .offer-casino{
font-size:13px;
color:#9ca3af;
margin-bottom:8px;
}

/* Terms text */

.free-spin-offer .offer-terms{
font-size:12px;
line-height:1.4;
color:#6b7280;
margin-top:0px;
padding-top:10px;
border-top:1px dashed #ddd;
}

/* =========================================
CTA BUTTON
========================================= */

.free-spin-offer .offer-cta{
display:inline-block;
background:#fff;
color:#fff;
padding:0px 0px;
border-radius:1px;
font-weight:700;
text-decoration:none;
font-size:14px;
}



/* =========================================
CTA BUTTON
========================================= */

.free-spin-offer .offer-button{
display:inline-block;
background:#fff;
color:#16a34a;
padding:1px 18px;
border-radius:1px;
font-weight:700;
text-decoration:none;
font-size:14px;
}

.free-spin-offer .offer-button:hover{
background:#16a34a;
}

/* =========================================
HIDE OFFER BUTTON
========================================= */

.free-spin-offer .hide-offer-btn{
display:block;
margin-top:12px;
text-align:center;
border:2px solid #3b82f6;
color:#3b82f6;
padding:10px;
border-radius:10px;
font-weight:600;
text-decoration:none;
font-size:14px;
}

/* =========================================
BADGES
========================================= */

.offer-badge{
position:absolute;
top:10px;
font-size:11px;
padding:4px 10px;
border-radius:10px;
font-weight:700;
color:#fff;
}

/* left badge */

.offer-badge--secondary{
left:10px;
}

/* right badge */

.offer-badge--primary{
right:10px;
}

/* colors */

.offer-badge--new{
background:#22c55e;
}

.offer-badge--cash{
background:#f59e0b;
}

.offer-badge--popular{
background:#fb923c;
}

.offer-badge--no-deposit{
background:#7c3aed;
}

/* =========================================
MOBILE
========================================= */

@media (max-width:768px){

.free-spin-offer{
grid-template-columns:1fr;
text-align:center;
}

.free-spin-offer img{
margin:0 auto 10px;
}

.offer-badge--secondary{
left:10px;
}

.offer-badge--primary{
right:10px;
}

}
/* ======================================================
   1) SPINWIZARD OFFERS (SCOPED)
   Everything in here only applies inside .spinwizard-offers
   ====================================================== */

/* Wrapper (this is the class your shortcode outputs) */
.spinwizard-offers{
  position:relative;
  padding:0.2rem 1rem 3rem;   /* top spacing reduced, bottom keeps breathing room */
  background:transparent;   /* donâ€™t fight the page background */
  box-sizing:border-box;
}

/* Soft vignette overlay */
.spinwizard-offers::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at center, rgba(15,23,42,.05), transparent 55%);
  opacity:.7;
  mix-blend-mode:soft-light;
}

/* GRID */
.spinwizard-offers .free-spins-list{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  gap:1.5rem !important;
  align-items:stretch !important;

  max-width:1200px;
  margin:0 auto;
  padding:0;
  box-sizing:border-box;
}

/* 2 columns on medium */
@media (max-width:1024px){
  .spinwizard-offers .free-spins-list{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

/* 1 column on mobile */
@media (max-width:640px){
  .spinwizard-offers .free-spins-list{
    grid-template-columns:1fr !important;
  }
}

/* CARD */
.spinwizard-offers article.free-spin-offer{
  position:relative;
  overflow:hidden;

  background:var(--sw-card-bg) !important;
  border:1px solid rgba(148,163,184,.35) !important;
  border-top:4px solid rgba(148,163,184,.60) !important;
  border-radius:var(--sw-radius-card) !important;
  box-shadow:var(--sw-card-shadow) !important;

  padding:3.2rem 0.8rem 1.2rem !important;
  margin:0 !important;

  display:flex !important;
  flex-direction:column;
  align-items:center;
  text-align:center;
  height:100%;

  font-family:var(--sw-font-sans) !important;
  color:var(--sw-text-main);
  box-sizing:border-box;

  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

/* Glow layer */
.spinwizard-offers article.free-spin-offer::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at top, rgba(56,189,248,.16), transparent 55%);
  opacity:0;
  transition:opacity .18s ease;
}

.spinwizard-offers article.free-spin-offer:hover{
  transform:translateY(-6px) scale(1.01);
  box-shadow:0 22px 50px rgba(15,23,42,.18) !important;
  border-color:rgba(129,140,248,.60) !important;
}
.spinwizard-offers article.free-spin-offer:hover::before{ opacity:1; }

/* Subtle coloured top bar per type */
.spinwizard-offers article.free-spin-offer.offer--nodeposit{ border-top-color:#8b5cf6 !important; }
.spinwizard-offers article.free-spin-offer.offer--cash{     border-top-color:#facc15 !important; }
.spinwizard-offers article.free-spin-offer.offer--freebet{  border-top-color:#38bdf8 !important; }
.spinwizard-offers article.free-spin-offer.offer--popular{  border-top-color:#f97316 !important; }
.spinwizard-offers article.free-spin-offer.offer--new{      border-top-color:#22c55e !important; }

/* Header layout */
.spinwizard-offers .offer-header{
  width:100%;
  display:flex !important;
  flex-direction:column;
  align-items:center;
  row-gap:.10rem;
}

/* Logo */
.spinwizard-offers .offer-logo{ margin-bottom:.7rem; }
.spinwizard-offers .offer-logo img{
  max-height: !important;
  width:auto !important;
  margin:0 auto !important;
  border-radius:5px !important;
  display:block;
}

/* Text */
.spinwizard-offers .offer-main{ margin-bottom:0rem !important; }

.spinwizard-offers .offer-headline{
  margin:0 0 .25rem !important;
  font-size:1.4rem !important;
  font-weight:800 !important;
  color:var(--sw-heading) !important;
  text-transform:uppercase !important;
  letter-spacing:.03em !important;
  text-align:center !important;
}

.spinwizard-offers .offer-subheadline{
  margin:0 0 .25rem !important;
  font-size:.96rem !important;
  font-weight:700 !important;
  color:#4b5563 !important;
  text-align: center !important;
}

.spinwizard-offers .offer-tagline{
  margin:0 0 0.7rem !important;
  font-size:.82rem !important;
  font-weight:600 !important;
  text-transform:uppercase !important;
  letter-spacing:.06em !important;
  color:#9ca3af !important;
  text-align: center !important;
}

/* CTA */
.spinwizard-offers .offer-cta{ 
  margin-top:8px !important; 
}

.spinwizard-offers .offer-button{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap: 0rem;

  padding:.8rem 1.9rem !important;
  border-radius:10px !important;
  border:0 !important;

  background:linear-gradient(135deg, #22c55e, #16a34a) !important;
  color:#fff !important;
  font-weight:700 !important;
  font-size:.9rem !important;
  letter-spacing:.04em;
  text-transform:uppercase !important;

  box-shadow:0 12px 30px rgba(22,163,74,.45) !important;
  text-decoration:none !important;

  transition:transform .12s ease, filter .12s ease;
}
.spinwizard-offers .offer-button:hover{
  background:linear-gradient(135deg, #16a34a, #15803d) !important;
  transform:translateY(-1px);
}
.spinwizard-offers .offer-button:focus{ text-decoration:none !important; }

/* Smallprint */
.spinwizard-offers .offer-smallprint,
.spinwizard-offers .offer-smallprint p{
    position:relative;
  margin-top:0.5rem !important;
    margin-bottom:0.5rem !important;
  font-size:.7rem !important;
  font-weight:400 !important;
  color:var(--sw-text-muted) !important;
  text-align:center !important;

  max-height:3.5em !important;
  overflow-y:auto !important;

  -ms-overflow-style:none;
  scrollbar-width:none;
}
.spinwizard-offers .offer-smallprint::-webkit-scrollbar{ display:none !important; }

/* Badge */
.spinwizard-offers .offer-badge{
  position:absolute;
  top:8px;
  left:14px;

  padding:4px 11px;
  border-radius:5px;

  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#fff;

  z-index:10;

  max-width:98px;
  white-space:normal;
  line-height:1.2;
  text-align:center;
  word-break:break-word;

  box-shadow:0 8px 20px rgba(15,23,42,.25);
}
/* Badge colour variants (match your PHP classes: offer-badge--{type}) */
.spinwizard-offers .offer-badge--nodeposit{ background:linear-gradient(135deg, #7c3aed, #a855f7); }
.spinwizard-offers .offer-badge--cash{     background:linear-gradient(135deg, #f59e0b, #facc15); color:#111827; }
.spinwizard-offers .offer-badge--freebet{  background:linear-gradient(135deg, #0ea5e9, #38bdf8); }
.spinwizard-offers .offer-badge--popular{  background:linear-gradient(135deg, #f97316, #fb923c); }
.spinwizard-offers .offer-badge--new{      background:linear-gradient(135deg, #22c55e, #4ade80); }

/* FILTER BAR (width matches grid) */
.spinwizard-offers .spinwizard-filter{
  display:flex;
  flex-wrap:wrap;                 /* keep one line */
  justify-content:center;
  gap:.15rem;

  max-width:1200px;
  width:100%;
  margin:.5rem auto 2rem;           /* spacing under filter */
  padding:.35rem;

  border-radius:5px;
  background:rgba(255,255,255,.90);
  box-shadow:0 10px 30px rgba(15,23,42,.12);

  overflow-x:auto;                  /* scroll instead of wrapping */
  -webkit-overflow-scrolling:touch;
  box-sizing:border-box;
}
/* Remove filter bar container background */
.spinwizard-offers .spinwizard-filter{
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.spinwizard-offers .spinwizard-filter .sw-filter-btn{ flex:0 0 auto; white-space:nowrap; }

/* Filter buttons */
.spinwizard-offers .sw-filter-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;

  border-radius:10px;
  border:0;
  padding:.55rem 1.45rem;

  font-size:.85rem;
  font-weight:600;
  font-family:var(--sw-font-sans);
  background:transparent;
  color:#475569;
  cursor:pointer;

  transition:background .16s ease, color .16s ease, box-shadow .16s ease, transform .12s ease;
}
.spinwizard-offers .sw-filter-btn .sw-filter-icon{ font-size:1rem; line-height:1; }
.spinwizard-offers .sw-filter-btn:hover{
  background:rgba(148,163,184,.12);
  transform:translateY(-1px);
}
.spinwizard-offers .sw-filter-btn.is-active{
  background:linear-gradient(135deg, #2563eb, #7c3aed);
  color:#fff;
  box-shadow:0 10px 26px rgba(37,99,235,.55);
}
.spinwizard-offers .sw-filter-btn.is-active .sw-filter-icon{
  filter:drop-shadow(0 0 4px rgba(15,23,42,.5));
}

/* Reorder animation */
.spinwizard-offers .free-spins-list{
  transition:opacity .15s ease, transform .15s ease;
}
.spinwizard-offers.sw-animating .free-spins-list{
  opacity:0;
  transform:translateY(4px);
}
.spinwizard-offers.sw-animating .free-spin-offer{
  transition:transform .18s ease, opacity .18s ease;
  transform:scale(.99);
  opacity:.9;
}
.spinwizard-offers {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
/* Thrive: allow shortcode area to go full width (this is the limiter) */
.tve_shortcode_rendered{
  max-width: none !important;
  width: 100% !important;
}

/* Now make filter + grid take the full available width */
.spinwizard-offers .spinwizard-filter,
.spinwizard-offers .free-spins-list{
  max-width: none !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
/* Whatever plugin is wrapping the shortcode is limiting width */
.tve_shortcode_rendered{
  max-width: none !important;
  width: 100% !important;
}

/* Now ensure both filter and grid stretch equally */
.tve_shortcode_rendered .spinwizard-offers,
.tve_shortcode_rendered .spinwizard-offers .spinwizard-filter,
.tve_shortcode_rendered .spinwizard-offers .free-spins-list{
  width: 100% !important;
  max-width: 1200px !important; /* change to 1400px if your offers are wider */
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* =========================================
FILTER BUTTONS
========================================= */

.spinwizard-offers .sw-filter-btn{

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;

  padding:10px 18px;
  border-radius:10px;

  border:1px solid #d1d5db;
  background:#ffffff;

  font-size:.85rem;
  font-weight:600;
  color:#374151;

  cursor:pointer;

  transition:all .15s ease;
}

/* hover */
.spinwizard-offers .sw-filter-btn:hover{
  background:#f1f5f9;
  border-color:#cbd5f5;
}

/* active filter */
.spinwizard-offers .sw-filter-btn.is-active{
  background:linear-gradient(135deg,#2563eb,#7c3aed);
  color:#fff;
  border-color:transparent;

  box-shadow:0 8px 20px rgba(37,99,235,.35);
}

/* =========================================
MOBILE FILTER BUTTONS
========================================= */

@media (max-width:640px){

.spinwizard-offers .spinwizard-filter{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
}

.spinwizard-offers .sw-filter-btn{
  width:100%;
}

}

/* Force casino link styling (wins against theme defaults) */
.spinwizard-offers p.offer-tagline a,
.spinwizard-offers .offer-tagline a:link,
.spinwizard-offers .offer-tagline a:visited{
  color: #9ca3af !important;
  text-decoration: none !important;
}

.spinwizard-offers .offer-tagline a:hover,
.spinwizard-offers .offer-tagline a:focus{
  color: #1a8acc !important;
  text-decoration: none !important;
}

/* Casino name link inside offer cards */
.spinwizard-offers .offer-tagline a{
  color: #9ca3af;          /* same muted grey you already use */
  text-decoration: none;  /* remove underline */
  font-weight: 600;
  transition: color .15s ease;
}

/* Optional hover effect */
.spinwizard-offers .offer-tagline a:hover{
  color: #1a8acc;          /* SpinWizard blue on hover */
  text-decoration: none;  /* keep underline off */
}
/* Override browser/theme link styles for casino name */
.spinwizard-offers .offer-tagline a,
.spinwizard-offers .offer-tagline a:link,
.spinwizard-offers .offer-tagline a:visited {
  color: #9ca3af !important;
  text-decoration: none !important;
  text-decoration-style: none !important;
}

/* Hover / focus */
.spinwizard-offers .offer-tagline a:hover,
.spinwizard-offers .offer-tagline a:focus {
  color: #1a8acc !important;
  text-decoration: none !important;
}
/* Kill underline + purple at the SOURCE (the parent), then restyle the link */
.spinwizard-offers .offer-tagline{
  color: #9ca3af !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-style: solid !important;
}

/* Also force ALL descendants to not be underlined */
.spinwizard-offers .offer-tagline,
.spinwizard-offers .offer-tagline *{
  text-decoration: none !important;
  text-decoration-line: none !important;
}

/* Now explicitly set link colours for all states */
.spinwizard-offers .offer-tagline a:link,
.spinwizard-offers .offer-tagline a:visited{
  color: #9ca3af !important;
}

.spinwizard-offers .offer-tagline a:hover,
.spinwizard-offers .offer-tagline a:focus{
  color: #1a8acc !important;
}
/* Reduce vertical spacing around the CTA button */
.spinwizard-offers .offer-cta {
  margin-top: 0px !important;   /* space above button */
}

.spinwizard-offers .offer-button {
  margin: 0 !important;          /* remove extra margins */
  padding: 7px 35px !important; /* slightly tighter button */
}
@media (max-width:640px){

.spinwizard-offers .offer-header{
  flex-direction:row !important;
  align-items:center;
  justify-content:space-between;
}

.spinwizard-offers .offer-main{
  text-align:left;
  flex:1;
}

.spinwizard-offers .offer-logo img{
  max-height:50px !important;
}

.spinwizard-offers .offer-headline{
  font-size:1.2rem !important;
}

.spinwizard-offers .offer-button{
  white-space:nowrap;
  padding:5px 25px !important;
  font-size:.85rem !important;
}

}
@media (max-width:640px){

.spinwizard-offers{
  padding-left:4px;
  padding-right:4px;
}

.spinwizard-offers .free-spins-list{
  gap:12px !important;
}

}
@media (max-width: 768px){
  .offer-terms{
    margin-top: 2px !important;
  }
}
@media (max-width:640px){
  .spinwizard-offers .offer-tagline{
    display:none !important;
  }
}
@media (max-width:640px){

.spinwizard-offers .offer-header{
    display:grid !important;
    grid-template-columns:70px 1fr;
    grid-template-areas:
        "logo text"
        "logo button";
    gap:8px 10px;
    align-items:start;
}

.spinwizard-offers .offer-logo{
    grid-area:logo;
}

.spinwizard-offers .offer-main{
    grid-area:text;
    text-align:left !important;
}

.spinwizard-offers .offer-cta{
    grid-area:button;
    margin-top:4px !important;
        margin-bottom:10px !important;
    text-align:left !important;
}

.spinwizard-offers .offer-button{
    width:auto;
}

}
@media (max-width:640px){

.spinwizard-offers .offer-header{
    display:grid !important;
    grid-template-columns:70px 1fr;
    grid-template-areas:
        "logo text"
        "logo button";
    gap:8px 10px;
    align-items:start;
}

/* grid areas */
.spinwizard-offers .offer-logo{ grid-area:logo; }

.spinwizard-offers .offer-main{
    grid-area:text;
    text-align:left !important;
}

/* move button under subheadline and align left */
.spinwizard-offers .offer-cta{
    grid-area:button;
    margin-top:4px !important;
    text-align:left !important;
    justify-self:start !important;
}

/* prevent centering */
.spinwizard-offers .offer-button{
    display:inline-flex !important;
    width:auto !important;
    margin-left:0 !important;
}

}
@media (max-width:640px){

.spinwizard-offers .offer-logo img{
  max-height:72px !important;   /* increase logo size */
}

.spinwizard-offers .offer-logo{
  flex:0 0 80px;                /* give the logo column more width */
}

}
@media (max-width:640px){
.spinwizard-offers .offer-smallprint{
  margin-left: -78px;
  width: calc(100% + 78px);
}
}
@media (max-width:640px){

  .spinwizard-offers .offer-logo{
    align-self:flex-start !important;
  }

}
/* Style Unhide Offers button like filter buttons */
.spinwizard-offers .sw-unhide-offers{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;

  padding:10px 18px;
  border-radius:10px;

  border:1px solid #d1d5db;
  background:#ffffff;

  font-size:.85rem;
  font-weight:600;
  color:#374151;

  cursor:pointer;

  transition:all .15s ease;
}

/* hover */
.spinwizard-offers .sw-unhide-offers:hover{
  background:#f1f5f9;
}
@media (max-width:640px){

.spinwizard-offers .spinwizard-filter{
display:grid !important;
grid-template-columns:repeat(2,1fr);
gap:8px;
overflow:visible !important;
}

.spinwizard-offers .sw-filter-btn{
width:100%;
justify-content:center;
white-space:normal;
}

}
/* T&Cs container */
.spinwizard-offers .offer-smallprint{
  position:relative;
  padding-right:18px; /* ðŸ‘ˆ creates space for arrow */
}

/* Arrow indicator */
.spinwizard-offers .offer-smallprint::after{
content:"▾";
  position:absolute;
  right:4px;
  top:60%;
  transform:translateY(-50%);

  font-size:20px;
  font-weight:700;
  color:#6b7280;

  pointer-events:none;
}
@media (max-width:640px){
/* Arrow indicator */
.spinwizard-offers .offer-smallprint::after{
content:"▾";
  position:absolute;
  right:20px;
  top:60%;
  transform:translateY(-50%);

  font-size:20px;
  font-weight:700;
  color:#6b7280;

  pointer-events:none;
}
.spinwizard-offers .spinwizard-filter{
display:grid !important;
grid-template-columns:1fr 1fr !important;
gap:8px;
overflow:visible !important;
}

/* Apply to BOTH buttons and links */
.spinwizard-offers .spinwizard-filter .sw-filter-btn,
.spinwizard-offers .spinwizard-filter a{
display:flex !important;
align-items:center;
justify-content:center;
width:100% !important;
box-sizing:border-box;
white-space:nowrap;
}

}
.spinwizard-offers .spinwizard-filter a,
.spinwizard-offers .spinwizard-filter a:link,
.spinwizard-offers .spinwizard-filter a:visited,
.spinwizard-offers .spinwizard-filter a:hover{
text-decoration:none !important;
}
.offer-cta{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sw-social-proof{
  width:100%;
  text-align:center;
  margin:12px 0 4px;
  font-size:14px;
  color:#ef4444 !important;
  font-weight:700;
  opacity:.9;
}

@media (max-width: 640px){

  .offer-header{
    display:flex;
    flex-direction:column;   /* 🔥 BREAKS the 2-column layout */
    align-items:center;
    text-align:center;
  }

  .offer-logo{
    margin-bottom:10px;
  }

  .offer-main{
    width:100%;
  }

  .offer-cta{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
  }

  .sw-social-proof{
    width:100%;
    text-align:center;
    margin-top:6px;
    margin-left:-40px;
      font-size:11px;
  }

  .offer-smallprint{
    width:100%;
    text-align:left; /* keeps T&Cs readable */
  }
.spinwizard-offers .offer-subheadline {
  padding: 5px 0;
	text-align: left !important;
}
}

}