/*
 * Theme: InfraLinux "Phosphor & Schematic" v1.6
 * Concept: Industrial Warmth / Classic Unix Engineering
 * Fix: Selector mismatch correction (Targeting Org-mode's #preamble structure)
 */

/* ==========================================================================
   1. THEME VARIABLES (Dynamic System)
   ========================================================================== */

:root {
    /* --- DEFAULT: DARK MODE (Identity: "Phosphor") --- */
    --bg-color: #1d2021;          /* Grafite Profundo */
    --surface-bg: #282828;        /* Superfície elevada */
    --surface-highlight: #3c3836; /* Hover / Seleção */

    /* Typography */
    --text-main: #ebdbb2;         /* "Old Paper" */
    --text-dim: #a89984;          /* Metadados */
    --text-faint: #504945;        /* Detalhes sutis */

    /* Accents */
    --accent-primary: #d79921;    /* Âmbar Industrial */
    --accent-secondary: #458588;  /* Ciano Muted */
    --accent-alert: #cc241d;      /* Vermelho Tijolo */
    --accent-success: #98971a;    /* Verde Oliva */

    /* Structure */
    --border-dim: #3c3836;
    --border-sharp: #504945;
    --selection-bg: #504945;

    /* Code Blocks */
    --code-bg: #141617;           /* Mais escuro que o fundo */
    --code-border: #32302f;

    /* Syntax Highlighting (Dark) */
    --syntax-fg: #d5c4a1;
    --syntax-comment: #5a524c;
    --syntax-keyword: #b16286;
    --syntax-string: #98971a;
    --syntax-func: #689d6a;
    --syntax-type: #d79921;
    --syntax-const: #d65d0e;
    --syntax-builtin: #458588;

    /* Fonts */
    --font-sans: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-mono: "Iosevka", "JetBrains Mono", "Consolas", "Monaco", monospace;
}

/* --- LIGHT MODE (Identity: "Schematic") --- */
@media (prefers-color-scheme: light) {
  :root {
    --bg-color: #fbf1c7;
    --surface-bg: #ebdbb2;
    --surface-highlight: #d5c4a1;

    --text-main: #3c3836;
    --text-dim: #7c6f64;
    --text-faint: #928374;

    --accent-primary: #b57614;
    --accent-secondary: #076678;
    --accent-alert: #9d0006;
    --accent-success: #79740e;

    --border-dim: #d5c4a1;
    --border-sharp: #bdae93;
    --selection-bg: #d5c4a1;

    --code-bg: #f2e5bc;
    --code-border: #d5c4a1;

    /* Syntax Highlighting (Light) */
    --syntax-fg: #3c3836;
    --syntax-comment: #928374;
    --syntax-keyword: #8f3f71;
    --syntax-string: #79740e;
    --syntax-func: #427b58;
    --syntax-type: #b57614;
    --syntax-const: #af3a03;
    --syntax-builtin: #076678;
  }
}

html.light-theme {
    /* Manual Override */
    --bg-color: #fbf1c7;
    --surface-bg: #ebdbb2;
    --surface-highlight: #d5c4a1;
    --text-main: #3c3836;
    --text-dim: #7c6f64;
    --text-faint: #928374;
    --accent-primary: #b57614;
    --accent-secondary: #076678;
    --accent-alert: #9d0006;
    --accent-success: #79740e;
    --border-dim: #d5c4a1;
    --border-sharp: #bdae93;
    --selection-bg: #d5c4a1;
    --code-bg: #f2e5bc;
    --code-border: #d5c4a1;
    --syntax-fg: #3c3836;
    --syntax-comment: #928374;
    --syntax-keyword: #8f3f71;
    --syntax-string: #79740e;
    --syntax-func: #427b58;
    --syntax-type: #b57614;
    --syntax-const: #af3a03;
    --syntax-builtin: #076678;
}


/* ==========================================================================
   2. BASIC RESET & NORMALIZE
   ========================================================================== */
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}

html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }


/* ==========================================================================
   3. CORE STYLES
   ========================================================================== */
body {
    padding: 2% 0;
    font-size: 16px; /* Base size */
    line-height: 1.6;
    font-family: var(--font-sans);
    background-color: var(--bg-color);
    color: var(--text-main);
}

html.transitioning,
html.transitioning body {
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg-color); }
::-webkit-scrollbar-thumb { background: var(--border-sharp); border: 2px solid var(--bg-color); }
::-webkit-scrollbar-thumb:hover { background: var(--accent-primary); }

::selection { background: var(--selection-bg); color: inherit; }
::-moz-selection { background: var(--selection-bg); color: inherit; }


/* ==========================================================================
   4. LAYOUT (ESTRATÉGIA: SATÉLITE ANCORADO)
   Updated Selectors to match Org-mode HTML (#preamble, nav, header tags)
   ========================================================================== */

/* A "Âncora": Containers principais centralizados. */
#preamble,
#content,
#postamble {
    width: 95%;
    max-width: 900px;
    margin: 0 auto;
    box-sizing: border-box;
    display: block;
}

/* 
   O Header e Nav dentro do Preamble. 
   O HTML é <div id="preamble"><header>...</header><nav>...</nav></div>
*/
#preamble header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5em 0;
    margin-bottom: 2em;
}

/* Branding Specifics: Terminal Font for Main Logo inside Preamble */
#preamble h1 {
    font-family: 'Consolas', 'Monaco', 'Andale Mono', 'Ubuntu Mono', 'monospace';
    letter-spacing: -0.05em; /* Tighter tracking for display mono */
    font-weight: 700;
}

/* Navigation specific styling (optional, keeps it clean) */
#preamble nav {
    margin-bottom: 1em;
}

hr {
    border: none;
    border-top: 1px solid var(--border-dim);
    margin: 1.5em 0; /* Vertical spacing only */
    width: 100%;
    height: 1px;
}

/* Regras para telas médias (laptops, tablets) a partir de 601px */
@media screen and (min-width: 601px) {
    body { font-size: 16px; }

    #preamble,
    #content,
    #postamble {
        max-width: 750px;
    }

    h1 { font-size: 2.2em; }
    h2 { font-size: 1.6em; }
    h3 { font-size: 1.3em; }
    .creator { display: inline; float: right; }
}

/* Sobrescrita para telas grandes, a partir de 1367px */
@media screen and (min-width: 1367px) {
    body { font-size: 18px; }

    #preamble,
    #content,
    #postamble {
        max-width: 900px;
    }
}

/* Estado 1: Sidebar fixa em telas de médio porte (laptops) */
@media screen and (min-width: 1025px) and (max-width: 1366px) {
    body:has(#sidebar) #sidebar {
        position: fixed;
        top: 150px;
        left: calc(50% + 375px + 2em); /* Alinhado ao miolo */
        width: 20%;
        max-width: 450px;
        height: calc(100vh - 170px);
        overflow-y: auto;
    }
}

/* Estado 2: Sidebar fixa em telas grandes */
@media screen and (min-width: 1367px) {
    body:has(#sidebar) #sidebar {
        position: fixed;
        top: 150px;
        left: calc(50% + 450px + 2em);
        width: 25%;
        max-width: 450px;
        height: calc(100vh - 170px);
        overflow-y: auto;
    }
}

/* Estilo da Sidebar */
#sidebar {
    font-family: var(--font-sans);
}

#sidebar .outline-2 {
    padding: 1em;
    margin: 0 0 1.5em 0;
    background-color: var(--surface-bg);
    border: 1px solid var(--border-dim);
    border-radius: 5px;
    font-size: 0.9em;
}

#sidebar h2 {
    font-size: 1.1em;
    margin-top: 0;
    margin-bottom: 0.8em;
    border-bottom: 1px solid var(--border-dim);
    padding-bottom: 0.4em;
    color: var(--accent-primary);
}

#sidebar ul {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
    font-size: 0.95em;
}

#sidebar li {
    margin-bottom: 0.5em;
    line-height: 1.3;
}

#sidebar a {
    color: var(--text-dim);
}
#sidebar a:hover {
    color: var(--accent-primary);
}

/* Responsividade: Em telas menores, o "satélite" volta ao fluxo normal */
@media screen and (max-width: 1024px) {
    #sidebar {
        position: static;
        width: 95%;
        max-width: 900px;
        margin: 2em auto;
        height: auto;
        overflow-y: visible;
    }
}


/* ==========================================================================
   5. TYPOGRAPHY AND CONTENT STYLING
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
    line-height: 1.2;
    color: var(--text-main);
    font-weight: 700;
    letter-spacing: -0.02em;
}

h1 {
    color: var(--accent-primary);
    margin-bottom: 0.6em;
}

h2, h3, h4, h5, h6 { color: var(--text-main); }
h2 { border-bottom: 1px solid var(--border-dim); padding-bottom: 0.3em; margin-top: 1.5em; }
h3 { color: var(--accent-secondary); margin-top: 1.3em; }

p { margin: 1em auto; }
dl, ol, ul { margin: 0 auto 1em auto; }

/* Links */
a {
    color: var(--accent-primary);
    text-decoration: none;
}
a:hover {
    color: var(--text-main);
    border-bottom: 1px dotted var(--accent-primary);
    background-color: rgba(215, 153, 33, 0.1);
}

/* Figures and Images */
figure {
    padding: 0;
    margin: 1em auto;
    text-align: center;
}
img {
    max-width: 100%;
    vertical-align: middle;
    border: 1px solid var(--border-dim);
    background-color: #000;
    padding: 2px;
}
figcaption {
    margin-top: .3em;
    font-size: 90%;
    color: var(--text-dim);
    font-family: var(--font-mono);
}

/* Tables (InfraLinux style) */
.table-responsive {
    width: 100%;
    margin: 1em auto;
    overflow-x: auto;
}

table {
    margin: 1em auto;
    border: 1px solid var(--border-dim);
    border-collapse: collapse;
    font-size: 0.9em;
    font-family: var(--font-mono);
    width: 100%;
}
table th {
    color: var(--accent-primary);
    background-color: var(--surface-bg);
    border-bottom: 2px solid var(--border-dim);
    padding: 0.75em;
    text-align: left;
}
table td {
    padding: 0.6em 0.75em;
    border-bottom: 1px solid var(--border-dim);
    border-left: 1px solid var(--surface-bg);
}
table tr:hover td { background-color: var(--surface-bg); }

/* Blockquotes */
blockquote {
    margin: 1em 2em;
    padding-left: 1em;
    border-left: 4px solid var(--accent-secondary);
    color: var(--text-dim);
    font-style: italic;
    background-color: var(--surface-bg);
}

/* KBD, TODO, DONE */
kbd {
    background-color: var(--surface-bg);
    color: var(--text-main);
    border: 1px solid var(--border-dim);
    border-radius: 3px;
    font-size: 80%;
    margin: 0 .1em;
    padding: .1em .6em;
    font-family: var(--font-mono);
}

.todo, .done {
    padding: .1em .3em;
    border-radius: 2px;
    font-size: 0.75em;
    font-family: var(--font-mono);
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1;
}
.todo { background-color: var(--accent-alert); color: var(--bg-color); }
.done { background-color: var(--accent-success); color: var(--bg-color); }

.priority {
    color: var(--accent-primary);
    font-family: var(--font-mono);
    font-weight: bold;
    border: 1px solid var(--accent-primary);
    padding: 1px 4px;
}

/* Tags */
.tag { font-family: var(--font-mono); font-size: 0.8em; }
.tag span {
    padding: 2px 8px;
    float: right;
    margin-right: .5em;
    border: 1px solid var(--border-dim);
    border-radius: 3px;
    color: var(--accent-secondary);
    background-color: var(--surface-bg);
    line-height: 1;
}

/* Footnotes */
#footnotes {
    font-size: 0.85em;
    border-top: 1px solid var(--border-dim);
    padding-top: 1em;
    margin-top: 3em;
    color: var(--text-dim);
}


/* ==========================================================================
   6. CODE & SYNTAX (Embedded Terminal)
   ========================================================================== */
:not(pre)>code {
    padding: 2px 5px;
    margin: auto 1px;
    border: 1px solid var(--border-dim);
    border-radius: 3px;
    color: var(--text-main);
    background-color: var(--surface-bg);
    font-size: 0.9em;
    font-family: var(--font-mono);
}

.org-src-container {
    border: 1px solid var(--code-border);
    font-family: var(--font-mono);
    font-size: 0.9em;
    margin: 1.5em auto;
    position: relative;
    background-color: var(--code-bg);
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
}

.org-src-container>pre {
    overflow: auto;
    color: var(--syntax-fg);
    padding: 1.2em;
    margin: 0;
    line-height: 1.5;
}

/* Language labels */
.org-src-container>pre:before {
    display: block;
    position: absolute;
    background-color: var(--surface-bg);
    top: 0;
    right: 0;
    padding: 2px 8px;
    border-bottom-left-radius: 4px;
    border-left: 1px solid var(--code-border);
    border-bottom: 1px solid var(--code-border);
    color: var(--text-dim);
    font-size: 0.75em;
    font-family: var(--font-sans);
    text-transform: uppercase;
    font-weight: bold;
}

/* Hardcoded labels preserved */
.org-src-container>pre.src-sh:before{content:"sh"}.org-src-container>pre.src-bash:before{content:"bash"}.org-src-container>pre.src-emacs-lisp:before{content:"Emacs Lisp"}.org-src-container>pre.src-R:before{content:"R"}.org-src-container>pre.src-cpp:before{content:"C++"}.org-src-container>pre.src-c:before{content:"C"}.org-src-container>pre.src-html:before{content:"HTML"}.org-src-container>pre.src-javascript:before,.org-src-container>pre.src-js:before{content:"Javascript"}.org-src-container>pre.src-python:before{content:"Python"}.org-src-container>pre.src-css:before{content:"CSS"}.org-src-container>pre.src-sql:before{content:"SQL"}.org-src-container>pre.src-yaml:before{content:"YAML"}

/* Syntax Highlighting */
.org-comment, .org-comment-delimiter { color: var(--syntax-comment); font-style: italic; }
.org-string { color: var(--syntax-string); }
.org-keyword { color: var(--syntax-keyword); font-weight: bold; }
.org-function-name { color: var(--syntax-function); }
.org-variable-name { color: var(--text-main); }
.org-constant { color: var(--syntax-const); }
.org-type { color: var(--syntax-type); }
.org-builtin { color: var(--syntax-builtin); }
.org-preprocessor { color: var(--syntax-keyword); }
.org-warning { color: var(--accent-alert); font-weight: bold; }

/* Misc */
.linenr { font-size: 90%; color: var(--text-faint); padding-right:1em; border-right:1px solid var(--border-dim); }
#bibliography { font-size: 90%; }
.creator { display: block; color: var(--text-dim); margin-top: 2em; text-align: center;}
@media screen and (min-width:600px){ .creator{ display:inline; float:right; margin-top: 0; } }