/* Load Merriweather and Fira Code from Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Merriweather:wght@300..900&family=Fira+Code:wght@300..700&display=swap");

/* Font and Radius Variables */
:root {
    --monospace-font: "Fira Code", monospace; /* Clean coding font */
    --text-font: "Merriweather", serif; /* Soft serif for warmth and comfort */
    --heading-font: "Merriweather", serif; /* Consistent with text font */
    --radius: 12px; /* Slightly softer corners for a gentler feel */
}

/* Coldme Theme Colors */
:root {
    /* Backgrounds and Foregrounds */
    --background: light-dark(
        #d9e3e5,
        #1c2b2a
    ); /* Soft greyish-blue vs. Deep teal */
    --background-darker: light-dark(
        #c5d1d3,
        #162322
    ); /* Slightly darker variants */
    --foreground: light-dark(#4a5957, #b0c4c3); /* Dimmed foreground */
    --muted: #9abcbe; /* Soft teal */
    --muted-foreground: light-dark(
        #6a7b79,
        #c8dcdf
    ); /* Darker/lighter variants */

    /* UI Elements */
    --card: light-dark(
        #e8eef0,
        #243635
    ); /* Lighter/darker variants of background */
    --card-foreground: light-dark(
        #4a5957,
        #d5e1e0
    ); /* Foreground colors for cards */
    --popover: light-dark(#d9e3e5, #1c2b2a); /* Same as background */
    --popover-foreground: light-dark(
        #4a5957,
        #d5e1e0
    ); /* Same as card-foreground */
    --border: light-dark(#b8cccf, #2e4241); /* Subtle border colors */
    --input: light-dark(
        #c5d1d3,
        #243635
    ); /* Slightly different from background */

    /* Primary Colors */
    --primary: #2e8b83; /* Relaxing turquoise */
    --primary-foreground: #ffffff; /* White for contrast */
    --secondary: #bbd8dd; /* Gentle powder blue */
    --secondary-foreground: #1c2b2a; /* Deep teal for contrast */
    --accent: #74b3a1; /* Calm seafoam */
    --accent-foreground: light-dark(
        #1c1e1e,
        #e0f0f0
    ); /* Dimmed accent foreground */

    /* Semantic Colors */
    --error: #ff6b81; /* Soft rose red */
    --success: #6bb893; /* Muted green */
    --destructive: #e15a5a; /* Softer red for destructive actions */
    --action: #4a7c94; /* Muted blue for actions */
    --link: #4a7c94; /* Muted blue for links */
    --link-visited: #6a8ca4; /* Slightly lighter blue for visited links */

    /* Shadows */
    --base-shadow: light-dark(
        hsla(190, 10%, 20%, 10%),
        hsla(180, 15%, 5%, 20%)
    ); /* Subtle shadows */

    --base-shadow-darker: light-dark(
        hsla(190, 10%, 20%, 20%),
        hsla(180, 15%, 5%, 30%)
    ); /* Slightly darker shadows */

    --base-shadow-opacity: 5%; /* Very subtle shadow depth */
}
