/* ============================================================
   stratics.css -- UO:Renaissance dark fantasy theme overlay
   for HTTrack-mirrored UOSS Stratics pages
   ============================================================ */

/* -- Global font and base overrides -------------------------- */
.stratics-wrap,
.stratics-wrap * {
  box-sizing: border-box;
}

.stratics-wrap,
.stratics-wrap font,
.stratics-wrap td,
.stratics-wrap th,
.stratics-wrap tr,
.stratics-wrap table,
.stratics-wrap p,
.stratics-wrap div,
.stratics-wrap li,
.stratics-wrap span {
  font-family: 'Cardo', serif !important;
}

/* -- Archive title ------------------------------------------- */
.stratics-archive-title {
  font-family: 'Cinzel Decorative', serif !important;
  color: #ffdf6a !important;
  font-size: clamp(1.4rem, 2.5vw, 2rem) !important;
  text-align: center;
  text-shadow: 0 0 16px rgba(255,223,106,.65), 0 2px 4px rgba(0,0,0,.8);
  margin: 0 0 0.8rem 0;
  letter-spacing: 0.04em;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid rgba(212,175,55,0.3);
}

/* Headings in content pages (Houses, essays, etc.) */
.stratics-wrap h1,
.stratics-wrap h2,
.stratics-wrap h3,
.stratics-wrap h4 {
  font-family: 'Cinzel Decorative', serif !important;
  color: #ffdf6a !important;
  text-shadow: 0 0 10px rgba(255,223,106,.3), 0 2px 4px rgba(0,0,0,.7);
  letter-spacing: 0.03em;
  margin-top: 1rem;
  margin-bottom: 0.6rem;
}

.stratics-wrap h2 {
  font-size: clamp(1.2rem, 2vw, 1.6rem) !important;
}

.stratics-wrap h3 {
  font-size: clamp(1rem, 1.6vw, 1.25rem) !important;
  color: #eed580 !important;
}

/* Images in content pages (House blueprints, maps) */
.stratics-wrap img:not([src*="uorenn_logo"]) {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  border: 1px solid rgba(212,175,55,0.3);
  box-shadow: 0 4px 16px rgba(0,0,0,0.6);
  margin: 0.5rem 0 1rem 0;
}

/* -- Wrapper ------------------------------------------------- */
.stratics-wrap {
  padding: 1rem 1.5rem 2.5rem 1.5rem;
  max-width: 1100px !important;
  margin-top: 70px;
  color: #d8eed0;
}

.stratics-wrap center {
  display: block;
  text-align: center;
}

/* Let nested tables shrink to fit content by default */
.stratics-wrap table {
  width: 100%;
  max-width: 100%;
  border-spacing: 0;
}

/* -- Navigation link block (top category box) ---------------- */
.stratics-wrap table[border="0"]:first-of-type,
.stratics-wrap center:first-of-type > table[border="0"],
.stratics-wrap center > table:first-child[border="0"] {
  border: none !important;
  background: rgba(5, 20, 10, 0.75) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 8px !important;
  padding: 0.35rem 0.8rem !important;
  margin: 0 auto 1rem auto;
  width: 100% !important;
  box-shadow: 0 2px 14px rgba(0,0,0,0.6);
  border: 1px solid rgba(212,175,55,0.25) !important;
}

.stratics-wrap table[border="0"] td,
.stratics-wrap table[border="0"] font {
  font-family: 'Cardo', serif !important;
  font-size: 0.84rem !important;
  color: #c8b87a !important;
  line-height: 1.35;
  padding: 0.08rem 0.2rem !important;
}

.stratics-wrap table[border="0"] a {
  color: #d4af37 !important;
  text-decoration: none;
  padding: 0 0.2rem;
  transition: color 0.2s;
}
.stratics-wrap table[border="0"] a:hover {
  color: #ffe87a !important;
  text-decoration: underline;
}

/* -- Main data tables & borders ------------------------------ */
.stratics-wrap table[border="1"],
.stratics-wrap table[border="2"],
.stratics-wrap table[bgcolor] {
  width: 100%;
  background: rgba(2, 14, 6, 0.95);
  border-collapse: collapse;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.6), 0 0 0 1px rgba(212,175,55,0.25);
  margin-bottom: 1.75rem;
  border: 1px solid rgba(212, 175, 55, 0.4) !important;
}

.stratics-wrap table[border="1"] td,
.stratics-wrap table[border="1"] th,
.stratics-wrap table[border="2"] td,
.stratics-wrap table[border="2"] th,
.stratics-wrap table[bgcolor] td {
  border: 1px solid rgba(212, 175, 55, 0.22) !important;
  color: #e5f5e0;
  padding: 0.35rem 0.6rem;
  vertical-align: middle;
  font-family: 'Cardo', serif !important;
  font-size: 0.88rem !important;
}

/* Paragraphs and prose inside tables / essays */
.stratics-wrap p {
  color: #d8eed0;
  font-size: 0.95rem;
  line-height: 1.65;
  margin: 0.6rem 0;
}

/* -- Section Header Rows (formerly red / maroon / #800000) --- */
.stratics-wrap td[bgcolor="#800000"],
.stratics-wrap td[bgcolor="800000"],
.stratics-wrap td[bgcolor="Maroon"],
.stratics-wrap td[bgcolor="maroon"],
.stratics-wrap td[bgcolor="#800000"] font,
.stratics-wrap td[bgcolor="800000"] font,
.stratics-wrap td[bgcolor="Maroon"] font,
.stratics-wrap tr[bgcolor="#800000"] td,
.stratics-wrap table[bgcolor="#800000"] td {
  background: linear-gradient(135deg, #3d2a02 0%, #1a1000 100%) !important;
  color: #ffdf6a !important;
  font-family: 'Cinzel Decorative', serif !important;
  font-size: 0.86rem !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  text-align: center;
  border-color: rgba(212, 175, 55, 0.5) !important;
  padding: 0.48rem 0.6rem;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8);
}

/* -- Column Header & Subheading Rows (bold titles) ----------- */
.stratics-wrap table[border="1"] tr:first-child:not(:has(td[bgcolor])) td,
.stratics-wrap table[border="1"] td b,
.stratics-wrap table[border="1"] th b,
.stratics-wrap table[border="1"] th {
  color: #d4af37 !important;
  font-family: 'Cardo', serif !important;
  letter-spacing: 0.02em;
}

/* -- Grey / Light notes & disclaimer blocks (#c0c0c0, #dddddd) */
.stratics-wrap td[bgcolor="#c0c0c0"],
.stratics-wrap td[bgcolor="#C0C0C0"],
.stratics-wrap td[bgcolor="c0c0c0"],
.stratics-wrap td[bgcolor="#dddddd"],
.stratics-wrap td[bgcolor="#DDDDDD"],
.stratics-wrap td[bgcolor="dddddd"],
.stratics-wrap tr[bgcolor="#c0c0c0"] td,
.stratics-wrap tr[bgcolor="#dddddd"] td,
.stratics-wrap tr[bgcolor="#DDDDDD"] td {
  background: rgba(0, 24, 8, 0.7) !important;
  border-top: 1px solid rgba(212, 175, 55, 0.3) !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.3) !important;
  color: #9ec99a !important;
  font-size: 0.82rem !important;
  font-style: italic;
  line-height: 1.45;
}

.stratics-wrap td[bgcolor="#c0c0c0"] font,
.stratics-wrap td[bgcolor="#C0C0C0"] font,
.stratics-wrap td[bgcolor="#dddddd"] font,
.stratics-wrap td[bgcolor="#DDDDDD"] font {
  color: #9ec99a !important;
  font-size: 0.82rem !important;
  font-style: italic;
}

/* -- Yellow highlight rows (formerly #ffffcc, #ffffc0) ------- */
.stratics-wrap td[bgcolor="#FFFFC0"],
.stratics-wrap td[bgcolor="#ffffc0"],
.stratics-wrap td[bgcolor="#FFFFCC"],
.stratics-wrap td[bgcolor="#ffffcc"],
.stratics-wrap tr[bgcolor="#FFFFCC"] td,
.stratics-wrap tr[bgcolor="#ffffcc"] td {
  background: rgba(25, 28, 4, 0.75) !important;
  border-top: 1px solid rgba(212, 175, 55, 0.35) !important;
  color: #e8d89a !important;
  font-size: 0.83rem !important;
  line-height: 1.45;
}

.stratics-wrap td[bgcolor="#FFFFC0"] font,
.stratics-wrap td[bgcolor="#ffffc0"] font,
.stratics-wrap td[bgcolor="#FFFFCC"] font,
.stratics-wrap td[bgcolor="#ffffcc"] font {
  color: #e8d89a !important;
  font-size: 0.83rem !important;
}

/* -- Alternating regular data rows --------------------------- */
.stratics-wrap table[border="1"] tr:not(:has(td[bgcolor])):nth-child(even) td,
.stratics-wrap table[border="2"] tr:not(:has(td[bgcolor])):nth-child(even) td {
  background: rgba(3, 22, 12, 0.82);
}
.stratics-wrap table[border="1"] tr:not(:has(td[bgcolor])):nth-child(odd) td,
.stratics-wrap table[border="2"] tr:not(:has(td[bgcolor])):nth-child(odd) td {
  background: rgba(0, 12, 4, 0.65);
}

/* Row hover highlight */
.stratics-wrap table[border="1"] tr:not(:has(td[bgcolor])):hover td,
.stratics-wrap table[border="2"] tr:not(:has(td[bgcolor])):hover td {
  background: rgba(15, 45, 20, 0.92) !important;
  border-color: #d4af37 !important;
}

/* -- All Links inside Stratics content ----------------------- */
.stratics-wrap a,
.stratics-wrap a:visited {
  color: #d4af37 !important;
  text-decoration: none;
  transition: color 0.15s ease;
}
.stratics-wrap a:hover,
.stratics-wrap a:focus {
  color: #ffe87a !important;
  text-decoration: underline;
}

/* -- Legacy font color attribute overrides ------------------- */
.stratics-wrap font[color="#800000"],
.stratics-wrap font[color="800000"],
.stratics-wrap font[color="Maroon"],
.stratics-wrap font[color="maroon"] {
  color: #d4af37 !important;
}

.stratics-wrap font[color="#000000"],
.stratics-wrap font[color="000000"],
.stratics-wrap font[color="black"] {
  color: #e5f5e0 !important;
}

.stratics-wrap font[color="#ffffcc"],
.stratics-wrap font[color="#FFFFCC"],
.stratics-wrap font[color="#ffffc0"],
.stratics-wrap font[color="#FFFFC0"],
.stratics-wrap font[color="ffffcc"] {
  color: #ffdf6a !important;
}

.stratics-wrap font[color="#c0c0c0"],
.stratics-wrap font[color="#C0C0C0"],
.stratics-wrap font[color="#dddddd"],
.stratics-wrap font[color="#DDDDDD"] {
  color: #9ec99a !important;
}

.stratics-wrap font {
  color: inherit;
}

/* -- Form Inputs (e.g. Resist Calculator) -------------------- */
.stratics-wrap input[type="text"],
.stratics-wrap input:not([type]),
.stratics-wrap select {
  background: rgba(0, 16, 6, 0.85) !important;
  border: 1px solid rgba(212, 175, 55, 0.45) !important;
  color: #ffdf6a !important;
  border-radius: 4px;
  padding: 3px 6px;
  font-family: 'Cardo', serif !important;
  font-size: 0.9rem;
}

.stratics-wrap input:focus,
.stratics-wrap select:focus {
  outline: none;
  border-color: #ffd700 !important;
  box-shadow: 0 0 8px rgba(255, 215, 0, 0.35);
}

.stratics-wrap select option {
  background: #020e06;
  color: #ffdf6a;
}

/* -- Responsive: horizontal scroll on mobile ---------------- */
@media (max-width: 768px) {
  .stratics-wrap {
    padding: 1rem 0.6rem 2rem 0.6rem;
  }
  
  .stratics-wrap table[border="1"],
  .stratics-wrap table[border="2"],
  .stratics-wrap table[bgcolor] {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .stratics-wrap table[border="0"] {
    border-radius: 8px !important;
    overflow-x: auto;
  }
}