/* ================== TEME CULOARE ================== */
:root {
 --bg: #f5f5f5;
 --card: #ffffff;
 --text: #111;
 --accent: #e74c3c;
 --accent-dark: #b71c1c;
 --border: #ddd;
}

body.darkblue {
 --bg: #050816;
 --card: #0f172a;
 --text: #e5e7eb;
 --accent: #2563eb;
 --accent-dark: #1d4ed8;
 --border: #1f2937;
}

body.modern {
 --bg: #050816;
 --card: #111827;
 --text: #e5e7eb;
 --accent: #8b5cf6;
 --accent-dark: #7c3aed;
 --border: #1f2937;
}

/* ================== RESET ================== */
* {margin:0; padding:0; box-sizing:border-box;}
body {
 font-family:'Roboto', sans-serif;
 background:var(--bg);
 color:var(--text);
 line-height:1.5;
}
a {text-decoration:none; color:var(--accent);}
.container {max-width:1200px; margin:0 auto; padding:10px;}

/* ================== HEADER (NU E FIX) ================== */
header {
 position:relative;
 margin-top:10px; /* loc pentru bara uCoz de sus */
 width:100%;
 max-width:1200px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:15px;
 background:var(--card);
 padding:10px 20px;
 box-shadow:0 2px 10px rgba(0,0,0,0.1);
 border-radius:10px;
 border-bottom:3px solid var(--accent);
}
#logo img {height:60px;}

header nav ul {
 display:flex;
 list-style:none;
 gap:10px;
 flex-wrap:wrap;
}
header nav ul li a {
 display:block;
 padding:8px 12px;
 border-radius:5px;
 color:var(--text);
 transition:0.2s;
 font-size:14px;
}
header nav ul li a:hover {
 background:var(--accent);
 color:#fff;
}
header nav ul li a.active {
 background:var(--accent);
 color:#fff;
}

/* Switch temă */
#theme-switcher select {
 padding:6px 10px;
 border-radius:6px;
 border:1px solid var(--border);
 background:var(--card);
 color:var(--text);
 font-size:13px;
}

/* ================== LAYOUT PRINCIPAL ================== */
.main-content {
 display:flex;
 gap:20px;
 margin-top:20px;
}
.content {
 flex:3;
 display:flex;
 flex-direction:column;
 gap:30px;
}
.sidebar {
 flex:1;
 display:flex;
 flex-direction:column;
 gap:20px;
}


/* ================== FILMUL ZILEI ================== */
.hero {
 background:#000;
 color:#fff;
 border-radius:12px;
 overflow:hidden;
 display:flex;
 flex-wrap:wrap;
 gap:20px;
 padding:15px;
}
.hero img {
 border-radius:12px;
 max-width:300px;
 width:100%;
}
.hero .details {
 flex:1;
 min-width:200px;
}
.hero .details h1 {
 color:var(--accent);
 margin-bottom:10px;
}
.hero .details p {
 margin-bottom:15px;
}
.hero .details button {
 padding:10px 20px;
 background:var(--accent);
 color:#fff;
 border:none;
 border-radius:8px;
 cursor:pointer;
 font-weight:bold;
 transition:0.2s;
}
.hero .details button:hover {
 background:var(--accent-dark);
}


/* GRID PENTRU STRUCTURA uCOZ CU #allEntries */
.film-grid {
 width: 100%;
}

#allEntries {
 display: flex;
 flex-wrap: wrap;
 gap: 16px;
}

/* fiecare film */
#allEntries > div[id^="entryID"] {
 width: calc(25% - 12px);
}

/* TABLET */
@media (max-width: 992px) {
 #allEntries > div[id^="entryID"] {
 width: calc(50% - 12px);
 }
}

/* MOBIL */
@media (max-width: 600px) {
 #allEntries > div[id^="entryID"] {
 width: 100%;
 }
}

/* Ca sa nu se mai lățească prost poza */
#allEntries > div[id^="entryID"] .film-card {
 width: 100%;
}




/* ================== RESPONSIVE GENERAL ================== */
@media(max-width:768px) {
 header {
 flex-wrap: wrap;
 justify-content: center;
 gap: 10px;
 }

 .main-content {
 flex-direction: column;
 }

 .hero {
 flex-direction: column;
 align-items: center;
 }

 .hero img {
 max-width: 100%;
 }
}



/* ================== CARD FILM CU PLAY ================== */

.film-card {
 position: relative;
 width: 100%;
 height: 320px;
 border-radius: 14px;
 overflow: hidden;
 background: #000;
 box-shadow: 0 8px 20px rgba(0,0,0,0.25);
 transition: 0.3s ease;
}


.film-card:hover {
 transform: translateY(-6px) scale(1.02);
}

/* Imagine */
.film-card img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
}



/* Overlay transparent jos */
.film-overlay {
 position: absolute;
 bottom: 0;
 width: 100%;
 padding: 12px;
 background: linear-gradient(to top, rgba(0,0,0,0.9), transparent);
 color: #fff;
 text-align: left;
}

/* Titlu */
.film-title {
 font-size: 14px;
 font-weight: bold;
}

/* Meta info */
.film-meta {
 font-size: 12px;
 margin-top: 4px;
 color: #ccc;
}

.film-meta a {
 color: var(--accent);
 font-weight: bold;
 text-decoration: none;
}

/* Buton Play fix */
.play-icon {
 position: absolute;
 top: 50%;
 left: 50%;
 width: 60px;
 height: 60px;
 background: rgba(0,0,0,0.7);
 border-radius: 50%;
 transform: translate(-50%, -50%) scale(0.8);
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 26px;
 color: white;
 opacity: 0;
 transition: 0.3s ease;
}

.film-card:hover .play-icon {
 opacity: 1;
 transform: translate(-50%, -50%) scale(1);
}

.badge-new {
 position: absolute;
 top: 12px;
 right: 12px;

 padding: 6px 14px;
 background: linear-gradient(135deg, #ff2a2a, #ff6a00);
 color: #fff;

 font-size: 12px;
 font-weight: bold;
 border-radius: 999px;

 box-shadow: 0 0 12px rgba(255, 100, 0, 0.8);
 z-index: 10;

 animation: pulseNew 1.5s infinite;
}

/* Animație pulse */
@keyframes pulseNew {
 0% {
 transform: scale(1);
 box-shadow: 0 0 8px rgba(255, 100, 0, 0.8);
 }
 50% {
 transform: scale(1.1);
 box-shadow: 0 0 16px rgba(255, 150, 0, 1);
 }
 100% {
 transform: scale(1);
 box-shadow: 0 0 8px rgba(255, 100, 0, 0.8);
 }
}


/* Fix pe mobil */
@media(max-width:768px) {
 .film-card { height: 260px; }
}




/* ================== SIDEBAR ================== */
.sidebar .block {
 background:var(--card);
 padding:15px;
 border-radius:12px;
 box-shadow:0 2px 8px rgba(0,0,0,0.1);
}
.sidebar .block h3 {
 color:var(--accent);
 margin-bottom:10px;
}
.sidebar .user-profile {
 display:flex;
 align-items:center;
 gap:10px;
 margin-top:10px;
}
.sidebar .user-profile img {
 width:50px;
 height:50px;
 border-radius:50%;
}

/* ================== FOOTER ================== */
footer {
 margin-top:40px;
 padding:15px;
 background:var(--card);
 text-align:center;
 color:#555;
 border-radius:12px;
 font-size:13px;
 box-shadow:0 2px 8px rgba(0,0,0,0.1);
}

.film-link {
 display: block;
 width: 100%;
 height: 100%;
}

.film-title a {
 color: #fff;
 text-decoration: none;
}

.film-title a:hover {
 text-decoration: none;
}




/* ================== FILMUL ZILEI MODERN ================== */

.hero-cinema {
 position: relative;
 height: 360px;
 border-radius: 16px;
 overflow: hidden;
 margin-bottom: 20px;
}

.hero-video-wrapper {
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 overflow: hidden;
 z-index: 0;
}

.hero-video-wrapper iframe {
 width: 120%;
 height: 120%;
 position: absolute;
 top: -10%;
 left: -10%;
 pointer-events: none; /* să nu poți da click pe el */
 transform: scale(1.2);
}

.hero-blur {
 position: absolute;
 inset: 0;
 background: linear-gradient(to right,
 rgba(0,0,0,0.9),
 rgba(0,0,0,0.5),
 rgba(0,0,0,0.1));
 backdrop-filter: blur(3px);
 z-index: 1;
}

.hero-content {
 position: absolute;
 bottom: 25px;
 left: 25px;
 z-index: 2;
 max-width: 480px;
 color: white;
}

.hero-tag {
 background: var(--accent);
 padding: 5px 12px;
 border-radius: 50px;
 font-size: 12px;
 font-weight: bold;
}

.hero-content h1 {
 margin: 12px 0 5px;
 font-size: 30px;
}

.hero-content p {
 font-size: 14px;
 opacity: 0.9;
}

.hero-buttons {
 margin-top: 14px;
 display: flex;
 gap: 12px;
}

.btn-watch, .btn-trailer {
 padding: 10px 18px;
 border-radius: 10px;
 font-weight: bold;
 cursor: pointer;
 transition: 0.3s;
}

.btn-watch {
 background: var(--accent);
 color: #fff;
}

.btn-watch:hover {
 transform: scale(1.05);
}

.btn-trailer {
 background: rgba(255,255,255,0.15);
 border: 1px solid #fff;
 color: #fff;
}

.btn-trailer:hover {
 background: rgba(255,255,255,0.3);
}

/* MODAL */
.trailer-modal {
 display: none;
 position: fixed;
 inset: 0;
 background: rgba(0,0,0,0.75);
 backdrop-filter: blur(10px);
 z-index: 99999;
 justify-content: center;
 align-items: center;
}

.trailer-modal iframe {
 width: 90%;
 height: 90%;
 border-radius: 16px;
 border: none;
}

.trailer-close {
 position: absolute;
 top: 15px;
 right: 25px;
 font-size: 32px;
 color: white;
 cursor: pointer;
 z-index: 999999;
}

@media(max-width:768px) {
 .hero-cinema {
 height: 240px;
 }

 .hero-content h1 {
 font-size: 20px;
 }
}



/* ================== PROFIL UTILIZATOR ================== */
.user-profile-pro {
 background: var(--card);
 border-radius: 16px;
 padding: 15px;
 text-align: center;
 border: 1px solid var(--border);
}

.user-banner-pro {
 height: 90px;
 border-radius: 14px;
 background: linear-gradient(-45deg, var(--accent), #111827, var(--accent-dark));
 background-size: 400% 400%;
 animation: bannerMove 8s infinite;
}

@keyframes bannerMove {
 0%{background-position:0% 50%}
 50%{background-position:100% 50%}
 100%{background-position:0% 50%}
}


/* ================== RANK SYSTEM CINEMA ================== */

.user-avatar-pro { 
 position: relative;
 width: max-content;
 margin: -45px auto 0;
 overflow: visible; /* foarte important pt glow */
}


/* Avatar */
.user-avatar-pro img {
 width: 90px;
 height: 90px;
 border-radius: 50%;
 background: #000;
 border: 3px solid transparent !important;
 z-index: 2;
 position: relative;
}


/* ================= GLOW PER GRUP ================= */

/* ADMIN */
.admin-glow img {
 border: 3px solid gold !important;
 box-shadow:
 0 0 10px gold,
 0 0 25px #ffae00,
 0 0 40px #ffae00 !important;
 animation: adminPulse 2s infinite;
}

@keyframes adminPulse {
 0% { box-shadow: 0 0 5px gold; }
 50% { box-shadow: 0 0 25px gold, 0 0 50px #ffae00; }
 100% { box-shadow: 0 0 5px gold; }
}

/* MODERATOR */
.mod-glow img {
 border: 3px solid #3b82f6 !important;
 box-shadow: 0 0 15px #3b82f6 !important;
}

/* VIP */
.vip-glow img {
 border: 3px solid #a855f7 !important;
 box-shadow:
 0 0 15px #a855f7,
 0 0 30px #a855f7 !important;
 animation: vipPulse 2s infinite;
}

@keyframes vipPulse {
 0% { box-shadow: 0 0 10px #a855f7; }
 50% { box-shadow: 0 0 25px #a855f7, 0 0 50px #a855f7; }
 100% { box-shadow: 0 0 10px #a855f7; }
}

/* USER normal */
.user-glow img {
 border: 3px solid var(--accent);
 box-shadow: 0 0 10px var(--accent);
}

/* VERIFICAT */
.verified-glow img {
 border: 3px solid #22c55e;
 box-shadow: 0 0 15px #22c55e;
}

/* PRIETEN */
.friend-glow img {
 border: 3px solid #facc15;
 box-shadow: 0 0 15px #facc15;
}

/* BLOCAT */
.blocked-glow img {
 border: 3px solid #ef4444;
 box-shadow: 0 0 15px #ef4444;
 filter: grayscale(1) brightness(0.7);
}



/* ================= BADGE-URI ================= */

.user-rank {
 position: absolute;
 bottom: -10px;
 left: 50%;
 transform: translateX(-50%);
 padding: 4px 14px;
 border-radius: 20px;
 font-size: 11px;
 font-weight: bold;
 z-index: 3;
 white-space: nowrap;
 text-shadow: 0 1px 3px black;
}

/* Culori badge */
.user-rank.admin {
 background: linear-gradient(135deg, gold, #ffae00);
 color: black;
 box-shadow: 0 0 15px gold;
}

.user-rank.mod {
 background: linear-gradient(135deg, #3b82f6, #1d4ed8);
 color: white;
 box-shadow: 0 0 12px #3b82f6;
}

.user-rank.vip {
 background: linear-gradient(135deg, #a855f7, #6d28d9);
 color: white;
 box-shadow: 0 0 12px #a855f7;
}

.user-rank.user {
 background: linear-gradient(135deg, var(--accent), var(--accent-dark));
 color: white;
}

.user-rank.verified {
 background: linear-gradient(135deg, #22c55e, #15803d);
 color: white;
}

.user-rank.friend {
 background: linear-gradient(135deg, #facc15, #ca8a04);
 color: black;
}

.user-rank.blocked {
 background: #991b1b;
 color: white;
}





.user-info-pro { margin-top: 12px; }

.user-status-pro {
 font-size: 12px;
 color: var(--accent);
 display: block;
}

/* Stats */
.user-stats-pro {
 display: flex;
 justify-content: space-around;
 margin-top: 12px;
 padding: 10px 0;
 border-top: 1px solid var(--border);
 border-bottom: 1px solid var(--border);
}

.user-stats-pro div span {
 font-size: 11px;
 color: #999;
}

/* Nivel */
.user-level-box { margin: 12px 0; }

.user-progress-bar {
 height: 6px;
 background: #222;
 border-radius: 999px;
 overflow: hidden;
 margin-top: 4px;
}

.user-progress-fill {
 height: 100%;
 background: linear-gradient(to right, gold, var(--accent));
 transition: width 1s;
}

/* Butoane */
.user-actions-pro a {
 display: block;
 margin-top: 6px;
 padding: 7px;
 border-radius: 8px;
 background: var(--bg);
 color: var(--text);
 border: 1px solid var(--border);
 transition: 0.3s;
}

.user-actions-pro a:hover {
 background: var(--accent);
 color: white;
}

.logout-pro { background:#721c24; color:white; }





/* ================== LOGIN CINEMA VEZIHD ================== */

.cinema-login-box {
 background: var(--card);
 border: 1px solid var(--border);
 border-radius: 18px;
 padding: 18px;
 box-shadow: 0 15px 40px rgba(0,0,0,0.5);
 position: relative;
 overflow:hidden;
 animation: cinemaIntro 0.6s ease;
}

@keyframes cinemaIntro {
 from { transform: scale(0.92); opacity:0; }
 to { transform: scale(1); opacity:1; }
}

.cinema-login-header {
 display:flex;
 justify-content: space-between;
 align-items:center;
 margin-bottom: 12px;
}

.cinema-title {
 font-size: 18px;
 font-weight: bold;
 letter-spacing: 1px;
 color: var(--accent);
}

.cinema-close {
 background:none;
 border:none;
 font-size:16px;
 cursor:pointer;
 color: var(--text);
 transition: 0.3s;
}

.cinema-close:hover {
 transform: rotate(90deg);
 color: var(--accent);
}

.cinema-group {
 margin-bottom: 12px;
}

.cinema-group label {
 font-size: 12px;
 color: var(--accent);
 margin-bottom: 4px;
 display:block;
}

.cinema-group input {
 width: 100%;
 padding: 10px;
 border-radius: 10px;
 border: 1px solid var(--border);
 background: var(--bg);
 color: var(--text);
 transition: 0.3s;
}

.cinema-group input:focus {
 border-color: var(--accent);
 box-shadow: 0 0 10px var(--accent);
 outline: none;
}

.cinema-forgot {
 font-size: 11px;
 text-align:right;
 display:block;
 margin-top: 4px;
 color: var(--accent);
}


/* BUTOANE */
.cinema-actions {
 display:grid;
 grid-template-columns: 1fr 1fr;
 gap: 8px;
 margin-top: 10px;
}

.cinema-btn-login {
 background: linear-gradient(135deg, var(--accent), var(--accent-dark));
 border: none;
 padding: 10px;
 border-radius: 12px;
 color: white;
 font-weight: bold;
 cursor:pointer;
 transition: 0.3s;
}

.cinema-btn-register {
 background: transparent;
 border: 1px solid var(--accent);
 padding: 10px;
 border-radius: 12px;
 color: var(--accent);
 cursor:pointer;
 font-weight:bold;
 transition: 0.3s;
}

.cinema-btn-login:hover,
.cinema-btn-register:hover {
 transform: scale(1.05);
 box-shadow: 0 0 15px var(--accent);
}

/* CHECKBOX */
.cinema-check {
 margin-top: 8px;
 display:flex;
 align-items:center;
 gap: 6px;
 font-size: 12px;
}

/* ERROR */
.cinema-error {
 background: rgba(255,0,0,0.15);
 color: #ff6b6b;
 padding: 8px;
 border-radius: 8px;
 text-align:center;
 margin-bottom: 10px;
 font-size: 12px;
}

/* Buton închidere */
.cinema-close {
 background:none;
 border:none;
 color:white;
 font-size:14px;
 cursor:pointer;
 transition:0.3s;
}

.cinema-close:hover {
 transform: rotate(90deg) scale(1.1);
}

/* Grup input */
.cinema-group {
 display:flex;
 flex-direction:column;
 margin-bottom:12px;
}

.cinema-group label {
 font-size:12px;
 color: var(--accent);
 margin-bottom: 4px;
}

.cinema-group input {
 padding: 10px 12px;
 border-radius: 10px;
 border:1px solid var(--border);
 background: var(--bg);
 color: var(--text);
 transition: 0.2s;
}

.cinema-group input:focus {
 border-color: var(--accent);
 outline:none;
 box-shadow: 0 0 10px var(--accent);
}

/* Ai uitat parola */
.cinema-forgot {
 font-size:11px;
 margin-top:4px;
 color: var(--accent);
 text-align:right;
}

/* Zona butoane */
.cinema-actions {
 display:flex;
 flex-direction:column;
 gap:8px;
 margin-top:10px;
}

/* Buton login */
.cinema-btn {
 padding:10px;
 border-radius:10px;
 border:none;
 cursor:pointer;
 background: linear-gradient(135deg, var(--accent), var(--accent-dark));
 color:white;
 font-weight:bold;
 transition:0.3s;
}

.cinema-btn:hover {
 transform: scale(1.03);
 box-shadow:0 0 15px var(--accent);
}

/* Remember me */
.cinema-check {
 font-size:12px;
 display:flex;
 align-items:center;
 gap:6px;
}

/* Register box */
.cinema-register {
 margin-top: 12px;
 text-align:center;
 font-size:12px;
}

.cinema-register a {
 color: var(--accent);
 font-weight:bold;
}

/* Erori */
.cinema-error {
 background: rgba(255,0,0,0.15);
 color: #ff6666;
 padding:8px;
 border-radius:8px;
 text-align:center;
 margin-bottom:10px;
 font-size:12px;
}






/* ============ CHAT CINEMA FORM ============ */

.cinema-chat-form {
 background: linear-gradient(180deg, rgba(0,0,0,0.9), #050816);
 padding: 12px;
 border-radius: 14px;
 border: 1px solid var(--border);
 box-shadow: 0 10px 30px rgba(0,0,0,0.4);
 display: flex;
 flex-direction: column;
 gap: 10px;
}

/* Toolbar */
.cinema-chat-toolbar {
 display: flex;
 justify-content: space-between;
 align-items: center;
}

.chat-left {
 font-size: 12px;
}

.chat-right {
 display: flex;
 gap: 8px;
}

.chat-btn {
 background: var(--card);
 padding: 4px 8px;
 border-radius: 6px;
 border: 1px solid var(--border);
 color: var(--accent);
 font-size: 14px;
 transition: 0.25s;
}

.chat-btn:hover {
 background: var(--accent);
 color: white;
 transform: scale(1.1);
}

/* Guest fields */
.cinema-guest-fields {
 display: flex;
 flex-direction: column;
 gap: 6px;
}

.cinema-guest-fields input {
 padding: 6px;
 border-radius: 6px;
 border: 1px solid var(--border);
 background: var(--bg);
 color: var(--text);
}

/* Custom fields */
.cinema-custom-fields {
 display: flex;
 gap: 8px;
}

/* Secure captcha */
.cinema-secure-box {
 display: flex;
 justify-content: space-between;
 align-items: center;
}

/* Message box */
.cinema-message-box textarea {
 width: 100%;
 min-height: 70px;
 resize: none;
 background: #0f172a;
 color: white;
 border-radius: 10px;
 border: 1px solid var(--border);
 padding: 6px;
 outline: none;
}

/* Footer */
.cinema-chat-footer {
 display: flex;
 justify-content: space-between;
 align-items: center;
}

/* Contor caractere */
.chat-length {
 font-size: 11px;
 color: #aaa;
}

/* Buton send */
.chat-send input {
 padding: 6px 12px;
 border-radius: 10px;
 background: linear-gradient(135deg, var(--accent), var(--accent-dark));
 color: white;
 border: none;
 font-weight: bold;
 cursor: pointer;
 transition: 0.3s;
}

.chat-send input:hover {
 transform: scale(1.05);
 box-shadow: 0 0 15px var(--accent);
}

/* Login needed */
.chat-login-needed {
 text-align: center;
 padding: 12px;
 background: rgba(255,0,0,0.05);
 border: 1px solid rgba(255,0,0,0.2);
 border-radius: 10px;
 margin: 10px 0;
}

.chat-login-needed a {
 color: var(--accent);
 font-weight: bold;
 text-decoration: none;
}



/* ================== ALERT CINEMA ================== */
.vezihd-alert {
 display: flex;
 align-items: center;
 gap: 12px;
 padding: 12px 15px;
 margin: 0px 0;

 background: linear-gradient(135deg, #111, #1a1a1a);
 border-left: 4px solid var(--accent);
 border-radius: 10px;

 box-shadow: 0 0 15px rgba(0,0,0,0.5);
 animation: alertPulse 3s infinite;
}

/* icon stânga */
.alert-icon {
 font-size: 24px;
 animation: shake 2.5s infinite;
}

/* text */
.alert-content {
 color: #eee;
 font-size: 13px;
 line-height: 1.4;
}

.alert-title {
 font-size: 14px;
 font-weight: bold;
 color: var(--accent);
 margin-bottom: 3px;
}

/* browsere colorate */
.browser {
 font-weight: bold;
 padding: 2px 6px;
 border-radius: 6px;
 margin: 0 2px;
}

.firefox {
 color: #ff6a00;
}

.opera {
 color: #ff2a2a;
}

.chrome {
 color: #4ade80;
}

.ie {
 color: #60a5fa;
}

/* animații ușoare */
@keyframes alertPulse {
 0% { box-shadow: 0 0 10px rgba(255,0,0,0.3); }
 50% { box-shadow: 0 0 18px rgba(255,0,0,0.6); }
 100% { box-shadow: 0 0 10px rgba(255,0,0,0.3); }
}

@keyframes shake {
 0% { transform: rotate(0deg); }
 5% { transform: rotate(8deg); }
 10% { transform: rotate(-8deg); }
 15% { transform: rotate(0deg); }
 100% { transform: rotate(0deg); }
}