/* ============================================================
   CORE.CSS — ГЛАВНЫЙ ФАЙЛ СТИЛЕЙ
   ============================================================ */

/* Порядок импорта важен! */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css');
@import url('variables.css');
@import url('reset.css');
@import url('utilities.css');
@import url('header.css');
@import url('footer.css');
@import url('cards.css');
@import url('toast.css');
@import url('tools.css');
@import url('modal.css');
@import url('responsive.css');
@import url('editor.css');

/* ============================================================
   ДОПОЛНИТЕЛЬНЫЕ СТИЛИ
   ============================================================ */

/* Спиннер для кнопок загрузки */
.spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: white;
    animation: spin 0.6s linear infinite;
    margin-right: 8px;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Стили для кнопок с состоянием загрузки */
.btn-primary:disabled,
.btn-secondary:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Улучшенный скролл */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--spectrum-gray-100);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: var(--spectrum-gray-400);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--spectrum-gray-500);
}

/* Выделение текста */
::selection {
    background: var(--accent-primary-light);
    color: var(--spectrum-gray-800);
}

/* Фокус для доступности */
:focus-visible {
    outline: 2px solid var(--accent-primary);
    outline-offset: 2px;
}

/* Страницы инструментов — без скролла всей страницы */
html.no-scroll,
body.no-scroll {
    overflow: hidden;
    height: 100%;
}

.tool-page {
    height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.tool-page .main {
    flex: 1;
    overflow: hidden;
    margin-top: var(--header-height);
}

.tool-page #footer-placeholder {
    display: none;
}