/* ==========================================================================
   Poker-klub.dk — Casino Felt & Gold theme
   Modernised header/menu + right-hand sidebar cards
   ========================================================================== */

:root{
  --pk-felt-dark:   #06301c;
  --pk-felt-mid:    #0c4a2c;
  --pk-felt-light:  #146c3f;
  --pk-gold:        #d4af37;
  --pk-gold-bright: #f3d876;
  --pk-gold-deep:   #9c7a22;
  --pk-cream:       #f5efd9;
  --pk-shadow:      rgba(0,0,0,.45);
}

/* --------------------------------------------------------------------------
   Header / top navigation
   -------------------------------------------------------------------------- */
.header.container-header{
  background:
    radial-gradient(circle at 15% 20%, rgba(255,255,255,.05) 0%, transparent 45%),
    radial-gradient(circle at 85% 80%, rgba(255,255,255,.04) 0%, transparent 40%),
    linear-gradient(135deg, var(--pk-felt-dark) 0%, var(--pk-felt-mid) 55%, var(--pk-felt-dark) 100%) !important;
  border-bottom: 2px solid var(--pk-gold);
  box-shadow: 0 4px 18px var(--pk-shadow);
  padding-top: .5rem;
  padding-bottom: .5rem;
}

.header .brand-logo,
.header .navbar-brand img{
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.5));
  transition: transform .25s ease;
}
.header .navbar-brand:hover img{
  transform: scale(1.03);
}

/* Menu list */
.header .mod-menu.nav{
  gap: .25rem;
}

.header .mod-menu.nav > .nav-item > a,
.header .mod-menu.nav > .nav-item > .mod-menu__toggle-sub{
  color: var(--pk-cream) !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .85rem;
  padding: .65rem 1rem !important;
  border-radius: 8px;
  position: relative;
  transition: color .2s ease, background-color .2s ease;
}

.header .mod-menu.nav > .nav-item > a::after,
.header .mod-menu.nav > .nav-item > .mod-menu__toggle-sub::after{
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: .35rem;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--pk-gold), transparent);
  transform: scaleX(0);
  transition: transform .25s ease;
}

.header .mod-menu.nav > .nav-item > a:hover,
.header .mod-menu.nav > .nav-item > .mod-menu__toggle-sub:hover,
.header .mod-menu.nav > .nav-item.active > a{
  color: var(--pk-gold-bright) !important;
  background: rgba(212,175,55,.1);
}
.header .mod-menu.nav > .nav-item > a:hover::after,
.header .mod-menu.nav > .nav-item > .mod-menu__toggle-sub:hover::after,
.header .mod-menu.nav > .nav-item.active > a::after{
  transform: scaleX(1);
}

/* Fix: align dropdown toggle buttons (POKER-KLUB!, TOOLBOX!) with plain menu links */
.header .mod-menu.nav > .nav-item > a,
.header .mod-menu.nav > .nav-item > .mod-menu__toggle-sub{
  display: inline-flex !important;
  align-items: center !important;
}

/* Dropdown panels */
.header .mod-menu__sub{
  background: linear-gradient(180deg, var(--pk-felt-mid), var(--pk-felt-dark));
  border: 1px solid var(--pk-gold-deep);
  border-top: 2px solid var(--pk-gold);
  border-radius: 10px;
  box-shadow: 0 12px 28px var(--pk-shadow);
  padding: .4rem;
  margin-top: .35rem !important;
}

.header .mod-menu__sub a{
  color: var(--pk-cream) !important;
  border-radius: 6px;
  font-size: .85rem;
  padding: .55rem .85rem;
  transition: background-color .2s ease, color .2s ease, padding-left .2s ease;
}
.header .mod-menu__sub a:hover{
  background: rgba(212,175,55,.15) !important;
  color: var(--pk-gold-bright) !important;
  padding-left: 1.1rem;
}

/* --------------------------------------------------------------------------
   Sidebar / layout boxes (cards)
   -------------------------------------------------------------------------- */
.sidebar-right.card,
.sidebar-left.card,
aside .card{
  background: linear-gradient(160deg, var(--pk-felt-mid) 0%, var(--pk-felt-dark) 100%);
  border: 1px solid var(--pk-gold-deep);
  border-radius: 14px;
  box-shadow: 0 10px 24px var(--pk-shadow), inset 0 0 40px rgba(0,0,0,.25);
  color: var(--pk-cream);
  overflow: hidden;
  margin-bottom: 1.5rem;
}

.sidebar-right.card .card-header,
.sidebar-left.card .card-header,
aside .card .card-header{
  background: linear-gradient(90deg, var(--pk-gold-deep), var(--pk-gold) 50%, var(--pk-gold-deep));
  color: var(--pk-felt-dark);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .95rem;
  padding: .75rem 1.1rem;
  border-bottom: none;
  position: relative;
}
.sidebar-right.card .card-header::before,
.sidebar-left.card .card-header::before,
aside .card .card-header::before{
  content: "♠";
  margin-right: .5rem;
  opacity: .75;
}

.sidebar-right.card .card-body,
.sidebar-left.card .card-body,
aside .card .card-body{
  padding: 1.1rem;
}

.sidebar-right.card a,
.sidebar-left.card a,
aside .card a{
  color: var(--pk-gold-bright);
}
.sidebar-right.card a:hover,
.sidebar-left.card a:hover,
aside .card a:hover{
  color: #fff;
}

/* Buttons inside sidebar cards (Log out, Log in, etc.) */
.sidebar-right.card .btn,
.sidebar-left.card .btn,
aside .card .btn{
  background: linear-gradient(180deg, var(--pk-gold-bright), var(--pk-gold-deep));
  border: 1px solid var(--pk-gold-deep);
  color: var(--pk-felt-dark);
  font-weight: 700;
  border-radius: 8px;
  box-shadow: 0 3px 8px rgba(0,0,0,.35);
  transition: transform .15s ease, box-shadow .15s ease;
}
.sidebar-right.card .btn:hover,
.sidebar-left.card .btn:hover,
aside .card .btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(0,0,0,.45);
  color: var(--pk-felt-dark);
}

/* Inputs inside sidebar cards */
.sidebar-right.card input[type="text"],
.sidebar-right.card input[type="password"],
.sidebar-left.card input[type="text"],
.sidebar-left.card input[type="password"]{
  background: rgba(255,255,255,.92);
  border: 1px solid var(--pk-gold-deep);
  border-radius: 6px;
  color: #1a1a1a;
}

/* Card list items */
.sidebar-right.card .list-unstyled li,
.sidebar-left.card .list-unstyled li,
aside .card .list-unstyled li{
  border-bottom: 1px solid rgba(212,175,55,.15);
  padding: .4rem 0;
}
.sidebar-right.card .list-unstyled li:last-child,
.sidebar-left.card .list-unstyled li:last-child,
aside .card .list-unstyled li:last-child{
  border-bottom: none;
}


/* --------------------------------------------------------------------------
   Mobile hamburger menu toggle
   -------------------------------------------------------------------------- */
.header .grid-child:not(.container-nav){
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pk-menu-toggle{
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 2px solid var(--pk-gold);
  background: rgba(255,255,255,.06);
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.pk-menu-toggle:hover{
  background: rgba(212,175,55,.18);
  border-color: var(--pk-gold-bright);
}
.pk-menu-toggle .pk-bar{
  display: block;
  width: 20px;
  height: 2px;
  background: var(--pk-gold-bright);
  margin: 3px 0;
  border-radius: 1px;
  transition: transform .2s ease, opacity .2s ease;
}
.header.pk-menu-open .pk-menu-toggle .pk-bar:nth-child(1){
  transform: translateY(5px) rotate(45deg);
}
.header.pk-menu-open .pk-menu-toggle .pk-bar:nth-child(2){
  opacity: 0;
}
.header.pk-menu-open .pk-menu-toggle .pk-bar:nth-child(3){
  transform: translateY(-5px) rotate(-45deg);
}

@media (max-width: 768px){
  .pk-menu-toggle{
    display: inline-flex;
  }

  .header .container-nav{
    display: none;
    width: 100%;
  }
  .header.pk-menu-open .container-nav{
    display: block;
  }

  .header .mod-menu.nav{
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: .5rem 0 1rem;
  }
  .header .mod-menu.nav > .nav-item{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .header .mod-menu.nav > .nav-item > a{
    flex: 1 1 auto;
    display: block;
    text-align: left;
  }
  .header .mod-menu.nav > .nav-item > a::after{
    left: 0;
    right: 0;
  }
  .header .mod-menu.nav > .nav-item > .mod-menu__toggle-sub{
    flex: 0 0 auto;
    padding: .65rem .9rem !important;
  }
  .header .mod-menu__sub{
    flex-basis: 100%;
    position: static;
    box-shadow: none;
    margin: 0 0 .35rem 1rem !important;
    width: calc(100% - 1rem);
  }
}


/* --------------------------------------------------------------------------
   Community Builder login module: real classes are .inputbox / .button
   -------------------------------------------------------------------------- */
.sidebar-right.card .button,
.sidebar-left.card .button,
aside .card .button{
  background: linear-gradient(180deg, var(--pk-gold-bright), var(--pk-gold-deep));
  border: 1px solid var(--pk-gold-deep);
  color: var(--pk-felt-dark);
  font-weight: 700;
  border-radius: 8px;
  box-shadow: 0 3px 8px rgba(0,0,0,.35);
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}
.sidebar-right.card .button:hover,
.sidebar-left.card .button:hover,
aside .card .button:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(0,0,0,.45);
}
.sidebar-right.card .inputbox,
.sidebar-left.card .inputbox,
aside .card .inputbox{
  background: rgba(255,255,255,.92);
  border: 1px solid var(--pk-gold-deep);
  border-radius: 6px;
  color: #1a1a1a;
}
.sidebar-right.card .cbModuleUsernameIcon,
.sidebar-right.card .cbModuleLoginIcon,
.sidebar-left.card .cbModuleUsernameIcon,
.sidebar-left.card .cbModuleLoginIcon{
  color: var(--pk-gold-bright);
}

/* --------------------------------------------------------------------------
   Homepage, logged-out: hide the menu, show only a big centered login box
   -------------------------------------------------------------------------- */
body.itemid-273.pk-guest-landing .header .container-nav,
body.itemid-273.pk-guest-landing .header .pk-menu-toggle{
  display: none !important;
}

body.itemid-273.pk-guest-landing .site-grid{
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  padding: 5vh 1rem;
  min-height: calc(100vh - 110px);
}

body.itemid-273.pk-guest-landing .site-grid .container-component{
  display: none !important;
}

body.itemid-273.pk-guest-landing .site-grid .container-sidebar-right{
  width: 100%;
  max-width: 460px;
  margin: 0;
}

body.itemid-273.pk-guest-landing .sidebar-right.card{
  font-size: 1.05rem;
}
body.itemid-273.pk-guest-landing .sidebar-right.card .card-header{
  font-size: 1.5rem;
  padding: 1.5rem 1.85rem;
  text-align: center;
}
body.itemid-273.pk-guest-landing .sidebar-right.card .card-body{
  padding: 2.25rem 1.85rem 2.5rem;
}
body.itemid-273.pk-guest-landing .sidebar-right.card p{
  margin-bottom: 1.1rem;
}
body.itemid-273.pk-guest-landing .sidebar-right.card label{
  display: flex;
  align-items: center;
  gap: .4rem;
  margin-bottom: .4rem;
  font-weight: 600;
  color: var(--pk-cream);
}
body.itemid-273.pk-guest-landing .sidebar-right.card .inputbox{
  width: 100%;
  padding: .7rem .9rem;
  font-size: 1.05rem;
  box-sizing: border-box;
}
body.itemid-273.pk-guest-landing .sidebar-right.card .button{
  width: 100%;
  padding: .8rem 1.25rem;
  font-size: 1.1rem;
  margin-top: .5rem;
}

/* --------------------------------------------------------------------------
   Content tables (results, standings, Hall of Fame, Bødekasse, etc.)
   -------------------------------------------------------------------------- */
table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 1.5rem 0;
  background: linear-gradient(160deg, var(--pk-felt-light) 0%, var(--pk-felt-mid) 100%) !important;
  border: 1px solid var(--pk-gold-deep);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 16px var(--pk-shadow), inset 0 0 24px rgba(0,0,0,.12);
  color: var(--pk-cream);
  font-size: .95rem;
}

table caption{
  caption-side: top;
  padding: .6rem .2rem;
  color: var(--pk-gold-bright);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  text-align: left;
}

table thead th,
table tr:first-child th{
  background: linear-gradient(90deg, var(--pk-gold-deep), var(--pk-gold) 50%, var(--pk-gold-deep));
  color: var(--pk-felt-dark);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .85rem;
  padding: .75rem 1rem;
  border-bottom: none;
  text-align: left;
}

table th,
table td{
  padding: .65rem 1rem;
  border-bottom: 1px solid rgba(212,175,55,.15);
  vertical-align: middle;
}
table tbody th,
table tbody td{
  background: transparent !important;
}

table tbody tr:last-child th,
table tbody tr:last-child td{
  border-bottom: none;
}

table tbody tr:nth-child(even){
  background: rgba(255,255,255,.035);
}

table tbody tr{
  transition: background-color .15s ease;
}
table tbody tr:hover{
  background: rgba(212,175,55,.1);
}

table a{
  color: var(--pk-gold-bright);
  text-decoration: underline;
  text-decoration-color: rgba(212,175,55,.4);
}
table a:hover{
  color: #fff;
}

table strong,
table b{
  color: var(--pk-gold-bright);
}

table.table{
  --table-bg: transparent;
  --table-striped-bg: rgba(255,255,255,.035);
  --table-striped-color: var(--pk-cream);
  --table-hover-bg: rgba(212,175,55,.1);
  --table-hover-color: var(--pk-cream);
  --table-color: var(--pk-cream);
  --table-border-color: rgba(212,175,55,.15);
  color: var(--pk-cream);
}

/* --------------------------------------------------------------------------
   Badges (e.g. "Visninger" hit counts) — replace Bootstrap's default blue
   with a theme gold badge so it matches the felt & gold palette.
   -------------------------------------------------------------------------- */
.badge{
  background: linear-gradient(135deg, var(--pk-gold-deep), var(--pk-gold)) !important;
  color: var(--pk-felt-dark) !important;
  font-weight: 700;
  border: 1px solid rgba(0,0,0,.15);
}


@media (max-width: 700px){
  table{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    border-radius: 10px;
  }
}


/* --------------------------------------------------------------------------
   Community Builder ships an old Bootstrap 3 stylesheet that forces
   .cb_template .table td/th to a white background with !important.
   Beat its specificity so our felt theme shows through cb_template tables.
   -------------------------------------------------------------------------- */
html .cb_template .table td,
html .cb_template .table th{
  background-color: transparent !important;
  color: var(--pk-cream) !important;
  border-top-color: rgba(212,175,55,.15) !important;
}
html .cb_template .table thead th{
  color: var(--pk-felt-dark) !important;
}
html .cb_template .table{
  border-collapse: separate !important;
}


/* --------------------------------------------------------------------------
   Header search box — rounded pill style
   -------------------------------------------------------------------------- */
.header .container-search .inputbox,
.header .container-search input[type="search"],
.header .container-search input[type="text"]{
  background: rgba(255,255,255,.95);
  border: 1px solid var(--pk-gold-deep);
  border-radius: 999px;
  padding: .4rem 1rem;
  color: #1a1a1a;
  font-size: .9rem;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.15);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.header .container-search .inputbox::placeholder{
  color: rgba(26,26,26,.55);
}
.header .container-search .inputbox:focus{
  border-color: var(--pk-gold-bright);
  box-shadow: 0 0 0 3px rgba(212,175,55,.35), inset 0 1px 3px rgba(0,0,0,.1);
  background: #fff;
}