/* ==========================================================================
   PRIZPASS.PL — SITE-WIDE STYLESHEET
   Retro "portal gier i nagród" look, based on the 2007 archive reference.
   Apply this file on every page (it targets the classes already used
   across the site templates: forumline, row1, thTop/thCorner*, gensmall,
   forumlink) so the whole site gets the same look without editing markup.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
:root{
  /* palette */
  --pz-blue-bg:        #b3b9e6;   /* page background band behind content */
  --pz-blue-bg-dark:    #9aa0d9;
  --pz-green-panel:     #b7e08a;  /* main content panel background */
  --pz-green-panel-alt: #c7e79c;
  --pz-yellow:          #ffcc33;  /* header / nav / button yellow */
  --pz-yellow-light:    #ffe58a;
  --pz-yellow-dark:     #f2a900;
  --pz-orange:          #ff9900;
  --pz-orange-dark:     #e67e00;
  --pz-black:           #1a1a1a;
  --pz-text:            #222222;
  --pz-text-muted:      #4d4d4d;
  --pz-link:            #cc0000;
  --pz-link-hover:      #ff3300;
  --pz-border:          #000000;
  --pz-border-light:    #7a7a2e;
  --pz-white:           #ffffff;

  /* type */
  --pz-font: Verdana, Arial, Helvetica, sans-serif;
  --pz-font-size-base: 12px;
  --pz-font-size-small: 11px;
  --pz-font-size-h1: 18px;
  --pz-font-size-h2: 14px;

  /* spacing */
  --pz-space-xs: 4px;
  --pz-space-sm: 8px;
  --pz-space-md: 12px;
  --pz-space-lg: 20px;

  /* misc */
  --pz-radius: 3px;
  --pz-shadow: 0 1px 3px rgba(0,0,0,0.35);
  --pz-content-width: 753px;
}

/* --------------------------------------------------------------------------
   2. RESET / BASE
   -------------------------------------------------------------------------- */
html, body{
  margin: 0;
  padding: 0;
}

body{
  background-color: var(--pz-blue-bg);
  background-repeat: repeat;
  font-family: var(--pz-font);
  font-size: var(--pz-font-size-base);
  color: var(--pz-text);
  line-height: 1.45;
}

a{
  color: var(--pz-link);
  text-decoration: underline;
  font-weight: bold;
}

a:hover{
  color: var(--pz-link-hover);
}

img{
  border: 0;
  max-width: 100%;
}

table{
  border-collapse: collapse;
}

/* generic centered page wrapper used by the table-based layout */
body > div[align="center"],
.pz-wrapper{
  max-width: var(--pz-content-width);
  margin: 0 auto;
  background-color: var(--pz-blue-bg);
}

/* --------------------------------------------------------------------------
   3. HEADER / LOGO BAND
   -------------------------------------------------------------------------- */
.pz-header,
table[background*="prizpass_logo"]{
  background-color: var(--pz-yellow);
}

#data, #czas{
  color: var(--pz-black);
  font-size: var(--pz-font-size-small);
  font-weight: bold;
}

/* --------------------------------------------------------------------------
   4. PANEL / FORUM-STYLE TABLES (sidebar boxes, content boxes)
   -------------------------------------------------------------------------- */
.forumline{
  border: 1px solid var(--pz-border);
  background-color: var(--pz-green-panel);
  box-shadow: var(--pz-shadow);
}

.row1,
.row2{
  background-color: var(--pz-green-panel);
  padding: var(--pz-space-sm);
  color: var(--pz-text);
  vertical-align: top;
}

.row2{
  background-color: var(--pz-green-panel-alt);
}

/* Section title bars, e.g. "Witaj !" box header */
.thCornerL,
.thCornerR,
.thTop{
  background: linear-gradient(to bottom, var(--pz-yellow-light) 0%, var(--pz-yellow) 55%, var(--pz-yellow-dark) 100%);
  color: var(--pz-black);
  font-weight: bold;
  font-size: var(--pz-font-size-h2);
  text-align: center;
  padding: var(--pz-space-sm) var(--pz-space-md);
  border: 1px solid var(--pz-border);
}

.thCornerL{
  border-radius: var(--pz-radius) 0 0 0;
}

.thCornerR{
  border-radius: 0 var(--pz-radius) 0 0;
}

/* --------------------------------------------------------------------------
   5. MAIN NAVIGATION (event / konkurs / zdrapki / ankieta / aukcja / FORUM)
   -------------------------------------------------------------------------- */
.pz-nav,
table.forumline th.thTop{
  background: linear-gradient(to bottom, var(--pz-yellow-light) 0%, var(--pz-yellow) 60%, var(--pz-orange) 100%);
}

.forumlink{
  display: block;
  color: var(--pz-black) !important;
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  font-size: var(--pz-font-size-small);
  letter-spacing: 0.3px;
}

.forumlink:hover{
  color: var(--pz-orange-dark) !important;
  text-decoration: underline;
}

.gensmall{
  font-size: var(--pz-font-size-small);
  color: var(--pz-text-muted);
}

/* --------------------------------------------------------------------------
   6. SIDEBAR (login box, "Zbieraj Prizz", menu links list)
   -------------------------------------------------------------------------- */
.pz-sidebar table.forumline{
  width: 150px;
}

.pz-sidebar input[type="text"],
.pz-sidebar input[type="password"],
input[type="text"],
input[type="password"]{
  border: 1px solid var(--pz-border-light);
  background-color: var(--pz-white);
  padding: 2px 4px;
  font-family: var(--pz-font);
  font-size: var(--pz-font-size-small);
}

input[type="submit"],
input[type="button"],
.pz-button{
  background: linear-gradient(to bottom, var(--pz-yellow-light) 0%, var(--pz-yellow) 60%, var(--pz-yellow-dark) 100%);
  border: 1px solid var(--pz-border);
  color: var(--pz-black);
  font-weight: bold;
  font-size: var(--pz-font-size-small);
  padding: 3px 12px;
  border-radius: var(--pz-radius);
  cursor: pointer;
}

input[type="submit"]:hover,
input[type="button"]:hover,
.pz-button:hover{
  background: var(--pz-orange);
}

/* --------------------------------------------------------------------------
   7. CONTENT AREA — headings, announcement banners, game tiles
   -------------------------------------------------------------------------- */
h1, .pz-h1{
  font-size: var(--pz-font-size-h1);
  color: var(--pz-black);
  font-weight: bold;
  margin: var(--pz-space-md) 0;
}

h2, .pz-h2{
  font-size: var(--pz-font-size-h2);
  color: var(--pz-black);
  font-weight: bold;
  margin: var(--pz-space-sm) 0;
}

/* highlighted announcement blocks (e.g. "Konkurs miesiąca") */
.pz-announcement,
table[border="1"]{
  background-color: var(--pz-yellow);
  border: 1px solid var(--pz-border);
  color: var(--pz-black);
  font-weight: bold;
  text-align: center;
  padding: var(--pz-space-md);
}

/* game / prize tiles grid used on the homepage and inner "gry" pages */
.pz-tiles{
  display: flex;
  flex-wrap: wrap;
  gap: var(--pz-space-md);
  justify-content: center;
  margin: var(--pz-space-lg) 0;
}

.pz-tile{
  background-color: var(--pz-green-panel-alt);
  border: 1px solid var(--pz-border-light);
  border-radius: var(--pz-radius);
  padding: var(--pz-space-sm);
  width: 220px;
  text-align: center;
  box-shadow: var(--pz-shadow);
}

.pz-tile .pz-cost{
  font-weight: bold;
  color: var(--pz-orange-dark);
}

/* --------------------------------------------------------------------------
   8. STATS BAR (registered players / online / views)
   -------------------------------------------------------------------------- */
.pz-stats{
  background-color: var(--pz-yellow);
  border-top: 1px solid var(--pz-border);
  border-bottom: 1px solid var(--pz-border);
  text-align: center;
  padding: var(--pz-space-sm);
  font-weight: bold;
  color: var(--pz-black);
}

.pz-stats strong{
  color: var(--pz-orange-dark);
  font-size: 15px;
}

/* --------------------------------------------------------------------------
   9. FOOTER
   -------------------------------------------------------------------------- */
.pz-footer,
footer{
  background-color: var(--pz-blue-bg-dark);
  color: var(--pz-text-muted);
  font-size: var(--pz-font-size-small);
  text-align: center;
  padding: var(--pz-space-md);
}

.pz-footer a,
footer a{
  color: var(--pz-text-muted);
  font-weight: normal;
  text-decoration: underline;
}

.pz-footer a:hover,
footer a:hover{
  color: var(--pz-link-hover);
}

/* --------------------------------------------------------------------------
   10. RESPONSIVE ADJUSTMENTS
   -------------------------------------------------------------------------- */
@media (max-width: 800px){
  body > div[align="center"],
  .pz-wrapper{
    max-width: 100%;
    width: 100%;
  }

  .pz-tile{
    width: 100%;
    max-width: 320px;
  }

  table.forumline{
    width: 100% !important;
  }
}

/* --------------------------------------------------------------------------
   11. PRINT
   -------------------------------------------------------------------------- */
@media print{
  body{
    background: var(--pz-white);
  }

  .pz-nav, .pz-sidebar, .pz-footer, footer{
    display: none;
  }
}
