/*
Modernized Theme for bs.to / cine.to
Clean, Dark, Streaming-Platform Aesthetic
*/

:root {
--bg-main: #0d0e12;
--bg-darker: #07080a;
--bg-card: #161820;
--bg-card-hover: #1e2230;
--accent-primary: #4facfe;
--accent-secondary: #00f2fe;
--text-main: #f1f3f5;
--text-muted: #9aa0a6;
--text-dark: #12131a;
--border-color: rgba(255, 255, 255, 0.06);
--radius-sm: 6px;
--radius-md: 10px;
--radius-lg: 16px;
--glow-effect: x0 4px 20px rgba(0, 242, 254, 0.15);
}

/* Global Reset & Body Background */
body {
background-color: var(--bg-main) !important;
color: var(--text-main) !important;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
letter-spacing: -0.01em;
}

/* Wrapper / Container */
#root, #wrapper, .container, #main {
background: transparent !important;
border: none !important;
box-shadow: none !important;
}

/* Header & Navigation Modernization */
header, #nav, .navigation, nav {
background-color: var(--bg-darker) !important;
border-bottom: 1px solid var(--border-color) !important;
padding: 15px 0 !important;
}

nav a, .nav-link {
color: var(--text-muted) !important;
font-weight: 500 !important;
transition: color 0.2s ease, text-shadow 0.2s ease;
}

nav a:hover, .nav-link:hover, nav a.active {
color: var(--accent-secondary) !important;
text-shadow: 0 0 10px rgba(0, 242, 254, 0.4);
}

/* Content Boxes & Cards (Zusammenfassungen, Serienbeschreibungen) */
.box, .card, .content-box, #content {
background-color: var(--bg-card) !important;
border: 1px solid var(--border-color) !important;
border-radius: var(--radius-md) !important;
padding: 20px !important;
box-shadow: 0 8px 24px rgba(0,0,0,0.2) !important;
}

/* Tables / Episode Lists (Schnittstelle zu den Streams) */
table, .table, .episodes, .series-list {
border-collapse: separate !important;
border-spacing: 0 6px !important;
width: 100% !important;
background: transparent !important;
}

th {
background: transparent !important;
color: var(--text-muted) !important;
text-transform: uppercase !important;
font-size: 0.75rem !important;
font-weight: 700 !important;
letter-spacing: 0.05em;
padding: 10px 15px !important;
border: none !important;
}

td {
background-color: var(--bg-card) !important;
padding: 12px 15px !important;
border-top: 1px solid var(--border-color) !important;
border-bottom: 1px solid var(--border-color) !important;
transition: background-color 0.2s ease;
}

td:first-child {
border-left: 1px solid var(--border-color) !important;
border-top-left-radius: var(--radius-sm) !important;
border-bottom-left-radius: var(--radius-sm) !important;
}

td:last-child {
border-right: 1px solid var(--border-color) !important;
border-top-right-radius: var(--radius-sm) !important;
border-bottom-right-radius: var(--radius-sm) !important;
}

tr:hover td {
background-color: var(--bg-card-hover) !important;
}

/* Links & Text Utilities */
a {
color: var(--accent-primary);
text-decoration: none !important;
transition: color 0.15s ease;
}

a:hover {
color: var(--accent-secondary);
}

/* Hoster Buttons / Stream Links */
.hoster-button, .stream-link, .btn, input[type="submit"], button {
background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary)) !important;
color: var(--text-dark) !important;
font-weight: 600 !important;
border: none !important;
border-radius: var(--radius-sm) !important;
padding: 10px 20px !important;
cursor: pointer !important;
transition: transform 0.2s ease, box-shadow 0.2s ease !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-shadow: 0 4px 12px rgba(79, 172, 254, 0.2) !important;
}

.hoster-button:hover, .stream-link:hover, .btn:hover, button:hover {
transform: translateY(-1px) !important;
box-shadow: 0 6px 20px rgba(0, 242, 254, 0.4) !important;
}

/* Inputs & Search Bar */
input[type="text"], input[type="search"], select, textarea {
background-color: var(--bg-darker) !important;
border: 1px solid var(--border-color) !important;
color: var(--text-main) !important;
border-radius: var(--radius-sm) !important;
padding: 10px 14px !important;
outline: none !important;
transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

input[type="text"]:focus, input[type="search"]:focus, select:focus {
border-color: var(--accent-secondary) !important;
box-shadow: 0 0 0 3px rgba(0, 242, 254, 0.15) !important;
}

/* Genre / Badges Tag Styles */
.badge, .genre, .tag {
background-color: rgba(255, 255, 255, 0.05) !important;
color: var(--text-muted) !important;
border: 1px solid var(--border-color) !important;
border-radius: 20px !important;
padding: 4px 12px !important;
font-size: 0.8rem !important;
font-weight: 500 !important;
}

/* Scrollbar Overrides */
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-track {
background: var(--bg-main);
}
::-webkit-scrollbar-thumb {
background: var(--bg-card);
border-radius: var(--radius-sm);
border: 2px solid var(--bg-main);
}
::-webkit-scrollbar-thumb:hover {
background: var(--border-color);
}