body{background-color:#f8f9fa; display:flex; flex-direction:column; min-height:100vh; font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } .navbar{background-color:#f38f1d; } .webcam-card{transition:transform 0.2s ease-in-out; border-radius:10px; overflow:hidden; } .webcam-card:hover{transform:scale(1.03); box-shadow:0 .5rem 1rem rgba(0,0,0,.15)!important; } .dropdown-menu-lang{width:800px; max-width:90vw; max-height:70vh; overflow-y:auto; padding:15px; border-radius:12px; border:none; } .lang-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:10px; } .lang-item{display:flex; align-items:center; gap:8px; color:#495057; text-decoration:none; padding:8px 12px; border-radius:6px; font-size:0.9rem; font-weight:500; transition:background-color 0.2s} .lang-item:hover{background-color:#f8f9fa; color:#212529; } .lang-item.active{background-color:#fff3cd; color:#856404; } .search-results-container{ display:none; position:absolute; top:100%; left:0; right:0; background:white; z-index:1000; padding:25px; border-radius:0 0 16px 16px; box-shadow:0 10px 40px rgba(0,0,0,0.08); border-top:1px solid #eee; } .search-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:15px; } .search-item{padding:12px 15px; background:#fff; border:1px solid #e9ecef; border-radius:8px; text-decoration:none; color:#212529; display:flex; flex-direction:column; transition:all 0.2s} .search-item:hover{background:#f8f9fa; border-color:#dee2e6; transform:translateY(-2px); box-shadow:0 4px 6px rgba(0,0,0,0.04); color:#f38f1d; } .search-type{font-size:0.65rem; text-transform:uppercase; font-weight:700; letter-spacing:0.5px; color:#adb5bd; margin-bottom:2px; } .nav-link{font-weight:600; letter-spacing:0.3px; transition:opacity 0.2s; } .nav-link:hover{opacity:0.8; } .btn-add-cam{ background:linear-gradient(135deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.05) 100%); border:1px solid rgba(255,255,255,0.4); color:#ffffff; font-weight:700; letter-spacing:0.5px; backdrop-filter:blur(10px); transition:all 0.3s ease; box-shadow:0 4px 15px rgba(0,0,0,0.05); } .btn-add-cam:hover{ background:#ffffff; color:#f38f1d !important; transform:translateY(-2px); box-shadow:0 8px 25px rgba(0,0,0,0.15); border-color:#ffffff; } .btn-add-cam i{font-size:1.1rem; } .search-box-enterprise{background-color:rgba(255,255,255,0.9); transition:all 0.3s; } .search-box-enterprise:focus{background-color:#ffffff; box-shadow:0 0 0 4px rgba(255,255,255,0.2) !important; } html[dir="rtl"] body{text-align:right; } html[dir="rtl"] .ms-auto{margin-left:0 !important; margin-right:auto !important; } html[dir="rtl"] .me-auto{margin-right:0 !important; margin-left:auto !important; } html[dir="rtl"] .ms-1, html[dir="rtl"] .ms-2, html[dir="rtl"] .ms-3{margin-left:0 !important; margin-right:0.5rem !important; } html[dir="rtl"] .me-1, html[dir="rtl"] .me-2, html[dir="rtl"] .me-3{margin-right:0 !important; margin-left:0.5rem !important; }