/* casinos.css — the casino directory's pages (r418).
   The page around them — the top bar, the newsletter, the footer, the colours and fonts on :root — is the site's own
   (the shell is cut from privacy.html and loads privacy.css first); this file only draws what is inside <main class=cd>.
   Every colour falls back to the site's value in case :root is ever missing. */

.cd{display:block;min-height:60vh}
.cd-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

/* the band at the top, as the site's other pages draw theirs */
.cd-hero{background:radial-gradient(ellipse at top left,rgba(67,160,71,.15) 0,transparent 55%),radial-gradient(ellipse at bottom right,rgba(240,201,106,.10) 0,transparent 55%),var(--green-felt,#0f2410);color:var(--cream,#fffef9);padding:2.4rem 1.25rem 2.4rem;text-align:center}
.cd-hero-in{max-width:880px;margin:0 auto}
.cd-crumbs{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:.15rem 0;font-size:13px;line-height:1.5;color:rgba(255,255,255,.6);margin-bottom:1.1rem}
.cd-crumbs a{color:rgba(255,255,255,.85);text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:3px}
.cd-crumbs a:hover{color:var(--gold,#f0c96a)}
.cd-sep{margin:0 .5rem;color:rgba(255,255,255,.35)}
.cd-hero .eyebrow{display:inline-block;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--gold,#f0c96a);font-weight:600;margin-bottom:.6rem}
.cd-hero h1{font-family:var(--font-display,'Playfair Display',Georgia,serif);font-size:clamp(32px,5vw,54px);font-weight:700;color:var(--cream,#fffef9);letter-spacing:-.01em;line-height:1.08;overflow-wrap:anywhere}
.cd-hero h1 em{color:var(--green-light,#81c784);font-style:italic}
.cd-sub{font-size:15px;line-height:1.6;color:rgba(255,255,255,.74);max-width:680px;margin:.9rem auto 0}
.cd-local{font-size:17px;color:rgba(255,255,255,.82);margin-top:.45rem}
.cd-closed{display:inline-block;margin-top:1rem;padding:.35rem .95rem;border-radius:30px;background:#b23b2e;color:#fff;font-size:14px;font-weight:700}
.cd-glance{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem;margin:1.2rem auto 0;padding:0;max-width:760px}
.cd-glance li{font-size:13.5px;font-weight:600;line-height:1.5;color:var(--cream,#fffef9);background:rgba(255,255,255,.09);border:1px solid rgba(240,201,106,.35);border-radius:30px;padding:.25rem .8rem}

/* the search box */
.cd-search{display:flex;gap:.5rem;max-width:560px;margin:1.5rem auto 0}
.cd-search input{flex:1;min-width:0;font:inherit;font-size:16px;line-height:1.3;padding:.75rem 1.1rem;border:1px solid rgba(255,255,255,.25);border-radius:30px;background:#fff;color:var(--text-dark,#1a2e1a)}
.cd-search input:focus{outline:3px solid rgba(240,201,106,.6);outline-offset:1px}
.cd-search button{font:inherit;font-size:15px;font-weight:700;padding:.75rem 1.4rem;border:0;border-radius:30px;background:var(--gold,#f0c96a);color:var(--green-dark,#1a2e1a);cursor:pointer}
.cd-search button:hover,.cd-search button:focus-visible{background:#f6d88a}

/* the cards below it */
.cd-wrap{max-width:1100px;margin:0 auto;padding:2rem 1.25rem 3.5rem}
.cd-wrap a{color:var(--green-mid,#2e7d32);text-decoration:underline;text-decoration-color:rgba(46,125,50,.35);text-underline-offset:3px}
.cd-wrap a:hover{color:var(--green-dark,#1a2e1a);text-decoration-color:currentColor}
.cd-card{background:var(--white,#fff);border:1px solid var(--border,#c8dfc8);border-radius:var(--radius,10px);padding:1.4rem 1.5rem;margin-bottom:1.25rem;box-shadow:0 1px 2px rgba(26,46,26,.05)}
.cd-card h2{font-family:var(--font-display,'Playfair Display',Georgia,serif);font-size:23px;line-height:1.25;font-weight:700;color:var(--green-dark,#1a2e1a);padding-bottom:.5rem;margin-bottom:.9rem;border-bottom:2px solid var(--green-pale,#e8f5e9)}
.cd-card h3{font-family:var(--font-display,'Playfair Display',Georgia,serif);font-size:18px;line-height:1.3;font-weight:700;color:var(--green-dark,#1a2e1a);margin-bottom:.35rem}
.cd-card p{color:var(--text-dark,#1a2e1a)}
.cd-n{display:inline-block;font-family:var(--font-body,'DM Sans',system-ui,sans-serif);font-size:12px;font-weight:600;line-height:1.6;color:var(--text-mid,#4a6a4a);background:var(--green-pale,#e8f5e9);border-radius:30px;padding:0 .55rem;margin-left:.3rem;vertical-align:middle;white-space:nowrap}
.cd-note{font-size:13.5px;color:var(--text-mid,#4a6a4a);margin-top:.6rem}
.cd-lead{margin:-.35rem 0 .5rem}

/* countries and regions */
.cd-grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.5rem;margin:0;padding:0}
.cd-wrap .cd-grid a{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.6rem .8rem;border:1px solid var(--border,#c8dfc8);border-radius:8px;background:var(--green-bg,#f4faf4);color:var(--text-dark,#1a2e1a);text-decoration:none;line-height:1.35}
.cd-wrap .cd-grid a:hover{border-color:var(--green-bright,#43a047);background:#fff}
.cd-grid .cd-name{font-weight:600;overflow-wrap:anywhere}
.cd-cont+.cd-cont{margin-top:1.5rem}
.cd-cont h3{margin-bottom:.6rem}
.cd-top{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem;margin:0;padding:0}
.cd-wrap .cd-top a{display:block;text-align:center;padding:1rem .6rem;border-radius:10px;background:var(--green-felt,#0f2410);color:var(--cream,#fffef9);text-decoration:none}
.cd-wrap .cd-top a:hover{background:var(--green-dark,#1a2e1a)}
.cd-big{display:block;font-family:var(--font-display,'Playfair Display',Georgia,serif);font-size:30px;line-height:1.1;color:var(--gold,#f0c96a)}
.cd-top .cd-name{display:block;font-size:14px;color:rgba(255,255,255,.88);margin-top:.25rem}

/* casinos in a list */
.cd-list{list-style:none;margin:0;padding:0}
.cd-item{padding:.7rem 0;border-bottom:1px solid var(--green-pale,#e8f5e9)}
.cd-item:last-child{border-bottom:0}
.cd-wrap .cd-item>a{font-weight:700;font-size:16px;color:var(--green-dark,#1a2e1a);text-decoration:none}
.cd-wrap .cd-item>a:hover{text-decoration:underline}
.cd-list>li:not(.cd-item){padding:.45rem 0}
.cd-kind{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.02em;line-height:1.6;padding:0 .5rem;margin-left:.35rem;border-radius:30px;background:#fff6dc;color:#8a6a10;vertical-align:middle}
.cd-closed-tag{background:#fbe9e7;color:#b23b2e}
.cd-where{font-size:14px;color:var(--text-mid,#4a6a4a);margin-top:.1rem}
.cd-hl{font-size:13.5px;font-weight:600;color:var(--green-mid,#2e7d32);margin-top:.15rem}
/* cas-r425: a casino with no page of its own yet — its name, and a link to its own website */
.cd-wrap .cd-item>.cd-nm{font-weight:700;font-size:16px;color:var(--green-dark,#1a2e1a)}
.cd-near .cd-nm{font-weight:600;color:var(--text-dark,#1a2e1a)}
.cd-site{font-size:13.5px;margin-top:.15rem}
.cd-near .cd-site{margin-left:.35rem}
.cd-wrap .cd-site a{font-weight:600;color:var(--green-mid,#2e7d32);text-decoration:none;overflow-wrap:anywhere}
.cd-wrap .cd-site a::after{content:" \2197";font-weight:400}
.cd-wrap .cd-site a:hover{text-decoration:underline}
.cd-city+.cd-city{margin-top:1.2rem}
@media (min-width:760px){.cd-city .cd-list,.cd-card>.cd-list{columns:2 320px;column-gap:2.4rem}.cd-item{break-inside:avoid}}
.cd-city{scroll-margin-top:90px}
.cd-jump{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:1.2rem}
.cd-wrap .cd-jump a{font-size:13px;line-height:1.5;padding:.2rem .65rem;border-radius:30px;background:var(--green-pale,#e8f5e9);color:var(--green-dark,#1a2e1a);text-decoration:none}
.cd-wrap .cd-jump a:hover{background:#d4ecd5}

/* one casino: Visit beside the rest on a wide screen, first on a narrow one */
.cd-cols{display:block}
@media (min-width:900px){.cd-cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1.25rem;align-items:start}.cd-side{grid-column:2;grid-row:1}.cd-main{grid-column:1;grid-row:1}}
.cd-from{font-size:13px;color:var(--text-mid,#4a6a4a);margin-top:.6rem}
.cd-wrap .cd-from a{color:var(--text-mid,#4a6a4a)}
.cd-facts{list-style:none;margin:0;padding:0}
.cd-facts li{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.2rem .9rem;padding:.55rem 0;border-bottom:1px solid var(--green-pale,#e8f5e9)}
.cd-facts li:last-child{border-bottom:0}
.cd-fact{font-weight:600;font-size:16px;color:var(--text-dark,#1a2e1a)}
.cd-wrap a.cd-src{font-size:12.5px;color:var(--text-mid,#4a6a4a);text-decoration:none;white-space:nowrap}
.cd-wrap a.cd-src:hover{text-decoration:underline}
.cd-why{margin-top:.75rem}
.cd-why summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--green-mid,#2e7d32)}
.cd-why ul{list-style:none;margin:.6rem 0 0;padding:0}
.cd-why li{font-size:14px;line-height:1.55;color:var(--text-mid,#4a6a4a);padding:.45rem .75rem;margin-bottom:.4rem;border-left:3px solid var(--gold,#f0c96a);background:#fffdf4;border-radius:0 6px 6px 0}
.cd-why q{font-style:italic;color:var(--text-dark,#1a2e1a)}
.cd-chips{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0}
.cd-wrap .cd-chips a{display:inline-block;font-size:14px;font-weight:600;line-height:1.5;padding:.3rem .8rem;border-radius:30px;background:var(--green-pale,#e8f5e9);color:var(--green-dark,#1a2e1a);text-decoration:none}
.cd-wrap .cd-chips a:hover{background:#d4ecd5}
.cd-visit dl{display:grid;grid-template-columns:max-content 1fr;gap:.55rem 1.4rem;margin:0}
.cd-visit dt{font-size:14px;font-weight:700;color:var(--text-mid,#4a6a4a)}
.cd-visit dd{margin:0;overflow-wrap:anywhere}
.cd-near,.cd-changes{list-style:none;margin:0;padding:0}
.cd-near li,.cd-changes li{padding:.45rem 0;border-bottom:1px solid var(--green-pale,#e8f5e9)}
.cd-near li:last-child,.cd-changes li:last-child{border-bottom:0}
.cd-when{font-size:12.5px;font-weight:700;color:var(--text-mid,#4a6a4a);margin-right:.4rem;white-space:nowrap}
.cd-empty p{color:var(--text-mid,#4a6a4a)}
.cd-report{background:#fffdf4;border-color:#ecdca8}
.cd-attrib{font-size:12.5px;line-height:1.6;color:var(--text-mid,#4a6a4a);margin:1.4rem .25rem 0}

/* the about page */
.cd-prose p{margin:.6rem 0;line-height:1.7}
.cd-prose code{font-size:.92em;background:var(--green-pale,#e8f5e9);padding:.05rem .35rem;border-radius:4px}
.cd-pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;line-height:1.5;background:var(--green-dark,#1a2e1a);color:#e8f5e9;padding:.9rem 1rem;border-radius:8px;overflow-x:auto;margin:.6rem 0}

@media (max-width:640px){
  .cd-hero{padding:1.9rem 1rem 1.9rem}
  .cd-wrap{padding:1.3rem .85rem 2.5rem}
  .cd-card{padding:1.1rem 1rem}
  .cd-card h2{font-size:21px}
  .cd-search button{padding:.75rem 1.05rem}
  .cd-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .cd-visit dl{grid-template-columns:1fr;gap:.1rem}
  .cd-visit dt{margin-top:.6rem}
  .cd-visit dt:first-child{margin-top:0}
  .cd-facts li{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:no-preference){
  .cd-wrap .cd-grid a,.cd-wrap .cd-top a{transition:border-color .15s,background-color .15s}
}

/* cas-r428 — the world page, rebuilt to be followed top to bottom (Lucky: "some listed to the right and some listed in the
   middle of the page… plain boring and hard to follow"). */
/* a flag, cut out of one picture of them all: its column and row come on the element (--fx, --fy), see cas_flag().
   The flags are flag-icons 7.5.0 (c) 2013 Panayiotis Lipiridis, MIT licence — github.com/lipis/flag-icons */
.cd-flag{--fw:20px;--fh:15px;display:inline-block;flex:none;width:var(--fw);height:var(--fh);background:url(/images/casino-flags.webp?v=1) no-repeat;background-size:calc(16*var(--fw)) calc(16*var(--fh));background-position:calc(var(--fx,0)*-1*var(--fw)) calc(var(--fy,0)*-1*var(--fh));border-radius:2px;box-shadow:0 0 0 1px rgba(26,46,26,.14);vertical-align:-2px}
.cd-flag-lg{--fw:36px;--fh:27px;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 2px 6px rgba(0,0,0,.35)}
/* the parts of the world: a row of links at the top of the countries, left to right like a line of text */
.cd-conts{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.3rem}
.cd-wrap .cd-conts a{display:inline-flex;align-items:baseline;gap:.4rem;padding:.36rem .78rem;border-radius:30px;background:var(--green-felt,#0f2410);border:1px solid var(--green-felt,#0f2410);color:var(--cream,#fffef9);font-size:13.5px;font-weight:600;line-height:1.3;text-decoration:none}
.cd-conts a span{color:var(--gold,#f0c96a);font-size:13px;font-weight:700}
.cd-wrap .cd-conts a:hover,.cd-wrap .cd-conts a:focus-visible{background:var(--green-dark,#1a2e1a);color:var(--cream,#fffef9)}
/* the countries with the most casinos: always full rows — four across, two on a phone */
.cd-top{grid-template-columns:repeat(4,minmax(0,1fr))}
.cd-wrap .cd-top a{padding:1.05rem .6rem .95rem}
.cd-top .cd-flag{display:block;margin:0 auto .55rem}
/* every country: each part of the world under its own heading, its countries in columns read down */
.cd-countries .cd-lead{margin-bottom:.9rem}
.cd-cont{scroll-margin-top:96px}
.cd-cont+.cd-cont{margin-top:1.6rem}
.cd-card .cd-cont h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .75rem;margin:0 0 .5rem;padding:.5rem .9rem;border-left:4px solid var(--gold,#f0c96a);border-radius:0 8px 8px 0;background:linear-gradient(90deg,var(--green-pale,#e8f5e9),rgba(232,245,233,0))}
.cd-cn{font-size:20px}
.cd-ct{font-family:var(--font-body,'DM Sans',system-ui,sans-serif);font-size:13.5px;font-weight:600;color:var(--text-mid,#4a6a4a)}
.cd-index{list-style:none;margin:0;padding:0 .2rem;columns:4 200px;column-gap:1.8rem}
.cd-index li{break-inside:avoid}
.cd-wrap .cd-index a{display:flex;align-items:center;gap:.6rem;padding:.5rem .35rem;border-bottom:1px solid var(--green-pale,#e8f5e9);color:var(--text-dark,#1a2e1a);font-size:15px;font-weight:600;line-height:1.35;text-decoration:none}
.cd-wrap .cd-index a:hover{background:var(--green-bg,#f4faf4)}
.cd-wrap .cd-index a:hover .cd-name{text-decoration:underline;text-decoration-color:rgba(46,125,50,.45);text-underline-offset:3px}
.cd-index .cd-name{min-width:0;overflow-wrap:break-word}
.cd-index .cd-n{margin-left:0;flex:none}
@media (max-width:640px){
  .cd-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
  .cd-wrap .cd-top a{padding:.75rem .5rem .7rem}
  .cd-top .cd-big{font-size:26px}
  .cd-top .cd-flag-lg{--fw:28px;--fh:21px;margin-bottom:.4rem}
  .cd-index{columns:2 130px;column-gap:.9rem;padding:0}
  .cd-wrap .cd-index a{font-size:14px;gap:.45rem;padding:.5rem .2rem}
  .cd-index .cd-n{background:none;padding:0;font-size:12px;color:var(--text-mid,#4a6a4a)}
  .cd-wrap .cd-conts a{font-size:13px;padding:.32rem .7rem}
  .cd-card .cd-cont h3{padding:.45rem .7rem}
  .cd-cn{font-size:18px}
}
@media (prefers-reduced-motion:no-preference){
  .cd-wrap .cd-index a,.cd-conts a{transition:background-color .15s,border-color .15s}
}
