:root {
  /* ──────────────── COLOR SCHEME ──────────────── */


/* Base colors */
--main-navigation-color: #00ffff;
--highlight-color: #ffd86c;
--visited-color: #c080ff;
--footer-text-color: #dddddd;
--content-default-color: #dcdcdc;

/* Logo */
--logo-color: #ffb86c;

/* Structural colors */
--frame-bg-color: #3b5bdb;
--aside-bg-color: #1f2229;
--content-bg-color: #2c313a;
--menu-bg-color: #444;
--menu-shadow-color: rgba(0, 0, 0, 0.3);
--modules-span-bg-color: #191b20;

/* Semantic colors */
--content-color-h1: rgb(255, 83, 255);
--content-color-h2: rgb(62, 208, 67);


  /* ──────────────── TYPOGRAPHY ──────────────── */

  --font-default: 'Fire Code', monospace;

  /* ──────────────── SIZING & SPACING ──────────────── */

/* Logo */
--logo-width: 150px;

/* Header */
--header-height: 50px;
--header-nav-min-width: 150px;
--header-nav-elements-width: var(--header-nav-min-width);

/* Support menu */
--support-span-padding: 0 15px;
--support-conntent-padding: 10px;
--support-content-width: 160px;

/* Modules menu */
--modules-span-padding: 15px 40px;
--modules-span-font-size: 1.1rem;
--modules-height: 100%;

/* Layout */
--aside-width: 301px;
--content-max-width: 906px;
--content-padding: 20px;
--footer-height: 35px;

  /* ──────────────── MISC ──────────────── */

/* Border */
--border-default-width: 1px;
--border-default-color: white;
--border-format: var(--border-default-width) solid var(--border-default-color);
--menu-border-format: var(--border-default-width) solid #666;

/* Cursor */
--menu-cursor: pointer;

/* ──────────────── SHARE ICONS ──────────────── */
--share-icon-size: 50px;
--share-margin-top: 20px;
--share-hover-scale: 1.2;

/* ──────────────── FORMS ──────────────── */
--form-max-width: 500px;
--form-field-spacing: 15px;
--form-input-padding: 10px;
--form-border-radius: 4px;
--form-input-border-color: #ccc;

--form-button-bg: #28a745;
--form-button-hover-bg: #218838;
--form-button-text-color: white;

/* ──────────────── CRYPTO DONATIONS ──────────────── */
--crypto-margin: 2rem auto;
--crypto-address-padding: 0.5rem 1rem;
--crypto-address-font-size: 1rem;
--crypto-qr-size: 200px;

--crypto-note-margin-top: 1rem;
--crypto-note-font-size: 0.9rem;
--crypto-note-color: #aaa;

/* Background alternativo */
--background-alt: #222;

/* ──────────────── MAIN CONTENT ──────────────── */
--content-line-height: 1.3;
--content-text-margin-bottom: 15px;
--content-text-color: var(--content-default-color);

--h1-font-size: 1.5em;
--h2-font-size: 1.2em;
--h3-color: green;

--list-margin-bottom: 15px;
--list-item-margin-bottom: 5px;

--table-gap: 20px;
--table-padding: 5px 10px;
--table-margin-bottom: 15px;
}

@media (max-width: 768px) {
  :root {
    /* Logo */
    --logo-width: fit-content;
    --logo-padding: 0 10px;
    --logo-font-size: small;

    /* Header-title */
    --header-title-text-size: 1.5rem;

    /* Header-nav */
    --header-nav-min-width: none;
    --header-nav-elements-width: fit-content;
    --header-nav-elements-padding: 0 10px;
    --header-nav-elements-font-size: small;

    /* Modules menu */
    --modules-span-padding: 10px;
    --modules-list-width: 200px;
    --modules-height: calc( 100% - var(--header-height) - var(--footer-height));

    /* Support menu */
    --support-span-padding: 0 2px;
    --support-span-font-size: x-small;
    --support-content-width: 140px;

    /* Aside left */
    --aside-l-width: 30px;

    --share-icon-size: 40px;
    --share-margin-top: 15px;
  }
}