/* ============================================================
   Code Window Shortcode Styles
   Uso: {{< code lang="go" theme="TEMA" title="arquivo.go" >}}
   Temas disponíveis: terminal | synthwave | catppuccin-latte | catppuccin-mocha
   ============================================================ */

/* ------------------------------------------------------------
   Estrutura base (comum a todos os temas)
   ------------------------------------------------------------ */
.code-window {
    border-radius: 10px;
    overflow: hidden;
    margin: 1.75rem 0;
    font-size: 0.875rem;
    line-height: 1.65;
    position: relative;
}

.code-window__header {
    display: flex;
    align-items: center;
    padding: 0.55rem 1rem;
    gap: 0.6rem;
    user-select: none;
    min-height: 2.4rem;
    position: relative;
    z-index: 1;
}

/* Dots (traffic lights) */
.code-window__dots {
    display: flex;
    gap: 7px;
    flex-shrink: 0;
}

.code-window__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

/* Title bar text */
.code-window__title {
    flex: 1;
    text-align: center;
    font-size: 1rem;
    font-family:
        "JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas",
        ui-monospace, monospace;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Language badge (canto direito) */
.code-window__lang-badge {
    font-size: 0.92rem;
    padding: 2px 8px;
    border-radius: 4px;
    flex-shrink: 0;
    font-family:
        "JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas",
        ui-monospace, monospace;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Body — envolve o <pre><code> */
.code-window__body {
    position: relative;
    overflow: hidden;
}

.code-window__body pre {
    margin: 0 !important;
    padding: 1.2rem 1.5rem !important;
    border-radius: 0 !important;
    border: none !important;
    overflow-x: auto;
    font-family:
        "JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas",
        ui-monospace, monospace !important;
    font-size: 1.2rem !important;
    line-height: 1.65 !important;
}

.code-window__body pre code {
    font-family: inherit !important;
    font-size: inherit !important;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    white-space: pre;
}

/* Scrollbar personalizada para o body do código */
.code-window__body pre::-webkit-scrollbar {
    height: 5px;
}
.code-window__body pre::-webkit-scrollbar-track {
    background: transparent;
}
.code-window__body pre::-webkit-scrollbar-thumb {
    border-radius: 3px;
}

/* ============================================================
   TEMA: Terminal
   Dark, glassmorphism semi-transparente com blur
   ============================================================ */
.code-window--terminal {
    border: 1px solid rgba(0, 230, 80, 0.18);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(0, 230, 80, 0.08),
        inset 0 1px 0 rgba(0, 230, 80, 0.08);
}

.code-window--terminal .code-window__header {
    background: rgba(4, 14, 4, 0.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(0, 230, 80, 0.14);
}

.code-window--terminal .code-window__dot--close {
    background: #ff5f57;
}
.code-window--terminal .code-window__dot--minimize {
    background: #febc2e;
}
.code-window--terminal .code-window__dot--maximize {
    background: #28c840;
}

.code-window--terminal .code-window__title {
    color: rgba(0, 230, 80, 0.65);
    letter-spacing: 0.06em;
}

.code-window--terminal .code-window__lang-badge {
    background: rgba(0, 230, 80, 0.09);
    color: rgba(0, 230, 80, 0.55);
    border: 1px solid rgba(0, 230, 80, 0.2);
}

/* Glassmorphism: fundo semi-transparente + blur */
.code-window--terminal .code-window__body {
    background: rgba(4, 16, 6, 0.82);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-radius: 0 0 10px 10px;
}

/* O <pre> fica transparente para o blur do body aparecer */
.code-window--terminal .code-window__body pre {
    background: transparent !important;
}

/* Scrollbar terminal */
.code-window--terminal .code-window__body pre::-webkit-scrollbar-thumb {
    background: rgba(0, 230, 80, 0.2);
}

/* ---- Syntax: Terminal (baseado em Atom One Dark, tom verde) ---- */
.code-window--terminal .hljs {
    background: transparent;
    color: #abb2bf;
}
.code-window--terminal .hljs-keyword,
.code-window--terminal .hljs-selector-tag,
.code-window--terminal .hljs-tag {
    color: #c678dd;
}
.code-window--terminal .hljs-built_in,
.code-window--terminal .hljs-type {
    color: #56b6c2;
}
.code-window--terminal .hljs-literal,
.code-window--terminal .hljs-number {
    color: #d19a66;
}
.code-window--terminal .hljs-string,
.code-window--terminal .hljs-regexp {
    color: #98c379;
}
.code-window--terminal .hljs-title,
.code-window--terminal .hljs-title.class_,
.code-window--terminal .hljs-title.function_ {
    color: #61afef;
}
.code-window--terminal .hljs-comment,
.code-window--terminal .hljs-doctag {
    color: #5c6370;
    font-style: italic;
}
.code-window--terminal .hljs-variable,
.code-window--terminal .hljs-template-variable {
    color: #e06c75;
}
.code-window--terminal .hljs-attr,
.code-window--terminal .hljs-attribute {
    color: #d19a66;
}
.code-window--terminal .hljs-name {
    color: #e06c75;
}
.code-window--terminal .hljs-operator,
.code-window--terminal .hljs-punctuation {
    color: #abb2bf;
}
.code-window--terminal .hljs-meta {
    color: #98c379;
}
.code-window--terminal .hljs-section {
    color: #61afef;
}
.code-window--terminal .hljs-selector-class,
.code-window--terminal .hljs-selector-id {
    color: #d19a66;
}
.code-window--terminal .hljs-addition {
    color: #98c379;
    background: rgba(152, 195, 121, 0.12);
}
.code-window--terminal .hljs-deletion {
    color: #e06c75;
    background: rgba(224, 108, 117, 0.12);
}
.code-window--terminal .hljs-params {
    color: #abb2bf;
}
.code-window--terminal .hljs-subst {
    color: #abb2bf;
}
.code-window--terminal .hljs-symbol {
    color: #56b6c2;
}

/* ============================================================
   TEMA: Synthwave '84
   Dark neon, roxo/pink com glow
   ============================================================ */
.code-window--synthwave {
    border: 1px solid rgba(255, 60, 172, 0.35);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.6),
        0 0 24px rgba(255, 60, 172, 0.12),
        0 0 64px rgba(255, 60, 172, 0.06);
}

.code-window--synthwave .code-window__header {
    background: linear-gradient(90deg, #26083d 0%, #1a0530 60%, #0d0021 100%);
    border-bottom: 1px solid rgba(255, 60, 172, 0.35);
}

.code-window--synthwave .code-window__dot--close {
    background: #ff3c82;
    box-shadow: 0 0 6px rgba(255, 60, 130, 0.7);
}
.code-window--synthwave .code-window__dot--minimize {
    background: #ff9f00;
    box-shadow: 0 0 6px rgba(255, 159, 0, 0.7);
}
.code-window--synthwave .code-window__dot--maximize {
    background: #36f9c5;
    box-shadow: 0 0 6px rgba(54, 249, 197, 0.7);
}

.code-window--synthwave .code-window__title {
    color: #ff3c82;
    text-shadow: 0 0 10px rgba(255, 60, 130, 0.65);
    letter-spacing: 0.08em;
}

.code-window--synthwave .code-window__lang-badge {
    background: rgba(255, 60, 130, 0.12);
    color: #ff3c82;
    border: 1px solid rgba(255, 60, 130, 0.4);
    text-shadow: 0 0 6px rgba(255, 60, 130, 0.5);
}

.code-window--synthwave .code-window__body pre {
    background: #2b213a !important;
}

/* Scrollbar synthwave */
.code-window--synthwave .code-window__body pre::-webkit-scrollbar-thumb {
    background: rgba(255, 60, 172, 0.3);
}

/* ---- Syntax: Synthwave '84 ---- */
.code-window--synthwave .hljs {
    background: #2b213a;
    color: #ffffff;
}
.code-window--synthwave .hljs-keyword,
.code-window--synthwave .hljs-operator,
.code-window--synthwave .hljs-selector-tag {
    color: #ff7edb;
    text-shadow: 0 0 8px rgba(255, 126, 219, 0.5);
}
.code-window--synthwave .hljs-built_in {
    color: #72f1b8;
    text-shadow: 0 0 6px rgba(114, 241, 184, 0.4);
}
.code-window--synthwave .hljs-type,
.code-window--synthwave .hljs-title.class_ {
    color: #fede5d;
    text-shadow: 0 0 6px rgba(254, 222, 93, 0.35);
}
.code-window--synthwave .hljs-literal,
.code-window--synthwave .hljs-number,
.code-window--synthwave .hljs-regexp {
    color: #f97e72;
    text-shadow: 0 0 6px rgba(249, 126, 114, 0.35);
}
.code-window--synthwave .hljs-string {
    color: #ff8b39;
    text-shadow: 0 0 6px rgba(255, 139, 57, 0.35);
}
.code-window--synthwave .hljs-title,
.code-window--synthwave .hljs-title.function_ {
    color: #36f9f6;
    text-shadow: 0 0 8px rgba(54, 249, 246, 0.45);
}
.code-window--synthwave .hljs-comment,
.code-window--synthwave .hljs-doctag {
    color: #848bbd;
    font-style: italic;
}
.code-window--synthwave .hljs-variable,
.code-window--synthwave .hljs-template-variable {
    color: #fe4450;
}
.code-window--synthwave .hljs-attr,
.code-window--synthwave .hljs-attribute {
    color: #ff8b39;
}
.code-window--synthwave .hljs-name {
    color: #ff7edb;
}
.code-window--synthwave .hljs-meta {
    color: #72f1b8;
}
.code-window--synthwave .hljs-section {
    color: #36f9f6;
}
.code-window--synthwave .hljs-selector-class,
.code-window--synthwave .hljs-selector-id {
    color: #fede5d;
    text-shadow: 0 0 5px rgba(254, 222, 93, 0.3);
}
.code-window--synthwave .hljs-addition {
    color: #72f1b8;
    background: rgba(114, 241, 184, 0.1);
}
.code-window--synthwave .hljs-deletion {
    color: #fe4450;
    background: rgba(254, 68, 80, 0.1);
}
.code-window--synthwave .hljs-params {
    color: #fede5d;
}
.code-window--synthwave .hljs-punctuation {
    color: #ccc;
}
.code-window--synthwave .hljs-symbol {
    color: #36f9f6;
}
.code-window--synthwave .hljs-subst {
    color: #fff;
}

/* ============================================================
   TEMA: Catppuccin Latte (light)
   ============================================================ */
.code-window--catppuccin-latte {
    border: 1px solid #bcc0cc;
    box-shadow: 0 4px 20px rgba(76, 79, 105, 0.12);
}

.code-window--catppuccin-latte .code-window__header {
    background: #e6e9ef;
    border-bottom: 1px solid #ccd0da;
}

.code-window--catppuccin-latte .code-window__dot--close {
    background: #d20f39;
}
.code-window--catppuccin-latte .code-window__dot--minimize {
    background: #df8e1d;
}
.code-window--catppuccin-latte .code-window__dot--maximize {
    background: #40a02b;
}

.code-window--catppuccin-latte .code-window__title {
    color: #5c5f77;
    font-weight: 500;
}

.code-window--catppuccin-latte .code-window__lang-badge {
    background: #dce0e8;
    color: #7287fd;
    border: 1px solid #bcc0cc;
}

.code-window--catppuccin-latte .code-window__body pre {
    background: #eff1f5 !important;
}

/* Scrollbar latte */
.code-window--catppuccin-latte .code-window__body pre::-webkit-scrollbar-thumb {
    background: #bcc0cc;
}

/* ---- Syntax: Catppuccin Latte ---- */
.code-window--catppuccin-latte .hljs {
    background: #eff1f5;
    color: #4c4f69;
}
.code-window--catppuccin-latte .hljs-keyword,
.code-window--catppuccin-latte .hljs-operator,
.code-window--catppuccin-latte .hljs-selector-tag {
    color: #8839ef;
} /* Mauve */
.code-window--catppuccin-latte .hljs-built_in {
    color: #04a5e5;
} /* Sky */
.code-window--catppuccin-latte .hljs-type,
.code-window--catppuccin-latte .hljs-title.class_ {
    color: #df8e1d;
} /* Yellow */
.code-window--catppuccin-latte .hljs-literal,
.code-window--catppuccin-latte .hljs-number {
    color: #fe640b;
} /* Peach */
.code-window--catppuccin-latte .hljs-regexp {
    color: #ea76cb;
} /* Pink */
.code-window--catppuccin-latte .hljs-string {
    color: #40a02b;
} /* Green */
.code-window--catppuccin-latte .hljs-title,
.code-window--catppuccin-latte .hljs-title.function_ {
    color: #1e66f5;
} /* Blue */
.code-window--catppuccin-latte .hljs-comment,
.code-window--catppuccin-latte .hljs-doctag {
    color: #8c8fa1;
    font-style: italic;
} /* Overlay1 */
.code-window--catppuccin-latte .hljs-variable,
.code-window--catppuccin-latte .hljs-template-variable {
    color: #dc8a78;
} /* Rosewater */
.code-window--catppuccin-latte .hljs-attr,
.code-window--catppuccin-latte .hljs-attribute {
    color: #fe640b;
} /* Peach */
.code-window--catppuccin-latte .hljs-name {
    color: #d20f39;
} /* Red */
.code-window--catppuccin-latte .hljs-meta {
    color: #40a02b;
}
.code-window--catppuccin-latte .hljs-section {
    color: #1e66f5;
}
.code-window--catppuccin-latte .hljs-selector-class,
.code-window--catppuccin-latte .hljs-selector-id {
    color: #fe640b;
}
.code-window--catppuccin-latte .hljs-addition {
    color: #40a02b;
    background: rgba(64, 160, 43, 0.1);
}
.code-window--catppuccin-latte .hljs-deletion {
    color: #d20f39;
    background: rgba(210, 15, 57, 0.1);
}
.code-window--catppuccin-latte .hljs-params {
    color: #fe640b;
}
.code-window--catppuccin-latte .hljs-punctuation {
    color: #5c5f77;
}
.code-window--catppuccin-latte .hljs-symbol {
    color: #04a5e5;
}
.code-window--catppuccin-latte .hljs-subst {
    color: #4c4f69;
}

/* ============================================================
   TEMA: Catppuccin Mocha (dark)
   ============================================================ */
.code-window--catppuccin-mocha {
    border: 1px solid #313244;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

.code-window--catppuccin-mocha .code-window__header {
    background: #181825;
    border-bottom: 1px solid #313244;
}

.code-window--catppuccin-mocha .code-window__dot--close {
    background: #f38ba8;
}
.code-window--catppuccin-mocha .code-window__dot--minimize {
    background: #f9e2af;
}
.code-window--catppuccin-mocha .code-window__dot--maximize {
    background: #a6e3a1;
}

.code-window--catppuccin-mocha .code-window__title {
    color: #a6adc8;
    font-weight: 500;
}

.code-window--catppuccin-mocha .code-window__lang-badge {
    background: #11111b;
    color: #b4befe;
    border: 1px solid #45475a;
}

.code-window--catppuccin-mocha .code-window__body pre {
    background: #1e1e2e !important;
}

/* Scrollbar mocha */
.code-window--catppuccin-mocha .code-window__body pre::-webkit-scrollbar-thumb {
    background: #45475a;
}

/* ---- Syntax: Catppuccin Mocha ---- */
.code-window--catppuccin-mocha .hljs {
    background: #1e1e2e;
    color: #cdd6f4;
}
.code-window--catppuccin-mocha .hljs-keyword,
.code-window--catppuccin-mocha .hljs-operator,
.code-window--catppuccin-mocha .hljs-selector-tag {
    color: #cba6f7;
} /* Mauve */
.code-window--catppuccin-mocha .hljs-built_in {
    color: #89dceb;
} /* Sky */
.code-window--catppuccin-mocha .hljs-type,
.code-window--catppuccin-mocha .hljs-title.class_ {
    color: #f9e2af;
} /* Yellow */
.code-window--catppuccin-mocha .hljs-literal,
.code-window--catppuccin-mocha .hljs-number {
    color: #fab387;
} /* Peach */
.code-window--catppuccin-mocha .hljs-regexp {
    color: #f5c2e7;
} /* Pink */
.code-window--catppuccin-mocha .hljs-string {
    color: #a6e3a1;
} /* Green */
.code-window--catppuccin-mocha .hljs-title,
.code-window--catppuccin-mocha .hljs-title.function_ {
    color: #89b4fa;
} /* Blue */
.code-window--catppuccin-mocha .hljs-comment,
.code-window--catppuccin-mocha .hljs-doctag {
    color: #6c7086;
    font-style: italic;
} /* Overlay0 */
.code-window--catppuccin-mocha .hljs-variable,
.code-window--catppuccin-mocha .hljs-template-variable {
    color: #f2cdcd;
} /* Flamingo */
.code-window--catppuccin-mocha .hljs-attr,
.code-window--catppuccin-mocha .hljs-attribute {
    color: #fab387;
} /* Peach */
.code-window--catppuccin-mocha .hljs-name {
    color: #f38ba8;
} /* Red */
.code-window--catppuccin-mocha .hljs-meta {
    color: #a6e3a1;
}
.code-window--catppuccin-mocha .hljs-section {
    color: #89b4fa;
}
.code-window--catppuccin-mocha .hljs-selector-class,
.code-window--catppuccin-mocha .hljs-selector-id {
    color: #fab387;
}
.code-window--catppuccin-mocha .hljs-addition {
    color: #a6e3a1;
    background: rgba(166, 227, 161, 0.1);
}
.code-window--catppuccin-mocha .hljs-deletion {
    color: #f38ba8;
    background: rgba(243, 139, 168, 0.1);
}
.code-window--catppuccin-mocha .hljs-params {
    color: #fab387;
}
.code-window--catppuccin-mocha .hljs-punctuation {
    color: #a6adc8;
}
.code-window--catppuccin-mocha .hljs-symbol {
    color: #89dceb;
}
.code-window--catppuccin-mocha .hljs-subst {
    color: #cdd6f4;
}

/* ============================================================
   Ajuste para dark-mode global:
   Catppuccin Latte mantém cores light mesmo em dark-mode.
   Os outros temas já são dark e se auto-contêm.
   ============================================================ */
html.dark-mode .code-window--catppuccin-latte .hljs,
html.dark-mode .code-window--catppuccin-latte .code-window__body pre {
    /* Latte é explicitamente light — forçar mesmo em dark mode */
    background: #eff1f5 !important;
    color: #4c4f69;
}