/* =========================================================
   Pennacool PCL123 Scoreboard — Palette & Gradients (Scoped)
   SCOPE: body#page-pennacool-pcl123-scoreboard-index only
   SAFETY: No selectors below match .navbar / .fixed-top navbar
           No borders added or changed on buttons/anchors
   ========================================================= */

#page-pennacool-pcl123-scoreboard-index {
  /* Local CSS variables (scoped to this page only) */
  --p123-orange: #F68D2C;
  --p123-lightblue: #4A90BF;
  --p123-pink: #F92A82;
  --p123-darkblue: #323C94;
  --p123-white: #FFFFFF;

  --p123-grad-warm: linear-gradient(135deg, var(--p123-orange), var(--p123-pink));
  --p123-grad-cool: linear-gradient(135deg, var(--p123-lightblue), var(--p123-darkblue));
  --p123-grad-soft: linear-gradient(180deg, rgba(250,250,255,0.9), rgba(255,255,255,0.85));
  --p123-shadow-md: 0 6px 18px rgba(0,0,0,0.08);
  --p123-shadow-lg: 0 10px 28px rgba(0,0,0,0.12);
  --p123-focus: 0 0 0 3px rgba(249, 42, 130, 0.35);
}

/* ---------- HERO / HOME BAND (safe: not the top site navbar) ---------- */
#page-pennacool-pcl123-scoreboard-index .Base .Overlay {
  background: linear-gradient(180deg, rgba(50,60,148,0.55), rgba(74,144,191,0.35), rgba(255,255,255,0.0));
  pointer-events: none;
}

#page-pennacool-pcl123-scoreboard-index #xHome.Heading .Menu .Item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px; /* mobile tap target */
  padding: .5rem .875rem;
  margin: .25rem;
  color: var(--p123-white);
  background-image: var(--p123-grad-warm);
  background-size: 200% 200%;
  background-position: 0% 50%;
  border-radius: .875rem; /* friendly, but NOT borders */
  box-shadow: var(--p123-shadow-md);
  transition: transform .15s ease, box-shadow .2s ease, background-position .4s ease;
}
#page-pennacool-pcl123-scoreboard-index #xHome.Heading .Menu .Item:hover {
  transform: translateY(-1px);
  background-position: 100% 50%;
  box-shadow: var(--p123-shadow-lg);
}
#page-pennacool-pcl123-scoreboard-index #xHome.Heading .Menu .Item:focus-visible {
  outline: none;
  box-shadow: var(--p123-focus);
}

/* ---------- SCROLL PROMPT ---------- */
#page-pennacool-pcl123-scoreboard-index #ScrollPrompt .scroll {
  color: var(--p123-white);
  text-shadow: 0 2px 6px rgba(0,0,0,0.35);
  letter-spacing: .03em;
}

/* ---------- SECTION HEADINGS ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard h3,
#page-pennacool-pcl123-scoreboard-index #xRulesSection > h3,
#page-pennacool-pcl123-scoreboard-index #xGamesSection .section-title,
#page-pennacool-pcl123-scoreboard-index #xGallerySection h3 {
  color: var(--p123-darkblue);
  font-weight: 800;
  letter-spacing: .02em;
  margin-bottom: .75rem;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard h3::after,
#page-pennacool-pcl123-scoreboard-index #xRulesSection > h3::after,
#page-pennacool-pcl123-scoreboard-index #xGamesSection .section-title::after,
#page-pennacool-pcl123-scoreboard-index #xGallerySection h3::after {
  content: "";
  display: block;
  height: 6px;
  width: 72px;
  margin-top: .25rem;
  border-radius: 999px;
  background-image: var(--p123-grad-cool);
}

/* ---------- TABS (Scoreboard/Rules ONLY; not site navbar) ---------- */
#page-pennacool-pcl123-scoreboard-index #v-pills-scoreboard .nav-tabs .nav-link,
#page-pennacool-pcl123-scoreboard-index #xRulesSection .nav-tabs .nav-link {
  color: var(--p123-darkblue);
  background: var(--p123-white);
  border-radius: .75rem .75rem 0 0; /* rounded tab tops; no border edits */
  padding: .5rem .85rem;
  min-height: 44px;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
#page-pennacool-pcl123-scoreboard-index #v-pills-scoreboard .nav-tabs .nav-link.active,
#page-pennacool-pcl123-scoreboard-index #xRulesSection .nav-tabs .nav-link.active {
  color: var(--p123-white);
  background-image: var(--p123-grad-cool);
  box-shadow: var(--p123-shadow-md);
}
#page-pennacool-pcl123-scoreboard-index #v-pills-scoreboard .nav-tabs .nav-link:focus-visible,
#page-pennacool-pcl123-scoreboard-index #xRulesSection .nav-tabs .nav-link:focus-visible {
  outline: none;
  box-shadow: var(--p123-focus);
}

/* ---------- SCOREBOARD TABLES ---------- */
#page-pennacool-pcl123-scoreboard-index #nav-monthtable .table-responsive,
#page-pennacool-pcl123-scoreboard-index #nav-weeklytable .table-responsive {
  background: var(--p123-white);
  border-radius: 1rem;
  box-shadow: var(--p123-shadow-md);
  padding: .5rem;
}

#page-pennacool-pcl123-scoreboard-index table.dataTable thead th {
  background-image: var(--p123-grad-soft);
  color: var(--p123-darkblue);
  font-weight: 700;
}

#page-pennacool-pcl123-scoreboard-index table.dataTable tbody tr:hover {
  background-image: linear-gradient(90deg, rgba(246,141,44,0.09), rgba(74,144,191,0.09));
}

#page-pennacool-pcl123-scoreboard-index .table-transition .progressname {
  color: var(--p123-darkblue);
}

/* ---------- "Choose Winners" button (specific form only) ---------- */
#page-pennacool-pcl123-scoreboard-index form[action*="/local/pcl_winners/post.php"] .btn.btn-primary {
  background-image: var(--p123-grad-warm);
  background-size: 200% 200%;
  background-position: 0% 50%;
  color: var(--p123-white);
  box-shadow: var(--p123-shadow-md);
  min-height: 44px;
  padding: .6rem 1.1rem;
  border-radius: 1rem; /* friendlier corners; no border changes */
  transition: transform .15s ease, background-position .35s ease, box-shadow .2s ease;
}
#page-pennacool-pcl123-scoreboard-index form[action*="/local/pcl_winners/post.php"] .btn.btn-primary:hover {
  transform: translateY(-1px);
  background-position: 100% 50%;
  box-shadow: var(--p123-shadow-lg);
}
#page-pennacool-pcl123-scoreboard-index form[action*="/local/pcl_winners/post.php"] .btn.btn-primary:focus-visible {
  outline: none;
  box-shadow: var(--p123-focus);
}

/* ---------- ACTIVITIES (Cards & Carousel) ---------- */
#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card {
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: var(--p123-shadow-md);
  transition: transform .15s ease, box-shadow .2s ease;
  background: var(--p123-white);
}
#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--p123-shadow-lg);
}
#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card .card-title {
  color: var(--p123-darkblue);
  font-weight: 800;
}
#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card .btn.btn-primary {
  background-image: var(--p123-grad-cool);
  color: var(--p123-white);
  min-height: 44px;
  border-radius: .875rem; /* no border edits */
  box-shadow: var(--p123-shadow-md);
  transition: background-position .35s ease, box-shadow .2s ease, transform .15s ease;
  background-size: 200% 200%;
  background-position: 0% 50%;
}
#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card .btn.btn-primary:hover {
  background-position: 100% 50%;
  transform: translateY(-1px);
  box-shadow: var(--p123-shadow-lg);
}
#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card .btn.btn-primary:focus-visible {
  outline: none;
  box-shadow: var(--p123-focus);
}

/* Owl nav within Games section only */
#page-pennacool-pcl123-scoreboard-index #xGamesSection .owl-nav button span.carousel-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px; /* tap target */
  border-radius: 50%;
  background-image: var(--p123-grad-warm);
  color: var(--p123-white);
  box-shadow: var(--p123-shadow-md);
}
#page-pennacool-pcl123-scoreboard-index #xGamesSection .owl-nav button:focus-visible span.carousel-arrow {
  outline: none;
  box-shadow: var(--p123-focus);
}

/* ---------- GALLERY ---------- */
#page-pennacool-pcl123-scoreboard-index #xGallerySection .gallery-item {
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: var(--p123-shadow-md);
  background: var(--p123-white);
}
#page-pennacool-pcl123-scoreboard-index #xGallerySection .gallery-caption h4 {
  margin: 0;
  padding: .5rem .75rem;
  color: var(--p123-white);
  background-image: var(--p123-grad-cool);
}

/* ---------- RULES PANEL CONTENT ---------- */
#page-pennacool-pcl123-scoreboard-index #xRulesSection .tab-pane {
  background: var(--p123-white);
  border-radius: 1rem;
  box-shadow: var(--p123-shadow-md);
  padding: 1rem;
}
#page-pennacool-pcl123-scoreboard-index #xRulesSection strong {
  color: var(--p123-darkblue);
}
#page-pennacool-pcl123-scoreboard-index #xRulesSection ul > li::marker {
  color: var(--p123-orange);
}

/* ---------- ACCESSIBILITY & FOCUS (scoped to these sections) ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard a:focus-visible,
#page-pennacool-pcl123-scoreboard-index #xRulesSection a:focus-visible,
#page-pennacool-pcl123-scoreboard-index #xGamesSection a:focus-visible,
#page-pennacool-pcl123-scoreboard-index #xGallerySection a:focus-visible,
#page-pennacool-pcl123-scoreboard-index #xHome .Item:focus-visible,
#page-pennacool-pcl123-scoreboard-index #xGamesSection .owl-nav button:focus-visible {
  outline: none;
  box-shadow: var(--p123-focus);
}

/* ---------- MOBILE TWEAKS ---------- */
@media (max-width: 576.98px) {
  #page-pennacool-pcl123-scoreboard-index #xHome.Heading .Menu .Item {
    padding: .6rem .85rem;
    font-size: .95rem;
  }
  #page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card .card-title {
    font-size: 1rem;
  }
  #page-pennacool-pcl123-scoreboard-index #xRulesSection .tab-pane {
    padding: .75rem;
  }
}




/* =========================================================
   Additional Changes (if any) — Scoped
   ========================================================= */
/* === Fixed page background layer (sits behind everything) === */
body#page-pennacool-pcl123-scoreboard-index::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: url("https://sea.pennacool.com/pennacool/images/RBL/pcl123-bg.png")
              center / cover no-repeat;
  opacity: .25; /* ← adjust 0–1 to taste */
}

/* === Nuke the white/black canvases that were covering it === */
body#page-pennacool-pcl123-scoreboard-index,
body#page-pennacool-pcl123-scoreboard-index #page,
body#page-pennacool-pcl123-scoreboard-index #page-wrapper,
body#page-pennacool-pcl123-scoreboard-index #region-main,
body#page-pennacool-pcl123-scoreboard-index #region-main-box,
body#page-pennacool-pcl123-scoreboard-index .Base,
body#page-pennacool-pcl123-scoreboard-index .Background {
  background: transparent !important;
}

/* Optional: keep “card” readability with a soft translucent panel */
body#page-pennacool-pcl123-scoreboard-index #xRulesSection .tab-pane,
body#page-pennacool-pcl123-scoreboard-index #nav-monthtable .table-responsive,
body#page-pennacool-pcl123-scoreboard-index #nav-weeklytable .table-responsive,
body#page-pennacool-pcl123-scoreboard-index #xGamesSection .game-card,
body#page-pennacool-pcl123-scoreboard-index #xGallerySection .gallery-item .gallery-caption {
  background: rgba(255,255,255,0.88) !important;
}

#page-pennacool-pcl123-scoreboard-index #Scoreboard {
  background: rgba(255,255,255,0.75);  /* translucent white */
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  margin: 2rem auto;
  max-width: 1200px;                   /* keep it neat on wide screens */
}

/* === How to Win (Rules) section background === */
#page-pennacool-pcl123-scoreboard-index #xRulesSection {
  background: rgba(255,255,255,0.5);  /* translucent white */
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  margin: 2rem auto;
  max-width: 1200px;
}

#BackToTop img {
  display: none !important;
}

/* === Activities (Games) section background === */
#page-pennacool-pcl123-scoreboard-index #xGamesSection {
  background: rgba(255,255,255,0.5);  /* translucent white */
  /* border-radius: 1rem; */
  padding: 1.25rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  margin: 2rem auto;
  max-width: 1200px;
}

body#page-pennacool-pcl123-scoreboard-index {
  --p123-bg-y: 20%; /* try 15–35% depending on where the subject is */
}


body#page-pennacool-pcl123-scoreboard-index::before {
  background-position: 50% var(--p123-bg-y);
  background-size: cover; /* keep filling the viewport */
}




/* =========================================================
   Pennacool PCL123 — SCOREBOARD-ONLY STYLES (Hard-coded)
   SCOPE: #page-pennacool-pcl123-scoreboard-index #Scoreboard
   SAFETY: No selectors match .navbar / .fixed-top navbar
           No borders added/changed on buttons/anchors
   PALETTE: Orange #F68D2C, Light Blue #4A90BF, Pink #F92A82,
            Dark Blue #323C94, White #FFFFFF
   ========================================================= */

/* ---------- SCOREBOARD WRAPPER ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard{
  background: rgba(255,255,255,0.88);
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  margin: 1rem auto 2rem;
  max-width: 1200px;
}

/* ---------- TITLE ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard h3{
  color:#323C94;
  font-weight:800;
  letter-spacing:.02em;
  margin-bottom:.75rem;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard h3::after{
  content:"";
  display:block;
  height:6px; width:72px;
  margin-top:.25rem;
  border-radius:999px;
  background-image:linear-gradient(135deg,#4A90BF,#323C94);
}

/* ---------- TABS IN SCOREBOARD ONLY ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard .nav-tabs .nav-link{
  color:#323C94;
  background:#FFFFFF;
  border-radius:.75rem .75rem 0 0;
  padding:.5rem .85rem;
  min-height:44px;
  transition:background .2s ease,color .2s ease,box-shadow .2s ease;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard .nav-tabs .nav-link.active{
  color:#FFFFFF;
  background-image:linear-gradient(135deg,#4A90BF,#323C94);
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard .nav-tabs .nav-link:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(249,42,130,0.35); /* pink focus */
}

/* ---------- DATATABLES CHROME (length/filter/info/pager) ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard .dataTables_length label,
#page-pennacool-pcl123-scoreboard-index #Scoreboard .dataTables_filter label{
  color:#323C94;
  font-weight:600;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard .dataTables_filter input{
  border-radius:.75rem;
  border:none;
  padding:.35rem .6rem;
  box-shadow:0 0 0 1px rgba(50,60,148,0.25) inset, 0 2px 6px rgba(0,0,0,0.06);
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard .dataTables_info{
  color:#323C94 !important;
  font-weight:600 !important;
  font-size:.95rem !important;
  padding:.75rem 0 !important;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard .dataTables_paginate .paginate_button{
  background:#FFFFFF;
  color:#323C94 !important;
  border-radius:.65rem;
  padding:.35rem .6rem;
  margin:.1rem;
  box-shadow:0 0 0 1px rgba(50,60,148,0.18) inset;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard .dataTables_paginate .paginate_button.current{
  color:#FFFFFF !important;
  background-image:linear-gradient(135deg,#4A90BF,#323C94);
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
}

/* ---------- TABLE CONTAINER ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard .table-responsive{
  background:#FFFFFF;
  border-radius:1rem;
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
  padding:.5rem;
}

/* ---------- TABLE HEADER ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable thead th{
  background:#4A90BF;                 /* strong header like screenshot */
  color:#FFFFFF;
  font-weight:700;
  text-align:center;
  border:none;
  padding:14px;
  font-size:1rem;
  letter-spacing:.5px;
  position:relative;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable thead th .sorting,
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable thead th .sorting_asc,
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable thead th .sorting_desc{
  color:#FFFFFF;
}

/* ---------- ROWS (alternating, high-contrast like reference) ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable tbody tr:nth-child(odd){
  background-color:#F0CFA4; /* light mix derived from #F68D2C */
  color:#1a225d;            /* deepened dark blue for readability */
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable tbody tr:nth-child(even){
  background-color:#F6A24E; /* orange tint */
  color:#1a225d;
}

/* compact cells & no borders (match screenshot look) */
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable td,
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable th{
  border:none;
  padding:12px;
  vertical-align:middle;
}

/* hover highlight across full row */
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable tbody tr:hover{
  background-image:linear-gradient(90deg, rgba(246,141,44,0.14), rgba(74,144,191,0.14));
  transition:background-color .25s ease, background-image .25s ease, color .25s ease;
}

/* optional subtle separators for readability on dense tables */
#page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable tbody tr + tr{
  box-shadow:0 -1px 0 rgba(0,0,0,0.04) inset;
}

/* ---------- DETAILS/EXPAND CONTROL (first column “+”) ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard td.details-control{
  cursor:pointer;
  width:34px; min-width:34px;
  text-align:center;
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard tr td.details-control::before{
  content:"+";
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px;
  line-height:1; font-weight:800;
  border-radius:50%;
  color:#FFFFFF;
  background-image:linear-gradient(135deg,#F68D2C,#F92A82);
  box-shadow:0 2px 6px rgba(0,0,0,0.12);
}
#page-pennacool-pcl123-scoreboard-index #Scoreboard tr.shown td.details-control::before{
  content:"–";
  background-image:linear-gradient(135deg,#4A90BF,#323C94);
}

/* ---------- TEXT TREATMENTS ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard .progressname,
#page-pennacool-pcl123-scoreboard-index #Scoreboard .student-name{
  color:#323C94;
  font-weight:600;
}

/* ---------- FOCUS STATES (scoreboard only) ---------- */
#page-pennacool-pcl123-scoreboard-index #Scoreboard a:focus-visible,
#page-pennacool-pcl123-scoreboard-index #Scoreboard button:focus-visible,
#page-pennacool-pcl123-scoreboard-index #Scoreboard input:focus-visible,
#page-pennacool-pcl123-scoreboard-index #Scoreboard .nav-link:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(249,42,130,0.35);
}

/* ---------- MOBILE TWEAKS ---------- */
@media (max-width:576.98px){
  #page-pennacool-pcl123-scoreboard-index #Scoreboard .nav-tabs .nav-link{
    padding:.6rem .85rem;
    font-size:.95rem;
  }
  #page-pennacool-pcl123-scoreboard-index #Scoreboard table.dataTable td{
    padding:10px;
  }
}
