/* ============================================
   Art.Pauline.Rocks — Custom Dark Purple Theme
   ============================================ */

/* === BASE === */
html, body {
  background-color: #0f0a1f !important;
  color: #e9ddff !important;
}

/* === TYPOGRAPHY === */
h1, h2, h3, h4, h5, h6 {
  color: #d1b3ff !important;
  text-shadow: 1px 1px 4px rgba(139, 92, 246, 0.3);
}

p, li, td, th, span, div {
  color: #e9ddff;
}

/* === LINKS === */
a {
  color: #c59aff !important;
  text-decoration: none;
  position: relative;
  transition: all 0.3s ease;
}

a:visited {
  color: #a883ff !important;
}

a:hover {
  background: linear-gradient(
    270deg,
    #ff1900,
    #ff6f00,
    #fff700,
    #00ff80,
    #007bff,
    #c59aff,
    #ff1900
  ) !important;
  background-size: 600% 600% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: rainbow-shift 3s ease infinite !important;
}

@keyframes rainbow-shift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* === HEADER === */
header {
  background-color: #0a0618 !important;
  border-bottom: 2px solid rgba(197, 154, 255, 0.2) !important;
}

.header_left {
  overflow: hidden;
}

.header_right a {
  color: #c59aff !important;
}

/* === NAVIGATION BUTTONS === */
.navigation_button {
  background-color: #1a1333 !important;
  border-color: rgba(197, 154, 255, 0.25) !important;
  color: #d1b3ff !important;
  box-shadow: 0 0 6px rgba(139, 92, 246, 0.15) inset !important;
}

p.navigation_button {
  color: #8b7aaa !important;
}

/* === MEDIA THUMBNAILS === */
.media_thumbnail {
  background-color: #1a1333 !important;
  border-color: rgba(197, 154, 255, 0.2) !important;
  box-shadow: 0 0 8px rgba(139, 92, 246, 0.2) !important;
  transition: all 0.3s ease;
}

.media_thumbnail:hover {
  box-shadow: 0 0 16px rgba(197, 154, 255, 0.35) !important;
  border-color: rgba(197, 154, 255, 0.4) !important;
}

.media_thumbnail a {
  color: #d1b3ff !important;
}

/* === FORM BOXES === */
.form_box, .form_box_xl {
  background-color: #1a1333 !important;
  border-color: rgba(197, 154, 255, 0.2) !important;
}

input, textarea {
  background-color: #1a1333 !important;
  color: #e9ddff !important;
  border-color: rgba(197, 154, 255, 0.3) !important;
}

/* === BUTTONS === */
.button_action, .button_form {
  background-color: #1a1333 !important;
  color: #d1b3ff !important;
  border-color: rgba(197, 154, 255, 0.3) !important;
  box-shadow: 0 0 4px rgba(139, 92, 246, 0.2) inset !important;
}

.button_action_highlight, .button_form {
  background-color: #7c3aed !important;
  color: #fff !important;
  border-color: #9b6dff !important;
  box-shadow: 0 0 6px rgba(124, 58, 237, 0.4) inset !important;
}

.button_action_highlight:hover, .button_form:hover {
  background-color: #9b6dff !important;
}

/* === FOOTER === */
footer {
  border-top: 1px solid rgba(197, 154, 255, 0.2) !important;
  color: #8b7aaa !important;
}

/* === TABLES === */
table.admin_panel th {
  color: #d1b3ff !important;
}

/* === RAINBOW DIVIDER === */
footer::before,
header::after {
  content: "";
  display: block;
  width: 100%;
  height: 6px;
  background: linear-gradient(
    90deg,
    #ff1900, #ff6f00, #fff700, #00ff80, #007bff, #c59aff, #ff1900
  );
  background-size: 200% 100%;
  animation: rainbow-slide 4s linear infinite;
  border-radius: 3px;
}

@keyframes rainbow-slide {
  0%   { background-position: 0% 0; }
  100% { background-position: 200% 0; }
}

/* === EMPTY SPACE DOTS === */
.empty_space {
  background-image: none !important;
}

/* === MISC OVERRIDES === */
#code_of_conduct_list strong {
  color: #d1b3ff !important;
}

/* === SVG LOGO === */
.site-logo {
  display: block !important;
  text-decoration: none !important;
  padding: 10px 0;
}

.site-logo:hover {
  background: none !important;
  -webkit-text-fill-color: unset !important;
  animation: none !important;
}

.site-logo::after {
  display: none !important;
}

.site-logo svg {
  max-width: 100%;
  height: auto;
  filter: drop-shadow(0 0 4px rgba(197, 154, 255, 0.5));
  transition: filter 0.3s ease;
}

.site-logo:hover svg {
  filter: drop-shadow(0 0 8px rgba(197, 154, 255, 0.8))
          drop-shadow(0 0 20px rgba(139, 92, 246, 0.4));
}