/* style.css */
* { margin:0; padding:0; box-sizing:border-box; }
body {
    background: #0a0a0a;
    color: #00ff41;
    font-family: 'Share Tech Mono', monospace;
    min-height: 100vh;
    overflow-x: hidden;
    position: relative;
}
#matrix-bg {
    position: fixed;
    top:0; left:0; width:100%; height:100%;
    z-index:0;
    pointer-events:none;
    opacity:0.4;
}
.scanlines {
    position:fixed; top:0; left:0; width:100%; height:100%;
    z-index:0;
    pointer-events:none;
    background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,255,65,0.008) 2px, rgba(0,255,65,0.008) 4px);
}
.glass {
    background: rgba(0,20,0,0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(0,255,65,0.25);
    border-radius: 16px;
    padding: 30px 25px;
    box-shadow: 0 0 60px rgba(0,255,65,0.05), inset 0 0 60px rgba(0,255,65,0.02);
    transition: all 0.3s ease;
    position:relative; z-index:1;
}
.glass:hover {
    border-color: rgba(0,255,65,0.4);
    box-shadow: 0 0 80px rgba(0,255,65,0.08), inset 0 0 80px rgba(0,255,65,0.03);
}
.logo { text-align:center; padding:30px 0 20px; position:relative; }
.logo h1 {
    font-family: 'Orbitron', monospace;
    font-weight:900; font-size:2.8rem;
    color:#00ff41;
    text-shadow: 0 0 10px rgba(0,255,65,0.8), 0 0 20px rgba(0,255,65,0.5), 0 0 40px rgba(0,255,65,0.3);
    letter-spacing:4px;
    animation: logoPulse 2s ease-in-out infinite;
    display:inline-block;
    position:relative;
}
.logo h1::before {
    content:''; position:absolute;
    top:-8px; left:-8px; right:-8px; bottom:-8px;
    border:2px solid rgba(0,255,65,0.3);
    border-radius:4px;
    animation: borderGlow 2s ease-in-out infinite;
}
.logo h1::after { content:'⚡'; font-size:1.2rem; margin-left:10px; animation:blink 1s step-end infinite; }
.logo .subtitle { font-size:0.7rem; color:rgba(0,255,65,0.5); letter-spacing:8px; text-transform:uppercase; margin-top:4px; }
@keyframes logoPulse {
    0%,100% { text-shadow:0 0 10px rgba(0,255,65,0.8),0 0 20px rgba(0,255,65,0.5),0 0 40px rgba(0,255,65,0.3); }
    50% { text-shadow:0 0 20px rgba(0,255,65,1),0 0 40px rgba(0,255,65,0.7),0 0 80px rgba(0,255,65,0.4),0 0 120px rgba(0,255,65,0.2); }
}
@keyframes borderGlow {
    0%,100% { border-color:rgba(0,255,65,0.3); box-shadow:0 0 30px rgba(0,255,65,0.1); }
    50% { border-color:rgba(0,255,65,0.8); box-shadow:0 0 60px rgba(0,255,65,0.3); }
}
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:0;} }
.hacker-input {
    background: rgba(0,20,0,0.6) !important;
    border: 1px solid rgba(0,255,65,0.3) !important;
    color: #00ff41 !important;
    font-family: 'Share Tech Mono', monospace !important;
    font-size:1.1rem !important;
    padding:14px 18px !important;
    border-radius:10px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 0 20px rgba(0,255,65,0.03) !important;
    width:100%;
}
.hacker-input:focus {
    border-color:#00ff41 !important;
    box-shadow:0 0 40px rgba(0,255,65,0.15), inset 0 0 40px rgba(0,255,65,0.05) !important;
    outline:none !important;
    background: rgba(0,30,0,0.7) !important;
}
.hacker-input::placeholder { color:rgba(0,255,65,0.3); }
.hacker-btn {
    background: transparent;
    border:1px solid #00ff41;
    color:#00ff41;
    font-family:'Share Tech Mono',monospace;
    font-size:1rem;
    padding:12px 30px;
    border-radius:10px;
    transition:all 0.3s ease;
    text-transform:uppercase;
    letter-spacing:3px;
    position:relative;
    overflow:hidden;
    background:rgba(0,255,65,0.05);
    width:100%;
}
.hacker-btn:hover {
    background:rgba(0,255,65,0.15);
    box-shadow:0 0 40px rgba(0,255,65,0.2), inset 0 0 40px rgba(0,255,65,0.05);
    transform:scale(1.02);
    color:#00ff41;
}
.hacker-btn:active { transform:scale(0.97); }
.hacker-btn::before {
    content:''; position:absolute;
    top:-50%; left:-50%; width:200%; height:200%;
    background:conic-gradient(from 0deg, transparent, rgba(0,255,65,0.05), transparent, rgba(0,255,65,0.05), transparent);
    animation:rotateBtn 6s linear infinite;
    opacity:0; transition:opacity 0.3s;
}
.hacker-btn:hover::before { opacity:1; }
@keyframes rotateBtn { 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);} }

.device-list {
    max-height:200px; overflow-y:auto;
    background:rgba(0,10,0,0.8);
    border:1px solid rgba(0,255,65,0.2);
    border-radius:10px;
    margin-top:8px;
    display:none;
}
.device-list.active { display:block; }
.device-item {
    padding:10px 16px;
    cursor:pointer;
    border-bottom:1px solid rgba(0,255,65,0.08);
    transition:all 0.2s ease;
    color:#00ff41;
}
.device-item:hover {
    background:rgba(0,255,65,0.1);
    border-left:3px solid #00ff41;
    padding-left:20px;
}
.device-item.selected {
    background:rgba(0,255,65,0.15);
    border-left:3px solid #00ff41;
}
.device-item .badge {
    background:rgba(0,255,65,0.15);
    color:#00ff41;
    font-size:0.6rem;
    padding:2px 10px;
    border-radius:20px;
    border:1px solid rgba(0,255,65,0.2);
}
.no-result { padding:20px; text-align:center; color:rgba(0,255,65,0.4); font-style:italic; }
.device-list::-webkit-scrollbar { width:4px; }
.device-list::-webkit-scrollbar-track { background:rgba(0,10,0,0.5); }
.device-list::-webkit-scrollbar-thumb { background:rgba(0,255,65,0.3); border-radius:10px; }

.selected-device-name {
    color:#00ff41;
    font-family:'Orbitron',monospace;
    font-size:0.9rem;
    text-align:center;
    padding:8px;
    background:rgba(0,255,65,0.05);
    border-radius:8px;
    border:1px solid rgba(0,255,65,0.1);
    margin-top:8px;
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
}

/* Hacker Overlay */
#hacker-overlay {
    position:fixed; top:0; left:0; width:100%; height:100%;
    z-index:9999;
    background:#0a0a0a;
    display:none;
    justify-content:center;
    align-items:center;
    flex-direction:column;
    padding:20px;
}
#hacker-overlay.active { display:flex; }
.code-scroll {
    font-family:'Share Tech Mono',monospace;
    color:#00ff41;
    font-size:0.7rem;
    line-height:1.6;
    opacity:0.8;
    max-width:90%;
    max-height:70vh;
    overflow:hidden;
    text-align:center;
    word-break:break-all;
    animation:codeRain 0.3s linear infinite;
}
.loading-text {
    font-family:'Orbitron',monospace;
    font-size:1.2rem;
    color:#00ff41;
    margin-top:20px;
    letter-spacing:6px;
    animation:blink 0.8s step-end infinite;
}
.progress-ring {
    width:60px; height:60px;
    border:2px solid rgba(0,255,65,0.15);
    border-top:2px solid #00ff41;
    border-radius:50%;
    animation:spin 0.8s linear infinite;
    margin-top:10px;
}
@keyframes spin { 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);} }
@keyframes codeRain { 0%{opacity:0.6;} 50%{opacity:1;} 100%{opacity:0.6;} }

/* Result page */
.result-item {
    display:flex;
    justify-content:space-between;
    padding:12px 16px;
    border-bottom:1px solid rgba(0,255,65,0.08);
}
.result-item .label { color:rgba(0,255,65,0.6); text-transform:uppercase; letter-spacing:2px; font-size:0.8rem; }
.result-item .value { color:#00ff41; font-weight:bold; font-size:1.2rem; text-shadow:0 0 20px rgba(0,255,65,0.2); }
.result-device-name {
    text-align:center;
    font-family:'Orbitron',monospace;
    font-size:1.4rem;
    color:#00ff41;
    padding:10px 0 20px;
    letter-spacing:3px;
    text-shadow:0 0 30px rgba(0,255,65,0.2);
    border-bottom:1px solid rgba(0,255,65,0.1);
    margin-bottom:10px;
}

/* Block timer */
.block-timer {
    font-family:'Orbitron',monospace;
    font-size:1.8rem;
    color:#ff4444;
    text-shadow:0 0 30px rgba(255,68,68,0.3);
    text-align:center;
    padding:15px 0;
    letter-spacing:4px;
}
.block-msg { text-align:center; color:rgba(255,68,68,0.7); font-size:0.9rem; padding:5px 0; }

/* Admin */
.admin-card {
    background:rgba(0,10,0,0.85);
    border:1px solid rgba(0,255,65,0.15);
    border-radius:12px;
    padding:20px;
    margin-bottom:20px;
}
.admin-card .card-title {
    font-family:'Orbitron',monospace;
    font-size:0.9rem;
    color:rgba(0,255,65,0.5);
    letter-spacing:3px;
    text-transform:uppercase;
    border-bottom:1px solid rgba(0,255,65,0.08);
    padding-bottom:10px;
    margin-bottom:15px;
}
.admin-table { color:#00ff41; font-family:'Share Tech Mono',monospace; }
.admin-table th { color:rgba(0,255,65,0.4); font-weight:normal; letter-spacing:2px; font-size:0.7rem; text-transform:uppercase; border-bottom:1px solid rgba(0,255,65,0.1); }
.admin-table td { border-bottom:1px solid rgba(0,255,65,0.05); padding:10px 8px; vertical-align:middle; }
.admin-table tr:hover td { background:rgba(0,255,65,0.03); }
.btn-hacker-sm {
    background:transparent;
    border:1px solid rgba(0,255,65,0.3);
    color:#00ff41;
    transition:all 0.2s;
    padding:4px 12px;
    border-radius:6px;
    font-size:0.7rem;
}
.btn-hacker-sm:hover { background:rgba(0,255,65,0.1); border-color:#00ff41; color:#00ff41; }
.btn-hacker-danger { border-color:rgba(255,68,68,0.3); color:#ff4444; }
.btn-hacker-danger:hover { background:rgba(255,68,68,0.1); border-color:#ff4444; color:#ff4444; }

.hidden { display:none !important; }
.mt-20 { margin-top:20px; }
.fade-in { animation:fadeIn 0.5s ease forwards; }
@keyframes fadeIn { 0%{opacity:0;transform:translateY(15px);} 100%{opacity:1;transform:translateY(0);} }
.fade-out { animation:fadeOut 0.3s ease forwards; }
@keyframes fadeOut { 0%{opacity:1;transform:translateY(0);} 100%{opacity:0;transform:translateY(-15px);} }
.glitch-text { animation:glitch 3s infinite; }
@keyframes glitch {
    0%,90%,100% { transform:translate(0); }
    92% { transform:translate(-2px,1px); }
    94% { transform:translate(2px,-1px); }
    96% { transform:translate(-1px,2px); }
    98% { transform:translate(1px,-2px); }
}
.toast-container {
    position:fixed; bottom:20px; left:50%; transform:translateX(-50%);
    z-index:99999; width:90%; max-width:400px;
}
.toast-custom {
    background:rgba(0,10,0,0.95);
    border:1px solid rgba(0,255,65,0.2);
    color:#00ff41;
    font-family:'Share Tech Mono',monospace;
    border-radius:10px;
    padding:14px 20px;
    backdrop-filter:blur(10px);
    text-align:center;
    font-size:0.9rem;
    box-shadow:0 0 60px rgba(0,255,65,0.05);
    margin-bottom:8px;
}
.toast-custom.error { border-color:rgba(255,68,68,0.3); color:#ff6b6b; }
.toast-custom.success { border-color:rgba(0,255,65,0.4); color:#00ff41; }

@media (max-width:576px) {
    .logo h1 { font-size:1.8rem; letter-spacing:2px; }
    .glass { padding:20px 16px; }
    .hacker-input { font-size:0.95rem !important; padding:12px 14px !important; }
    .hacker-btn { font-size:0.85rem; padding:10px 20px; }
    .result-item .value { font-size:1rem; }
    .block-timer { font-size:1.4rem; }
    .result-device-name { font-size:1.1rem; }
}
@media (max-width:400px) {
    .logo h1 { font-size:1.4rem; }
    .glass { padding:14px 12px; }
}


/* Ekranı tam tut, scroll və zoom-u blokla */
html, body {
    width: 100%;
    height: 100%;
    overflow: hidden !important;
    position: fixed;
    top: 0;
    left: 0;
    touch-action: none; /* toxunma ilə scroll və zoom-un qarşısını alır */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

/* Bütün məzmun konteynerini tam ekran edir */
.container {
    height: 100vh;
    max-height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Kartın daşmasını blokla */
.glass {
    max-height: 90vh;
    overflow-y: auto; /* məzmun çox olarsa, yalnız kart daxilində scroll */
    -webkit-overflow-scrolling: touch;
}

/* Admin panelində cədvəl üçün */
.table-responsive {
    max-height: 50vh;
    overflow-y: auto;
}