:root {
    --color-primary: #4A6FA5;
    --color-primary-dark: #3A5A8F;
    --color-primary-light: #6B8FC7;

    --color-secondary: #FF8C42;
    --color-secondary-dark: #E67329;
    --color-secondary-light: #FFA96B;

    --color-text: #333333;
    --color-text-light: #666666;
    --color-text-muted: #999999;
    --color-text-inverse: #FFFFFF;

    --color-bg: #FFFFFF;
    --color-bg-secondary: #F8F9FA;
    --color-bg-dark: #2C3E50;
    --color-bg-overlay: rgba(255, 255, 255, 0.95);

    --color-border: #E0E0E0;
    --color-border-light: #F0F0F0;
    --color-border-dark: #CCCCCC;

    --shadow-color: rgba(0, 0, 0, 0.1);
    --shadow-sm: 0 1px 2px var(--shadow-color);
    --shadow-md: 0 4px 6px var(--shadow-color);
    --shadow-lg: 0 10px 15px var(--shadow-color);
    --shadow-xl: 0 20px 25px var(--shadow-color);

    --color-link: #4A6FA5;
    --color-link-hover: #3A5A8F;
    --color-link-visited: #6B5B95;

    --color-success: #28A745;
    --color-warning: #FFC107;
    --color-error: #DC3545;
    --color-info: #17A2B8;
}

.body {
    background-color: var(--color-bg);
    color: var(--color-text);
}

.header {
    background-color: var(--color-bg);
}

.btn--primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-text-inverse);
}

.btn--primary:hover,
.btn--primary:focus {
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
}

.btn--outline {
    background-color: transparent;
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.btn--outline:hover,
.btn--outline:focus {
    background-color: var(--color-primary);
    color: var(--color-text-inverse);
}

.room-card,
.offer-card,
.activity-card {
    background-color: var(--color-bg);
    box-shadow: var(--shadow-md);
}

input,
select,
textarea {
    background-color: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(74, 111, 165, 0.1);
}

table {
    background-color: var(--color-bg);
    border-color: var(--color-border);
}

th {
    background-color: var(--color-bg-secondary);
    color: var(--color-text);
}

td {
    border-color: var(--color-border-light);
    color: var(--color-text);
}

.modal__container {
    background-color: var(--color-bg);
    box-shadow: var(--shadow-xl);
}

.modal__overlay {
    background-color: rgba(0, 0, 0, 0.7);
}

.cookie-banner {
    background-color: var(--color-bg-dark);
    color: var(--color-text-inverse);
}

.validation-message {
    color: var(--color-error);
}

input.valid {
    border-color: var(--color-success);
}

input.invalid {
    border-color: var(--color-error);
}

.pagination__number {
    background-color: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

.pagination__number:hover,
.pagination__number:focus,
.pagination__number.active {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-text-inverse);
}

.tabs__btn {
    background-color: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

.tabs__btn:hover,
.tabs__btn:focus {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.tabs__btn.active,
.tabs__btn[aria-selected="true"] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-text-inverse);
}

.slider__dot {
    background-color: var(--color-border);
}

.slider__dot.active {
    background-color: var(--color-primary);
}

.mobile-menu {
    background-color: var(--color-bg);
    box-shadow: var(--shadow-xl);
}

.mobile-menu__link {
    color: var(--color-text);
}

.mobile-menu__link:hover,
.mobile-menu__link:focus {
    background-color: var(--color-bg-secondary);
    color: var(--color-primary);
}

.search-form {
    background-color: var(--color-bg-overlay);
    box-shadow: var(--shadow-xl);
}

.search-form__field {
    border-color: var(--color-border);
}

.search-form__field:focus-within {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(74, 111, 165, 0.1);
}

.search-form__input {
    color: var(--color-text);
}

.search-form__input::placeholder {
    color: var(--color-text-muted);
}

.section--alternate {
    background-color: var(--color-bg-secondary);
}

.activity-card__overlay {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, transparent 100%);
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--color-bg-secondary);
}

::-webkit-scrollbar-thumb {
    background: var(--color-primary-light);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-primary);
}

::selection {
    background-color: var(--color-primary);
    color: var(--color-text-inverse);
}