﻿/* Menu-only responsive sizing; loaded after the legacy styles.
   2026-10-18 hotfix: side tooltips are positioned by the small script in Menu.aspx.
   The original grid popup stays hidden; one fixed clone is shown beside the image.
   Keep existing layout, backgrounds and responsive column counts unchanged. */
html, body { margin:0; width:100%; min-width:0; }
#header, #header > center > table { min-height:0; width:100%; max-width:100%; }
#header .ghTopMenuRow { display:grid; width:100%; max-width:100%; grid-template-columns:210px minmax(0,1fr); direction:ltr; align-items:start; gap:8px; padding:4px 12px; }
#header .ghTopSpacerCell { display:none; }
#header .ghTopMenuCell, #header .ghTopSearchCell { display:block; width:auto; min-width:0; height:auto !important; min-height:0 !important; }
#header #updMenuBarGames { min-height:0 !important; padding-bottom:4px !important; margin-bottom:0 !important; }
#header #updMenuBarGames table { width:100% !important; max-width:100%; min-width:0 !important; table-layout:fixed; }
#header #updMenuBarGames td { min-width:0 !important; }
#header #updMenuBarGames img { max-width:100%; height:auto; }
#header #updSearchControl { height:auto; min-height:0; }
.ghSearchControl { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px; }
.ghSearchControl input { min-width:0; max-width:100%; }
.ghSearchControl input[type="text"], .ghSearchControl input[type="search"] { width:170px; min-height:30px; }
.ghSearchControl input[type="submit"] { min-height:30px; }
#header fieldset.HeadersBG { margin:0 12px; padding:8px; min-width:0; min-height:0; }
#header fieldset.HeadersBG > table { display:block; width:100%; min-height:0; }
#header fieldset.HeadersBG > table > tbody { display:block; }
#header fieldset.HeadersBG > table > tbody > tr { display:grid; grid-template-columns:180px minmax(0,1fr) 80px minmax(0,728px); gap:8px; align-items:center; }
#header .ghHeaderLogoCell, #header .ghHeaderMainCell, #header .ghHeaderAnimCell, #header .ghHeaderAdCell { display:block; width:auto !important; min-width:0 !important; max-width:100% !important; height:auto !important; min-height:0 !important; padding:0; }
#header .ghHeaderLogoCell { position:relative; align-self:stretch; min-height:144px !important; }
#header .ghHeaderLogoCell > a { display:block; width:100%; height:100%; }
#header #imgLogo { position:absolute; inset:0; width:100%; height:100%; margin:0; object-fit:cover; border-radius:12px; }
#header #updBanner { min-height:0; overflow:visible; }
#header #imgGamesHouseBanner { width:100% !important; max-width:360px; height:auto !important; }
#header #updBanner center > br { display:none; }
#header #headlineHouseGames { font-size:24px; line-height:1.3; letter-spacing:2px; word-spacing:3px; min-height:0; margin:6px 0; }
#header #HeadlineSub { font-size:18px; line-height:1.3; min-height:0; margin:4px 0; }
#header #HeadlineSong { font-size:14px; line-height:1.4; min-height:0; letter-spacing:1px; word-spacing:1px; }
#header .ghHeaderAnimBox { width:72px; height:72px; min-width:0; min-height:0; }
#header .ghHeaderAnimBox img { max-width:64px !important; max-height:64px !important; }
#header .ghHeaderAdWrap, #header .ghHeaderAdWrap .adsbygoogle, #header .ghHeaderAdWrap iframe { width:100% !important; min-width:0 !important; max-width:728px !important; height:90px !important; }
#header #InfoLineBelowHeader, #header #InfoLineBelowHeader td { height:auto; min-height:40px; max-height:none; }
#header #InfoLineBelowHeader { margin:4px auto; width:calc(100% - 24px); font-size:18px; }
#header #divComSpanForMenu { min-height:0; line-height:1.4; }
#header #divCounter { height:auto; min-height:0; }
#gamesTable.gamesGrid { display:block; width:calc(100% - 24px) !important; max-width:1380px !important; border-spacing:0 !important; margin:12px auto; }
#gamesTable > tbody { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px 8px; }
#gamesTable > tbody > tr { display:contents; }
#gamesTable td.GameSquare { display:block; width:auto !important; min-width:0 !important; max-width:100% !important; height:auto !important; min-height:250px !important; padding:0 4px; }
/* Prevent legacy :hover/:has rules from placing a popup over its own image. */
#gamesTable .ToolTip {visibility:hidden !important;opacity:0 !important;pointer-events:none !important;}
.ToolTip.ghSideTooltip {
 position:fixed !important;display:block !important;box-sizing:border-box;
 left:0;top:0;right:auto;bottom:auto;transform:none !important;
 width:240px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);
 visibility:visible !important;opacity:1 !important;pointer-events:none !important;
 overflow:hidden;overflow-wrap:anywhere;white-space:normal;
 transition:none !important;z-index:2147483000;
}
.ghBottomToolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px 24px; width:calc(100% - 24px); margin:16px auto; }
.ghBottomPages, .ghBottomIcons { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; }
.ghBottomPages a { min-width:32px; min-height:36px; display:inline-flex; align-items:center; justify-content:center; }
.ghToolbarIcon { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:4px; border:1px solid #bfc5d9; border-radius:6px; background:lavender; cursor:pointer; }
.ghToolbarIcon img { width:26px; height:26px; object-fit:contain; border:0; }
a:focus-visible, button:focus-visible, input:focus-visible { outline:3px solid #ffdb65; outline-offset:3px; }
@media(max-width:1199px) {
 #header fieldset.HeadersBG > table > tbody > tr { grid-template-columns:180px minmax(0,1fr) 72px; }
 #header .ghHeaderAdCell { grid-column:1 / -1; justify-self:center; width:100% !important; max-width:728px !important; }
}
@media(max-width:767px) {
 #header .ghTopMenuRow { grid-template-columns:minmax(0,1fr); }
 #header .ghTopSearchCell > br { display:none; }
 #header #InfoLineBelowHeader, #header #InfoLineBelowHeader tbody, #header #InfoLineBelowHeader tr, #header #InfoLineBelowHeader td { display:block; width:100%; }
 #header #InfoLineBelowHeader td:empty, #header #InfoLineBelowHeader td:nth-child(2) { display:none; }
 body > form nav > table { width:100%; }
}

/* Language and search occupy the physical left column in both languages. */
#header .ghTopMenuCell { grid-column:2; grid-row:1; }
#header .ghTopSearchCell { grid-column:1; grid-row:1; }
#header #updPnlMenuBar { display:flex; align-items:center; justify-content:flex-start; direction:ltr; height:auto; min-height:0; margin-bottom:4px; }
#header #updPnlMenuBar .ghLangButton { margin:0 4px; }
#header .ghSearchControl input[type="search"] { width:145px; }
#header #updMenuBarGames #ghMenuViews { min-height:0 !important; padding:0 !important; }
/* Keep the base category bar on a single row across the available width. */
#header #updMenuBarGames #ghMenuViews [id$="pnlBase"] > table,
#header #updMenuBarGames #ghMenuViews [id$="pnlBase"] > table > tbody { display:block; width:100% !important; }
#header #updMenuBarGames #ghMenuViews [id$="pnlBase"] > table > tbody > tr { display:flex; width:100%; flex-wrap:nowrap; align-items:center; justify-content:center; gap:8px; }
#header #updMenuBarGames #ghMenuViews [id$="pnlBase"] > table > tbody > tr:first-child,
#header #updMenuBarGames #ghMenuViews [id$="pnlBase"] > table > tbody > tr:last-child { display:none; }
#header #updMenuBarGames #ghMenuViews [id$="pnlBase"] > table > tbody > tr > td { display:block; flex:1 1 128px; width:auto; min-width:0; max-width:144px; padding:0 !important; }
#header #updMenuBarGames #ghMenuViews input[type="image"] {
 width:100% !important; max-width:144px !important; min-width:0 !important;
 height:auto !important; min-height:0 !important; aspect-ratio:128 / 72;
}
#header #updMenuBarGames #ghMenuViews a.links1,
#header #updMenuBarGames #ghMenuViews a.links2 {
 min-width:0 !important; max-width:100% !important; width:100%; overflow-wrap:anywhere;
}
/* All column counts divide 36, so a full page has no trailing partial row. */
@media(max-width:1239px) { #gamesTable > tbody { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:839px) { #gamesTable > tbody { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:767px) {
 #header .ghTopMenuRow { grid-template-columns:minmax(0,1fr); }
 #header .ghTopMenuCell { grid-column:1; grid-row:1; }
 #header .ghTopSearchCell { grid-column:1; grid-row:2; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
 #header fieldset.HeadersBG > table > tbody > tr { grid-template-columns:120px minmax(0,1fr) 64px; }
 #header .ghHeaderLogoCell { min-height:96px !important; }
}
@media(max-width:639px) { #gamesTable > tbody { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:419px) { #gamesTable > tbody { grid-template-columns:minmax(0,1fr); } }

/* Override the legacy left float and centre the upper page links in their cell. */
#GamesPageBar { text-align:center; vertical-align:middle; }
#GamesPageBar #pnlNumbers { float:none; display:inline-block; max-width:100%; text-align:center; }
