/* ---- Import Google Fonts (se pune în la HTML) ---- */ /* */ /* ---- Branding, variabile globale, fonturi ---- */ :root { --primary: #191c23; --secondary: #ffcf4d; --background: #f8f8f8; --accent: #00BFAE; --text-main: #222; --radius: 8px; --font-main: 'Inter', Arial, sans-serif; } /* ---- Stiluri generale ---- */ body { margin: 0; font-family: var(--font-main); background: var(--background); color: var(--text-main); font-size: 17px; line-height: 1.6; } /* ---- Header/NAV/Logo ---- */ header, .navbar, .navbar-dark { width: 100%; background: var(--primary) !important; color: #fff; box-sizing: border-box; } .header-container, .navbar .container { display: flex; align-items: center; justify-content: space-between; padding: 0 24px; min-height: 64px; position: relative; } .logo-link, .navbar-brand { display: flex; align-items: center; height: 100%; text-decoration: none; color: #fff !important; font-weight: 600; font-size: 1.13em; letter-spacing: -0.03em; } .logo-link img, .navbar-brand img { height: 38px; width: auto; margin-right: 10px; } nav#mainMenu, .navbar-nav { display: flex; gap: 36px; align-items: center; } nav#mainMenu a, .navbar-nav .nav-link { color: #fff !important; text-decoration: none; font-size: 1.09em; padding: 6px 2px; transition: color 0.18s; border-radius: 3px; } nav#mainMenu a:hover, .navbar-nav .nav-link:hover { color: var(--secondary) !important; background: rgba(255,255,255,0.06); } /* ---- Butoane generale ---- */ .btn, button, input[type=submit] { font-family: var(--font-main); border-radius: var(--radius); border: none; padding: 9px 22px; background: var(--primary); color: #fff; cursor: pointer; font-size: 1em; transition: background .2s, color .2s; } .btn-primary, .btn-primary:focus, .btn-primary:active { background: var(--primary) !important; color: #fff !important; border: none; } .btn-outline-secondary { border: 2px solid var(--accent); color: var(--primary); background: #fff; } .btn-outline-secondary:hover { background: var(--accent); color: #fff !important; border: 2px solid var(--accent); } .btn:hover, button:hover, input[type=submit]:hover { background: var(--accent); color: #fff; } /* ---- Card general ---- */ .card { background: #fff; border-radius: var(--radius); box-shadow: 0 2px 8px #0001; padding: 22px; margin-bottom: 26px; } /* ---- Linkuri generale ---- */ a { color: var(--primary); text-decoration: none; transition: color .2s; } a:hover { color: var(--secondary); text-decoration: underline; } /* ---- Spațieri utilitare ---- */ .mt-2 { margin-top: 12px !important; } .mb-2 { margin-bottom: 12px !important; } .p-2 { padding: 12px !important; } .rounded { border-radius: var(--radius) !important; } .text-center { text-align: center !important; } /* ---- Responsive NAV ---- */ @media (max-width: 700px) { .header-container, .navbar .container { padding: 0 10px; min-height: 54px; } .logo-link img, .navbar-brand img { height: 28px; } .navbar-nav { gap: 14px; } } /* ---- Footer ---- */ footer { background: #191c23; color: #fff; padding: 30px 0 10px 0; text-align: center; font-size: 1em; } footer a { color: var(--secondary); } footer a:hover { color: var(--accent); } /* ---- Cookie Banner (custom, compatibil bootstrap) ---- */ #cookie-banner { font-size: 1.05em; box-shadow: 0 -2px 12px #0002; } /* ---- H-taguri, titluri, paragrafe ---- */ h1, h2, h3, h4, h5 { font-family: var(--font-main); font-weight: 700; color: var(--primary); letter-spacing: -0.01em; margin-top: 0.6em; margin-bottom: 0.5em; } h1 { font-size: 2.2em; } h2 { font-size: 1.6em; } h3 { font-size: 1.25em; } p { margin-bottom: 1em; } /* ---- Scrollbar personalizat (optional) ---- */ ::-webkit-scrollbar { width: 9px; background: #eaeaea; } ::-webkit-scrollbar-thumb { background: #bbb; border-radius: 5px; } /* ===== Register Form / Auth Pages ===== */ .register-form { display: flex; flex-direction: column; gap: 16px; } .register-form label { font-weight: 500; margin-bottom: 4px; display: block; } .register-form input[type="text"], .register-form input[type="email"], .register-form input[type="password"] { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid #dadada; font-size: 1em; background: #fff; color: var(--text-main); margin-top: 3px; transition: border .18s; } .register-form input:focus { border: 1.5px solid var(--primary); background: #f6faff; } .register-form .invalid { border: 1.5px solid #e74c3c !important; background: #fff6f6 !important; } .register-form .error-text { color: #e74c3c; font-size: 0.99em; margin: 2px 0 0 2px; min-height: 18px; } @media (max-width:600px) { .register-form { gap: 10px; } } /* ==== Checkbox vizibil și elegant pentru formularul de înregistrare ==== */ input[type="checkbox"].form-check-input { width: 20px; height: 20px; accent-color: var(--primary); /* culoare custom, dacă browserul suportă */ border-radius: 5px; border: 2px solid #bbb; vertical-align: middle; margin-right: 8px; transition: border .18s, box-shadow .18s; } input[type="checkbox"].form-check-input:focus { border: 2px solid var(--accent); box-shadow: 0 0 4px var(--accent); } input[type="checkbox"].form-check-input:checked { border-color: var(--primary); background: var(--primary); } label.form-check-label { font-size: 1em; font-weight: 500; color: var(--primary); cursor: pointer; user-select: none; } /* Fortare butoane de submit sa nu isi schimbe culoarea */ .register-form button, .register-form .btn, form button, form .btn, button[type="submit"] { background: var(--primary) !important; color: #fff !important; border: none !important; } .register-form button:hover, .register-form .btn:hover, form button:hover, form .btn:hover, button[type="submit"]:hover { background: var(--accent) !important; color: #fff !important; } /* ---- REPARĂ CHECKBOX-uri și X-ul din Bootstrap MODAL (pentru cookies/modaluri) ---- */ /* Repară checkbox-urile Bootstrap (modale/forme) */ .modal .form-check-input[type="checkbox"] { appearance: auto !important; -webkit-appearance: auto !important; accent-color: #191c23; /* sau culoarea ta principală */ width: 1.2em; height: 1.2em; border-radius: .25em; border: 1.5px solid #adb5bd; vertical-align: middle; margin-right: 8px; background: #fff; } /* Repară butonul X de închidere din modal */ .modal .btn-close { background: none !important; border: none !important; opacity: 0.7; width: 2.2em; height: 2.2em; position: relative; } .modal .btn-close::before { content: "\00d7"; font-size: 2.2em; color: #222; font-weight: bold; line-height: 1; position: absolute; left: 0.4em; top: -0.12em; } .modal .btn-close > * { display: none; } .login-error { color: #e74c3c !important; font-weight: bold; font-size: 1.18em; margin-bottom: 14px; margin-top: 8px; text-align: center; background: #fff0f0; border: 1.5px solid #e74c3c; border-radius: 7px; padding: 12px 18px; letter-spacing: 0.01em; box-shadow: 0 1px 8px #e74c3c1a; max-width: 90%; margin-left: auto; margin-right: auto; transition: box-shadow .18s; }