/* ========================================================= */
/* EVTX MASTER STYLESHEET (evtx-style.css)                   */
/* ========================================================= */

/* --- GLOBAL THEME --- */
body { 
    margin: 0; padding: 0; min-height: 100vh; overflow-x: hidden;
    font-family: 'Courier New', Courier, monospace !important; 
    background-color: #0d1117 !important; 
    background-image: linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
    background-size: 40px 40px; background-position: center center;
    color: #c9d1d9; touch-action: none;
}
.crt-overlay {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; 
    background: linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15) 50%); 
    background-size: 100% 4px; z-index: 99999; pointer-events: none;
}

/* --- CONTAINERS & MODALS --- */
.modal-container, .content-container, .profile-container, .studio-container { 
    border: 1px solid #30363d; background: rgba(13, 17, 23, 0.95); padding: 40px; 
    box-sizing: border-box; box-shadow: 0 8px 24px rgba(0,0,0,0.5); 
    border-radius: 8px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10000;
}
.modal-container { width: 500px; max-width: 90vw; }
.content-container { width: 600px; max-width: 90vw; position: relative; top: auto; left: auto; transform: none; margin: 40px auto; }
.profile-container { width: 500px; max-width: 90vw; max-height: calc(90vh - 50px); overflow-y: auto; }
.studio-container { width: 800px; max-width: 95vw; position: relative; top: auto; left: auto; transform: none; margin: 40px auto 100px auto; z-index: 10; }

/* --- TYPOGRAPHY & FORMS --- */
.header { border-bottom: 1px solid #30363d; padding-bottom: 15px; margin-bottom: 30px; text-align: center; letter-spacing: 4px; color: #f0f6fc; font-weight: bold; }
h1 { color: #f0f6fc; border-bottom: 1px solid #30363d; padding-bottom: 15px; margin-bottom: 30px; letter-spacing: 2px; text-align: center; }
.prompt-text { text-align: center; margin-bottom: 30px; font-size: 0.9rem; color: #8b949e; }
.form-group { margin-bottom: 20px; display: flex; flex-direction: column; gap: 8px; }
label { font-size: 0.85rem; color: #8b949e; letter-spacing: 1px; }

input[type="text"], input[type="email"], input[type="password"], input[type="number"], textarea { 
    background: #010409; border: 1px solid #30363d; border-radius: 6px; color: #56d364; 
    padding: 12px; font-family: 'Courier New', monospace; font-size: 1rem; outline: none; transition: 0.3s; box-sizing: border-box; width: 100%;
}
textarea { min-height: 150px; resize: vertical; }
input:focus, textarea:focus { border-color: #58a6ff; box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.1); color: #fff;}

/* --- BUTTONS --- */
.action-btn, .btn-submit { 
    background: #21262d; border: 1px solid #363b42; border-radius: 6px; color: #c9d1d9; 
    padding: 12px 15px; font-family: 'Courier New', monospace; font-weight: bold; cursor: pointer; transition: 0.2s; text-transform: uppercase; letter-spacing: 1px; width: 100%; box-sizing: border-box;
}
.action-btn:hover, .btn-submit:hover { background: #30363d; color: #fff; border-color: #8b949e; }
.login-btn:hover { border-color: #56d364; background: #238636; color: #fff; }
.cancel-btn:hover, .logout-btn:hover { border-color: #f85149; background: #da3633; color: #fff; }
.auth-actions { display: flex; gap: 10px; margin-top: 25px; flex-wrap: wrap; }

/* --- GLOBAL FOOTER --- */
.site-footer {
    position: fixed; bottom: 0; left: 0; width: 100vw; background: rgba(1, 4, 9, 0.85); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border-top: 1px solid #30363d; display: flex; justify-content: space-between; align-items: center; padding: 15px 30px; box-sizing: border-box; z-index: 50;
}
.footer-links { display: flex; gap: 25px; }
.footer-links a { color: #8b949e; text-decoration: none; font-size: 0.75rem; font-weight: bold; letter-spacing: 1px; transition: 0.2s; }
.footer-links a:hover { color: #58a6ff; }
.footer-copy { color: #484f58; font-size: 0.7rem; letter-spacing: 1px; }

/* --- GLASS WINDOWS (OS APPS) --- */
.glass-panel { background: rgba(13, 17, 23, 0.98); border: 1px solid #30363d; border-radius: 8px; box-shadow: 0 12px 28px rgba(0,0,0,0.6); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.window-header { background: #010409; color: #8b949e; padding: 12px 15px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #30363d; font-size: 0.85rem; letter-spacing: 1px; touch-action: none; font-weight: bold; border-top-left-radius: 8px; border-top-right-radius: 8px;}
.window-close { background: transparent; color: #8b949e; border: none; font-weight: bold; cursor: pointer; font-family: monospace; font-size: 1.1rem; transition: 0.2s; }
.window-close:hover { color: #f85149;}
.sub-system-btn { border: 1px solid #30363d; border-radius: 8px; transition: 0.2s; text-align: center; padding: 14px; font-family: 'Courier New', monospace; cursor: pointer; background: #21262d;}
.sub-system-btn:hover { background: #30363d; border-color: #8b949e;}

/* ========================================================= */
/* --- PERFECT MOBILE RESPONSIVE OVERRIDE --- */
/* ========================================================= */
@media screen and (max-width: 768px) {
    /* Container Fits */
    .modal-container, .content-container, .profile-container, .studio-container { width: 95vw !important; padding: 25px 15px !important; }
    .header { font-size: 1.1rem !important; margin-bottom: 20px !important; white-space: nowrap !important; }
    .prompt-text { font-size: 0.75rem !important; white-space: nowrap !important; }
    .auth-actions { flex-direction: column; } .action-btn, .btn-submit { width: 100%; margin-bottom: 10px; }
    
    /* Footer Stacking */
    .site-footer { flex-direction: column; gap: 12px; padding: 15px; text-align: center; }
    .footer-links { flex-wrap: nowrap !important; justify-content: center; gap: 10px !important; width: 100%; }
    .footer-links a { font-size: 0.65rem !important; white-space: nowrap !important; }
    .footer-copy { font-size: 0.6rem !important; white-space: nowrap !important; }

    /* OS Apps Mobile Fullscreen */
    .glass-panel { width: 95vw !important; height: auto !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; display: flex; flex-direction: column; max-height: 85vh; }
    .iframe-container { height: 60vh !important; }
    .window-header { cursor: default !important; white-space: nowrap !important; font-size: 0.75rem !important;}
    .sub-system-btn span { white-space: nowrap !important; font-size: 0.8rem !important; }
}