:root {
    --color-bg: #f5f5f2;
    --color-surface: #ffffff;
    --color-surface-muted: #ecece6;
    --color-text: #121212;
    --color-text-soft: #505050;
    --color-border: #d8d8d1;
    --color-overlay-dark: rgba(0, 0, 0, 0.6);
    --color-overlay-light: rgba(255, 255, 255, 0.45);
    --color-black: #000000;
    --color-white: #ffffff;
    --color-code-bg: #111111;
    --color-code-text: #f3f3f3;

    --navbar-bg: #fff8ef;
    --navbar-border-color: #f2d3a2;
    --navbar-brand-color: #d97706;
    --navbar-toggle-border-color: #7c2d12;
    --navbar-toggle-bg: #ffffff;
    --navbar-toggle-text-color: #7c2d12;
    --navbar-toggle-shadow-color: #f2d3a2;
    --navbar-toggle-hover-bg: #fff3d6;
    --navbar-toggle-focus-color: #d97706;
    --navbar-link-bg: #ffd89a;
    --navbar-link-border-color: #f2d3a2;
    --navbar-link-text-color: #7c2d12;
    --navbar-link-hover-bg: #ffc76b;

    --banner-bg: #000000;
    --banner-button-bg: rgba(0, 0, 0, 0.6);
    --banner-button-text-color: #ffffff;
    --banner-dot-bg: rgba(255, 255, 255, 0.45);
    --banner-dot-active-bg: #ffffff;

    --package-card-bg: #ffffff;
    --package-card-border-color: #d8d8d1;
    --package-card-title-color: #121212;
    --package-card-description-color: #505050;
    --package-card-link-bg: #ffd89a;
    --package-card-link-border-color: #f2d3a2;
    --package-card-link-text-color: #7c2d12;

    --package-carousel-title-color: #121212;
    --package-carousel-description-color: #505050;
    --package-carousel-button-bg: #ffffff;
    --package-carousel-button-border-color: #d8d8d1;
    --package-carousel-button-text-color: #121212;
    --package-carousel-link-bg: #ffd89a;
    --package-carousel-link-border-color: #f2d3a2;
    --package-carousel-link-text-color: #7c2d12;
}