/* ==========================================================================
   Les Alcyonides — legacy content shim
   Restyles the original (dark) content components for the new light
   SuperCity-style template. Loaded AFTER Tailwind on inner pages so these
   plain-CSS rules win for legacy class names. The homepage does not load it.
   Palette: brand #047857 · ink #0f172a..#f8fafc · gold #f59e0b · red #dc2626
   ========================================================================== */

/* ---- layout ---- */
.section{padding:2.5rem 0;}
.section.section-alt{background:#f8fafc;}
.container{max-width:72rem;margin:0 auto;padding:0 1rem;}
.container-narrow{max-width:52rem;margin:0 auto;padding:0 1rem;}
.section-header{text-align:center;max-width:48rem;margin:0 auto 2rem;}
.section-header h2{margin:.25em 0 .4em;}
.section-header p{color:#475569;}
.section-tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#047857;background:#ecfdf5;border:1px solid #a7f3d0;padding:4px 12px;border-radius:999px;margin-bottom:.75rem;}

/* ---- typography inside content ---- */
.section h2,.content-body h2,.container>h2{color:#0f172a;margin:1.4em 0 .5em;}
.section h3,.content-body h3,.container>h3{color:#0f172a;font-weight:600;margin:1.3em 0 .4em;}
.section h4,.content-body h4{color:#0f172a;font-weight:600;margin:1.1em 0 .35em;}
.section p,.content-body p,.container-narrow p,.container>p{color:#334155;line-height:1.7;margin:0 0 1em;}
.section ul,.section ol,.content-body ul,.content-body ol,.container-narrow ul,.container-narrow ol{color:#334155;line-height:1.7;margin:0 0 1.1em;padding-left:1.3em;}
.section li,.content-body li,.container-narrow li{margin:.3em 0;}
.section a,.content-body a,.container-narrow a{color:#047857;}
.section strong,.content-body strong,.container-narrow strong,.info-box strong,.affiliate-disclosure strong{color:#0f172a;}
.content-body{max-width:48rem;margin:0 auto;}
.gradient-text{color:#f59e0b;}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:'Plus Jakarta Sans',Inter,sans-serif;font-weight:600;font-size:.95rem;padding:.7rem 1.25rem;border-radius:.5rem;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:all .15s;}
.btn-primary{align-items:center;justify-content:center;gap:.5rem;border-radius:.375rem;background:#dc2626;color:#fff;font-family:'Plus Jakarta Sans',Inter,sans-serif;font-weight:600;font-size:.95rem;padding:.625rem 1.25rem;text-decoration:none;transition:background .15s;box-shadow:0 1px 3px rgba(15,23,42,.09),0 1px 2px rgba(15,23,42,.06);}
.btn-primary:hover{background:#b91c1c;color:#fff;text-decoration:none;}
.btn-secondary{background:#047857;color:#fff;}
.btn-secondary:hover{background:#065f46;color:#fff;text-decoration:none;}
.btn-outline{background:#fff;color:#0f172a;border-color:#cbd5e1;}
.btn-outline:hover{border-color:#047857;color:#047857;text-decoration:none;}
.btn-sm{padding:.5rem .9rem;font-size:.85rem;}
.btn-lg{padding:.9rem 1.6rem;font-size:1.05rem;}

/* ---- grids & feature cards ---- */
.grid{display:grid;gap:1.25rem;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
@media(max-width:900px){.grid-3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.grid-2,.grid-3{grid-template-columns:1fr;}}
.feature-card{background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:1.25rem;box-shadow:0 1px 3px rgba(15,23,42,.06);}
.feature-card h3,.feature-card h4{margin:.15em 0 .4em;color:#0f172a;}
.feature-card p{color:#475569;margin:0;}
.feature-card-icon{font-size:1.8rem;margin-bottom:.4rem;}

/* ---- info / callout boxes ---- */
.info-box{background:#ecfdf5;border:1px solid #a7f3d0;border-left:4px solid #047857;border-radius:.5rem;padding:1rem 1.25rem;margin:1.5rem 0;}
.info-box.warning{background:#fffbeb;border-color:#fde68a;border-left-color:#f59e0b;}
.info-box-title{font-weight:700;color:#0f172a;margin-bottom:.35rem;}
.info-box p{margin:0;color:#334155;}
.affiliate-disclosure{background:#fffbeb;border:1px solid #fde68a;border-left:3px solid #f59e0b;border-radius:.5rem;padding:1rem 1.25rem;margin:1.5rem 0;color:#475569;font-size:.92rem;}
.affiliate-disclosure a{color:#047857;}

/* ---- methodology steps ---- */
.methodology-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem;margin:1.5rem 0;}
.methodology-step{background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:1.1rem;text-align:center;box-shadow:0 1px 3px rgba(15,23,42,.06);}
.methodology-step-number{width:2.2rem;height:2.2rem;border-radius:999px;background:#dc2626;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;margin:0 auto .6rem;}
.methodology-step h4{margin:.15em 0 .3em;color:#0f172a;}
.methodology-step p{color:#475569;font-size:.9rem;margin:0;}

/* ---- tables ---- */
.table-responsive,.table-wrapper{overflow-x:auto;margin:1.5rem 0;}
.section table,.container table,.content-body table{width:100%;border-collapse:collapse;font-size:.92rem;background:#fff;border:1px solid #e2e8f0;border-radius:.5rem;overflow:hidden;}
.section th,.section td,.container th,.container td,.content-body th,.content-body td{padding:.7rem .9rem;text-align:left;border-bottom:1px solid #e2e8f0;color:#334155;}
.section thead th,.container thead th,.content-body thead th{background:#ecfdf5;color:#065f46;font-weight:700;}
.section tbody tr:nth-child(even),.container tbody tr:nth-child(even){background:#f8fafc;}

/* ---- game cards ---- */
.game-card{display:block;background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;overflow:hidden;text-decoration:none;box-shadow:0 1px 3px rgba(15,23,42,.06);transition:box-shadow .15s,transform .15s;}
.game-card:hover{box-shadow:0 12px 30px -12px rgba(15,23,42,.25);transform:translateY(-2px);}
.game-card-image{height:120px;display:flex;align-items:center;justify-content:center;font-size:2.4rem;color:#fff;}
.game-card-body{padding:1rem 1.1rem;}
.game-card-body h3{margin:0 0 .3em;color:#0f172a;}
.game-card-body p{color:#475569;font-size:.9rem;margin:0 0 .6rem;}

/* ---- FAQ accordion (main.js toggles .faq-item.active) ---- */
.faq-section{max-width:52rem;margin:0 auto;}
.faq-item{background:#fff;border:1px solid #e2e8f0;border-radius:.6rem;margin-bottom:.6rem;overflow:hidden;}
.faq-question{width:100%;text-align:left;background:none;border:0;padding:1rem 1.2rem;font-weight:600;color:#0f172a;font-size:1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;cursor:pointer;font-family:inherit;}
.faq-toggle{color:#dc2626;font-size:1.35rem;line-height:1;flex-shrink:0;transition:transform .2s;}
.faq-item.active .faq-toggle{transform:rotate(45deg);}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.faq-item.active .faq-answer{max-height:900px;}
.faq-answer-inner{padding:0 1.2rem 1.1rem;color:#334155;}
.faq-answer-inner p{margin:0;color:#334155;}

/* ---- author box ---- */
.author-box{display:flex;gap:1rem;align-items:flex-start;background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:1.2rem;margin:1rem 0;box-shadow:0 1px 3px rgba(15,23,42,.06);}
.author-info h4{margin:0 0 .2em;color:#0f172a;}
.author-info h4 a{color:#0f172a;}
.author-title{color:#047857;font-weight:600;font-size:.9rem;margin-bottom:.4rem;}
.author-info p{color:#475569;margin:0;font-size:.92rem;}

/* ---- responsible gambling ---- */
.responsible-gambling{background:#fef2f2;border:1px solid #fecaca;border-radius:.75rem;padding:1.2rem 1.4rem;margin:1rem 0;}
.responsible-gambling p{color:#7f1d1d;margin:0;}
.responsible-gambling a{color:#b91c1c;font-weight:600;}
.age-badge,.gc-18{display:inline-block;background:#dc2626;color:#fff;font-weight:700;font-size:.72rem;padding:2px 8px;border-radius:6px;}

/* ---- misc content bits ---- */
.last-updated{display:inline-flex;align-items:center;gap:.5rem;color:#64748b;font-size:.85rem;}
.last-updated .dot{width:.55rem;height:.55rem;border-radius:999px;background:#10b981;display:inline-block;}
.breadcrumb{font-size:.85rem;color:#64748b;margin-bottom:1rem;}
.breadcrumb a{color:#047857;}
.breadcrumb .separator{margin:0 .4rem;color:#cbd5e1;}
.breadcrumb .current{color:#0f172a;}

/* ---- badges & stars ---- */
.badge{display:inline-block;font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:999px;background:#f1f5f9;color:#334155;}
.badge-gold{background:#fef3c7;color:#92400e;}
.badge-blue{background:#dbeafe;color:#1e40af;}
.badge-green{background:#dcfce7;color:#166534;}
.badge-red{background:#fee2e2;color:#991b1b;}
.stars{display:inline-flex;gap:1px;color:#f59e0b;font-size:1rem;line-height:1;}
.stars .star{color:#f59e0b;}
.stars .star.empty{color:#e2e8f0;}

/* ---- rating bars (review pages) ---- */
.rating-bar{display:grid;grid-template-columns:150px 1fr 44px;gap:.7rem;align-items:center;margin:.45rem 0;}
.rating-bar-label{font-size:.85rem;color:#475569;}
.rating-bar-track{height:.5rem;background:#e2e8f0;border-radius:999px;overflow:hidden;}
.rating-bar-fill{height:100%;background:#047857;border-radius:999px;}
.rating-bar-value{font-weight:700;color:#0f172a;font-size:.85rem;text-align:right;}
@media(max-width:560px){.rating-bar{grid-template-columns:110px 1fr 40px;}}

/* ---- pros / cons ---- */
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0;}
@media(max-width:640px){.pros-cons{grid-template-columns:1fr;}}
.pros-list,.cons-list{background:#fff;border:1px solid #e2e8f0;border-radius:.6rem;padding:1rem 1.2rem 1rem 2rem;list-style:disc;}
.pros-list li{color:#334155;margin:.3rem 0;}
.cons-list li{color:#334155;margin:.3rem 0;}

/* ---- affiliate toplist (casino-list-item) ---- */
.casino-list-item{display:grid;grid-template-columns:48px 1.5fr 1.3fr 96px 150px;gap:1rem;align-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:1rem 1.2rem;margin-bottom:.85rem;box-shadow:0 1px 3px rgba(15,23,42,.06);}
.list-rank{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:1.9rem;font-weight:700;color:#f59e0b;text-align:center;line-height:1;}
.list-casino{display:flex;gap:.8rem;align-items:center;min-width:0;}
.list-casino-name{font-weight:700;color:#0f172a;}
.list-casino-sub{font-size:.82rem;color:#64748b;}
.list-bonus{border-left:4px solid #fbbf24;padding-left:.9rem;}
.list-bonus-value{font-family:'Playfair Display',Georgia,serif;font-weight:700;color:#0f172a;font-size:1.08rem;line-height:1.3;}
.list-bonus-label{font-size:.82rem;color:#64748b;margin-top:.15rem;}
.list-rating{text-align:center;}
.list-score{font-weight:800;color:#0f172a;font-size:1.1rem;}
.casino-list-item>a.btn{grid-column:5;}
.casino-mini-review{grid-column:1 / -1;color:#475569 !important;font-size:.9rem;line-height:1.55;margin-top:.2rem;}
/* Mobile: stack into a card matching the homepage rows */
@media(max-width:820px){
  .casino-list-item{grid-template-columns:1fr;gap:.85rem;text-align:center;padding:1.35rem 1.25rem;}
  .list-rank{text-align:left;font-size:2.5rem;}
  .list-rank::before{content:"#\00a0";font-size:1.5rem;vertical-align:12%;color:#fbbf24;}
  .list-casino{flex-direction:column;align-items:center;gap:.55rem;}
  .casino-list-item .list-casino-logo{width:170px !important;height:100px !important;padding:12px !important;border-color:#e2e8f0 !important;}
  .list-casino-name{font-size:1.05rem;}
  .list-bonus{text-align:left;}
  .list-bonus-value{font-size:1.2rem;}
  .stars,.list-rating,.casino-mini-review{display:none !important;}
  .casino-list-item>a.btn{grid-column:auto;width:100%;font-size:1.02rem;padding:.9rem 1rem;}
}

/* ---- toplist description toggle: always show full copy ---- */
.toplist-desc-toggle,.toplist-desc-summary{display:none !important;}
.toplist-desc-wrap{display:block !important;max-width:52rem;margin:0 auto;}
.toplist-lead{color:#475569;}
.toplist-h2{color:#0f172a;}

/* ---- scroll-to-top button ---- */
.scroll-top{position:fixed;bottom:1.2rem;right:1.2rem;width:2.6rem;height:2.6rem;border-radius:999px;background:#047857;color:#fff;border:0;font-size:1.1rem;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .2s;z-index:50;box-shadow:0 6px 18px rgba(15,23,42,.25);}
.scroll-top.visible{opacity:1;pointer-events:auto;}
