/* ===== RESET & BASE STYLES ===== */
* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
}

body { 
    background: #0a0a0a; 
    color: #2a8a8a; 
    font-family: 'Courier New', monospace; 
    padding: 40px 20px; 
    margin: 0; 
    min-height: 100vh;
    display: flex; 
    flex-direction: column;
    line-height: 1.6;
}

/* ===== LAYOUT STRUCTURE ===== */
.content { 
    flex: 1; 
    max-width: 900px; 
    margin: 0 auto; 
    width: 100%; 
}

.footer { 
    margin-top: 80px; 
    text-align: center; 
    color: #666; 
    font-size: 14px; 
    padding: 20px; 
}

.footer a {
    color: #666;
    text-decoration: none;
}

.footer a:hover {
    color: #888;
}

/* ===== TYPOGRAPHY ===== */
h1 { 
    color: #cc8800; 
    margin-bottom: 30px; 
    font-size: 28px; 
    text-align: left; 
}

h2 { 
    color: #44aa44; 
    margin-bottom: 20px; 
    font-size: 22px; 
    text-align: left; 
}

.location { 
    color: #44aa44; 
    margin-bottom: 40px; 
    font-size: 18px; 
    line-height: 1.5; 
    text-align: left; 
}

/* ===== FORMS & INPUTS ===== */
.search-form { 
    margin: 40px auto; 
    width: 100%; 
    max-width: 700px; 
}

.form-group { 
    margin-bottom: 20px; 
    text-align: left;
}

.form-label { 
    color: #cc8800; 
    display: block; 
    margin-bottom: 8px; 
    font-size: 14px;
}

.form-input { 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    color: #44aa44; 
    padding: 12px 15px; 
    font-family: monospace; 
    font-size: 16px; 
    width: 100%; 
    margin-bottom: 20px; 
}

.form-input:focus { 
    outline: none; 
    border-color: #44aa44; 
}

.search-controls { 
    display: flex; 
    gap: 10px; 
    margin-bottom: 15px; 
    justify-content: center; 
    flex-wrap: wrap; 
}

/* ===== BUTTONS ===== */
.btn { 
    color: #2a8a8a; 
    cursor: pointer; 
    padding: 8px 15px; 
    font-family: monospace; 
    font-size: 14px; 
    text-decoration: none;
    background: transparent; 
    border: 1px solid #2a8a8a;
    transition: all 0.3s ease;
    display: inline-block;
}

.btn:hover { 
    background: #2a8a8a; 
    color: #0a0a0a; 
}

.btn-primary { 
    color: #2a8a8a; 
    border-color: #2a8a8a; 
}

.btn-success { 
    color: #55ff55; 
    border-color: #55ff55; 
}

.btn-success:hover { 
    background: #55ff55; 
    color: #0a0a0a; 
}

.btn-warning { 
    color: #ffaa00; 
    border-color: #ffaa00; 
}

.btn-warning:hover { 
    background: #ffaa00; 
    color: #0a0a0a; 
}

.btn-danger { 
    color: #ff5555; 
    border-color: #ff5555; 
}

.btn-danger:hover { 
    background: #ff5555; 
    color: #0a0a0a; 
}

.btn:disabled { 
    color: #555; 
    border-color: #555; 
    cursor: not-allowed; 
}

.btn:disabled:hover { 
    background: transparent; 
    color: #555; 
}

.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
}

/* ===== LISTS ===== */
.list { 
    margin: 20px 0; 
}

.list-item { 
    margin: 8px 0; 
    padding: 10px 0; 
    border-bottom: 1px solid #2a2a2a;
    display: flex;
    align-items: center;
}

.list-item:last-child { 
    border-bottom: none; 
}

.item-name { 
    color: #44aa44; 
    cursor: pointer; 
    flex: 1;
    font-size: 18px; /* Увеличил шрифт в 1.5 раза (было 12px) */
    text-decoration: none; /* Убрал подчеркивание */
}

.item-name:hover { 
    color: #55ff55; 
    text-decoration: none; /* Убрал подчеркивание при hover */
}

.item-desc { 
    color: #888; 
    margin-left: 10px; 
    font-size: 14px; /* Увеличил описание тоже */
    text-decoration: none; /* Убрал подчеркивание */
}

/* ===== DROPDOWNS ===== */
.control-item { 
    text-align: center; 
    position: relative;
}

.control-button { 
    color: #2a8a8a; 
    cursor: pointer; 
    padding: 8px 12px; 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    min-width: 120px; 
    position: relative; 
    font-size: 14px; 
    text-decoration: none; /* Убрал подчеркивание */
}

.control-dropdown { 
    display: none; 
    position: absolute; 
    top: 100%; 
    left: 0; 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    width: 100%; 
    z-index: 10; 
    max-height: 200px;
    overflow-y: auto;
}

.control-option { 
    color: #44aa44; 
    padding: 8px 12px; 
    cursor: pointer; 
    border-bottom: 1px solid #2a2a2a; 
    text-align: left; 
    font-size: 13px; 
    text-decoration: none; /* Убрал подчеркивание */
}

.control-option:hover { 
    background: #2a2a2a; 
    color: #55ff55; 
    text-decoration: none; /* Убрал подчеркивание */
}

.control-option.active { 
    background: #2a8a8a; 
    color: #0a0a0a; 
    text-decoration: none; /* Убрал подчеркивание */
}

.control-item:hover .control-dropdown { 
    display: block; 
}

/* ===== ACTION BUTTONS ===== */
.action-buttons { 
    display: flex; 
    gap: 10px; 
    justify-content: center; 
    margin-bottom: 20px; 
}

.action-links { 
    display: flex; 
    gap: 10px; 
}

/* ===== STATUS SECTION ===== */
.status-section { 
    margin: 20px 0; 
    padding: 20px; 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    text-align: left; 
}

.status-running { 
    color: #44aa44; 
}

.status-complete { 
    color: #cc8800; 
}

.status-idle { 
    color: #888; 
}

.progress { 
    width: 100%; 
    height: 12px; 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    margin: 15px 0; 
    position: relative; 
    border-radius: 2px; 
    overflow: hidden; 
}

.progress-bar { 
    height: 100%; 
    background: #44aa44; 
    transition: width 0.5s ease; 
    border-radius: 1px; 
}

.progress-success { 
    background: #44aa44; 
}

.progress-warning { 
    background: #ffaa00; 
}

.progress-danger { 
    background: #ff5555; 
}

/* ===== CARDS ===== */
.card { 
    background: #1a1a1a; 
    border: 1px solid #2a2a2a; 
    padding: 20px; 
    margin-bottom: 20px; 
}

.card-header { 
    color: #cc8800; 
    margin-bottom: 15px; 
    font-size: 16px; 
    font-weight: bold;
}

.card-body { 
    color: #44aa44; 
}

/* ===== GRIDS ===== */
.grid { 
    display: grid; 
    gap: 20px; 
    margin-bottom: 20px; 
}

.grid-2 { 
    grid-template-columns: 1fr 1fr; 
}

.grid-3 { 
    grid-template-columns: 1fr 1fr 1fr; 
}

.grid-auto { 
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
}

/* ===== MODALS ===== */
.modal { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0,0,0,0.8); 
    display: none; 
    z-index: 1000; 
}

.modal-content { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    padding: 30px; 
    width: 90%; 
    max-width: 600px; 
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    margin-bottom: 20px; 
    padding-bottom: 15px;
    border-bottom: 1px solid #2a2a2a;
}

.modal-title { 
    color: #cc8800; 
    font-size: 18px; 
    font-weight: bold;
}

.modal-close { 
    color: #ff5555; 
    cursor: pointer; 
    font-size: 20px; 
    line-height: 1;
    text-decoration: none; /* Убрал подчеркивание */
}

.modal-close:hover { 
    color: #ff0000; 
    text-decoration: none; /* Убрал подчеркивание */
}

.modal-body { 
    color: #44aa44; 
    margin-bottom: 20px; 
}

.modal-footer { 
    text-align: right; 
    padding-top: 20px;
    border-top: 1px solid #2a2a2a;
}

/* ===== NOTIFICATIONS ===== */
.notification { 
    position: fixed; 
    top: 20px; 
    right: 20px; 
    padding: 15px 20px; 
    background: #1a1a1a; 
    border: 1px solid #2a8a8a; 
    color: #44aa44; 
    z-index: 10000; 
    display: none; 
    max-width: 400px; 
    font-size: 14px;
    border-radius: 3px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
    transform: translateX(100%);
    transition: transform 0.3s ease, opacity 0.3s ease;
    opacity: 0;
    text-decoration: none; /* Убрал подчеркивание */
}

.notification.visible {
    display: block;
    transform: translateX(0);
    opacity: 1;
}

.notification.hiding {
    transform: translateX(100%);
    opacity: 0;
}

.notification-success { 
    border-color: #44aa44; 
    color: #44aa44; 
}

.notification-error { 
    border-color: #cc0000; 
    color: #cc4444; 
}

.notification-warning { 
    border-color: #ffaa00; 
    color: #ffaa00; 
}

.notification-info { 
    border-color: #2a8a8a; 
    color: #2a8a8a; 
}

/* ===== ADMIN STYLES ===== */
.admin-header { 
    margin-bottom: 30px; 
    text-align: left;
}

.admin-links { 
    color: #ffcc66; 
    margin-top: 10px; 
    font-size: 14px;
}

.admin-links a { 
    color: #ffcc66; 
    margin-right: 15px;
    text-decoration: none; /* Убрал подчеркивание */
}

.admin-links a:hover { 
    color: #ffaa00; 
    text-decoration: none; /* Убрал подчеркивание */
}

.drop-zone { 
    border: 2px dashed #3a5a5a; 
    border-radius: 5px; 
    padding: 30px; 
    text-align: center; 
    margin: 0 auto;
    max-width: 500px;
    transition: all 0.3s;
    background: #1a2a2a;
}

.drop-zone:hover, .drop-zone.dragover {
    border-color: #55ff55;
    background: #2a3a3a;
}

.drop-text {
    color: #88ccaa;
    font-size: 14px;
    margin-bottom: 15px;
}

.upload-btn {
    color: #55ff55;
    cursor: pointer;
    text-decoration: none; /* Убрал подчеркивание */
    font-size: 14px;
}

.upload-btn:hover {
    color: #20c9c9;
    text-decoration: none; /* Убрал подчеркивание */
}

.editor-content { 
    height: calc(100% - 120px); 
}

.CodeMirror { 
    height: 100%; 
    background: #1a1a1a; 
    color: #fff; 
    font-family: monospace; 
    font-size: 14px; 
}

.CodeMirror-gutters { 
    background: #222; 
    border-right: 1px solid #333; 
}

.CodeMirror-foldgutter { 
    width: 15px; 
}

/* ===== TEXT UTILITIES ===== */
.text-primary { color: #2a8a8a; }
.text-success { color: #44aa44; }
.text-warning { color: #ffaa00; }
.text-danger { color: #ff5555; }
.text-muted { color: #888; }

.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* ===== SPACING UTILITIES ===== */
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }
.p-10 { padding: 10px; }
.p-20 { padding: 20px; }
.p-30 { padding: 30px; }

/* ===== UTILITY CLASSES ===== */
.hidden { display: none; }
.visible { display: block; }
.pointer { cursor: pointer; }
.no-border { border: none; }
.full-width { width: 100%; }
.text-ellipsis { 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
}

.download-section { 
    margin-top: 20px; 
    text-align: center; 
}

/* ===== FILTER TYPE OPTIONS ===== */
.filter-type-option.active {
    background: #2a8a8a !important;
    color: #0a0a0a !important;
    border: 1px solid #44aa44;
}
.filter-type-option.active .item-name,
.filter-type-option.active .item-desc {
    color: #0a0a0a !important;
    text-decoration: none; /* Убрал подчеркивание */
}