@import url('./layout.css');
@import url('./forms.css');
@import url('./buttons.css');
@import url('./cards.css');
@import url('./alerts.css');
@import url('./navigation.css');

:root {
    --bg: #f4f6f8;
    --surface: #ffffff;
    --surface-muted: #f8fafc;
    --border: #d9e1e7;
    --text: #1f2933;
    --text-soft: #52606d;
    --heading: #102a43;

    --primary: #1f6feb;
    --primary-hover: #1557b0;
	--danger: #d92d20;

    --success-bg: #e8f7ee;
    --success-text: #166534;
    --success-border: #b7e4c7;

    --error-bg: #fdecec;
    --error-text: #b42318;
    --error-border: #f5c2c7;

    --shadow-sm: 0 2px 8px rgba(16, 42, 67, 0.06);
    --shadow-md: 0 10px 30px rgba(16, 42, 67, 0.08);

    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 18px;

    --container: 1360px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 16px;
    overflow-y: scroll;
}


body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--text);
    background: linear-gradient(180deg, #f8fafc 0%, #f4f6f8 100%);
    line-height: 1.5;
}

a {
    color: var(--primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

img {
    max-width: 100%;
    display: block;
}

h1,
h2,
h3,
h4 {
    margin-top: 0;
    color: var(--heading);
    line-height: 1.2;
}

p {
    margin-top: 0;
}

.hidden {
    display: none !important;
}

.modules-table {
    width: 100%;
    table-layout: fixed;
}

.modules-col-name {
    width: 40%;
    vertical-align: middle;
}

.modules-col-status {
    width: 15%;
    text-align: center;
    vertical-align: middle;
}

.modules-col-actions {
    width: 35%;
    text-align: right;
    vertical-align: middle;
}

.modules-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
}

.modules-actions .button {
    min-width: 140px;
    justify-content: center;
}

.modules-description {
    margin-top: 8px;
}