/**
 * Campaign Styles for campaign #225345
 */

/** Style Dark-Self#3553 */
:root {
  --background-image: url(https://media.discordapp.net/attachments/1176077975452663869/1194039313957146804/blackgoat8080_background_image_dark_night_a_fantasy_plain_river_f8b1bb09-35db-4b8e-9f77-bae6c1fdfb39.png?ex=65aee6c4&is=659c71c4&hm=07cdf94b94a526ab6e909797c3f2025cc5e73201a0c7d36b15898343e37c4201&=&format=webp&quality=lossless&width=1325&height=662);
}

.wrapper {
  background: var(--background-image) !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-position: top !important;
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -o-background-size: cover !important;
  background-size: cover !important;
}

body {
  background-color: #070912;
  color: #e8e2d4;
  font-size: 15px;
  font-family: Arial, sans-serif; /* Fallback for sans-serif */
  color:rgb(102,102,102);
}

a {
  color: #a0978b;
  text-decoration: none;
}

a:hover {
  color: #d6d0c7;
}
.sidebar {
 background-image: linear-gradient(to bottom left, rgba(0,0,0,0.9) , rgba(73,1,63,0.9));
}
/* Navigation */

.navbar {
  background-color: #1f2933;
  border-bottom: 1px solid #333c45;
}

.navbar a {
  color: #a0978b;
}

.navbar a.active {
  color: #e8e2d4;
}

/* Cards */

.card {
  background-color: #27313b;
  border: 1px solid #333c45;
  border-radius: 4px;
  padding: 15px;
}

.card h3 {
  color: #e8e2d4;
  font-weight: bold;
}

/* Headers */

h1 {
  color: #BB86FC;
  font-weight: bold;
  font-size: 20px;
}

h2 {
  color: #BB86FC;
  font-weight: bold;
  font-size: 18px;
}

/* Buttons */

button {
  background-color: #1f2933;
  border: 1px solid #333c45;
  color: #BB86FC;
  padding: 5px 10px;
  border-radius: 4px;
  cursor: pointer;
}

button:hover {
  background-color: #27313b;
}

/* Forms and inputs */

input, textarea {
  background-color: #27313b;
  border: 1px solid #333c45;
  color: #e8e2d4;
  padding: 5px;
  border-radius: 4px;
}

input::placeholder {
  color: #a0978b;
}

input:focus {
  border-color: #d6d0c7;
}

/* Additional styles */

.alert-success {
  background-color: #38a3a5;
  color: #fff;
}

.alert-warning {
  background-color: #ffc107;
  color: #fff;
}

li.subsection.section-game {
    display: none
}

.main-footer {
  backgrond-color: transparent;
  color: transparent;
}

.main-footer a {
  backgrond-color: transparent;
  color: transparent;
}


body {
  color: #ffffff; /* White text for contrast */
  font-family: 'Cardo', 'Georgia', serif; /* You can choose a fantasy-themed font if available */
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Alegreya SC', serif; /* Elegant serif font for headers */
}

h1 {
  font-size: 2em;
}

h2 {
  font-size: 1.8em;
}

h3 {
  font-size: 1.5em;
}

p {
  font-size: 1em;
  line-height: 1.5;
  margin-bottom: 1.6px;
  margin-top: 1.6px;
  color: #f5f8ff;
  font-family: Arial, sans-serif; /* Fallback for sans-serif */
  width: 99% !important; /* Stop overflow? */
}

li {
  width: 99% !important;
}

blockquote{
  font-size: 0.8em;
  line-height: 1.2;
  margin-bottom: 1.6px;
  margin-top: 1.6px;
  background-color: rgba(53,1,43);
}

a {
  color: #9c27b0; /* Link color, you can adjust to fit the theme */
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: #ffc107; /* Change color on hover */
}

/* Table Styles */
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: auto;
  margin-bottom: 1.5rem;
  font-size: 1rem;
  color: #f5e3cc; /* Light cream text for contrast */
  
}

th {
  background-color: #222222; /* Deep black header background */
  color: #f5e3cc; /* Light cream text for contrast */
  padding: 10px 15px;
  text-align: left;
  border-bottom: 3px solid #995500; /* Rustic orange border */
}

td {
  padding: 10px 15px;
  border-bottom: 3px solid #995500; /* Dark brown cell border */
}

/* Enhanced Styles for Dark Background */
tbody tr:nth-child(odd) {
  background-color: #333333; /* Slightly darker shade for odd rows */
}

.scroll-table {
  border: 2px solid #995500; /* Rustic orange border around scrollable region */
}

.table-bordered {
  border: 3px solid #995500; /* Rustic orange border for entire table */
}

/* EDITING COLOR BACKSTORY */
.editor-only {
color: #FFFF00
}

/* Hiding Tabs: [MANAGMENT (members, roles) / OTHER (connections)] */

.section-management {
  display: none;
}
.section-other {
  display: none;
}

.entity-history {
  display: none;
}

sidebar-section-box {
 display: none;
}

div[title="Backstory Template"] {
  display: none;
  border: 5px solid yellow;
}

/* Headings */
h1, h2, h3 {
  color: #BB86FC; /* Dark readable text */
  margin-bottom: 1rem;
}

h4, h5, h6 {
  color: rgb(30, 144, 255); /* Replace with your chosen light blue color */
  margin-bottom: 1rem;
}

/* COLLAPSING TABLE OF CONTENT FOR POSTS */

.expandable {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    background-color: #1e1e1e;
    margin-top: 5px;
    position: relative;
    border-radius: 5px;
    padding: 0 10px;
}

.expandable:target {
    max-height: 1000px; /* Adjust based on content */
    padding: 10px;
}

.toggle-link {
    color: #e0e0e0;
    padding: 10px;
    cursor: pointer;
    border: none;
    border-radius: 5px;
    display: inline-block;
    text-decoration: none;
    transition: background-color 0.3s ease;
  	color: #666666;
  	font-size: 21px;
  	font-family: Arial, sans-serif; /* Fallback for sans-serif */ 
}

.toggle-link:hover {
    background-color: #555;
}

.close-link {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #333;
    color: #e0e0e0;
    padding: 5px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.close-link:hover {
    background-color: #333;
}