/* minha-dose-de-ia/assets/css/style.css */

/* ===== 1. Tokens e modo claro ===== */
:root{
  --bg-main:#0B0C10; --bg-card:#1F2833; --bg-input:#12161D;
  --text-main:#FFFFFF; --text-muted:#C5C6C7;
  --border-theme:rgba(255,255,255,0.1);
  --accent-cyan:#66FCF1; --accent-teal:#45A29E;
  --accent-glow:rgba(102,252,241,0.12);
  --t:200ms ease;
}
html.light{
  --bg-main:#F4F6F8; --bg-card:#FFFFFF; --bg-input:#FFFFFF;
  --text-main:#0F172A; --text-muted:#334155;
  --border-theme:rgba(0,0,0,0.12);
  --accent-cyan:#007A78; --accent-teal:#0F766E;
  --accent-glow:rgba(0,122,120,0.12);
}
html{scroll-behavior:smooth;}
body{background:var(--bg-main);color:var(--text-main);}

/* Bordas retas em tudo, sem exceção */
*,*::before,*::after{border-radius:0 !important;box-shadow:none;}

img,svg{max-width:100%;height:auto;display:block;}
::selection{background:var(--accent-cyan);color:#0B0C10;}
:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px;}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ===== 2. Header sticky ===== */
.mdi-header{
  position:sticky;top:0;z-index:90;
  background:color-mix(in srgb,var(--bg-main) 80%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border-theme);
}
@supports not (background:color-mix(in srgb,red,blue)){.mdi-header{background:var(--bg-main);}}
.mdi-logo{font-family:Poppins,sans-serif;font-weight:800;letter-spacing:-.02em;}
.mdi-logo__badge{
  display:inline-block;padding:.15em .45em;margin-left:.35em;
  background:var(--accent-cyan);color:#0B0C10;font-size:.7em;font-weight:700;vertical-align:middle;
}
.mdi-header .wp-block-navigation a{
  color:var(--text-muted);font-size:.9375rem;font-weight:500;text-decoration:none;transition:color var(--t);
}
.mdi-header .wp-block-navigation a:hover,
.mdi-header .wp-block-navigation .current-menu-item a{color:var(--accent-cyan);text-decoration:none;}

.mdi-icon-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--bg-input);color:var(--text-muted);
  border:1px solid var(--border-theme);padding:.5rem .75rem;
  font:inherit;font-size:.8125rem;cursor:pointer;transition:all var(--t);
}
.mdi-icon-btn:hover{border-color:var(--accent-cyan);color:var(--accent-cyan);box-shadow:0 0 20px var(--accent-glow);}
.mdi-kbd{border:1px solid var(--border-theme);padding:0 .35rem;font-size:.6875rem;letter-spacing:.04em;}
@media (max-width:640px){.mdi-kbd{display:none;}}
.mdi-theme-toggle__moon{display:none;}
html.light .mdi-theme-toggle__sun{display:none;}
html.light .mdi-theme-toggle__moon{display:inline;}

/* ===== 3. Cards / grids ===== */
.mdi-grid > .wp-block-post-template,
.mdi-grid ul.wp-block-post-template{gap:1.5rem;}
.mdi-card,
.wp-block-post.mdi-card{
  background:var(--bg-card);border:1px solid var(--border-theme);
  padding:0;display:flex;flex-direction:column;
  transition:transform var(--t),border-color var(--t),box-shadow var(--t);
}
.mdi-card:hover{transform:translateY(-2px);border-color:var(--accent-cyan);box-shadow:0 0 28px var(--accent-glow);}
.mdi-card .wp-block-post-featured-image img{aspect-ratio:16/9;object-fit:cover;width:100%;}
.mdi-card .wp-block-post-title{margin:0 0 .5rem;font-size:1.0625rem;line-height:1.35;}
.mdi-card .wp-block-post-title a{color:var(--text-main);text-decoration:none;}
.mdi-card .wp-block-post-title a:hover{color:var(--accent-cyan);text-decoration:none;}
.mdi-card .wp-block-post-excerpt{color:var(--text-muted);font-size:.9375rem;}
.mdi-card__body{padding:1.25rem;display:flex;flex-direction:column;gap:.5rem;flex:1;}

.mdi-badge{
  display:inline-block;padding:.25rem .6rem;font-family:Poppins,sans-serif;
  font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent-cyan);border:1px solid var(--accent-cyan);background:var(--accent-glow);
  text-decoration:none;
}
.mdi-meta{color:var(--text-muted);font-size:.8125rem;display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;}
.mdi-thumb--ph svg{width:100%;aspect-ratio:16/9;}

/* Query Loop 3 colunas responsivo */
.mdi-grid .wp-block-post-template.is-layout-grid{grid-template-columns:1fr;}
@media (min-width:640px){.mdi-grid .wp-block-post-template.is-layout-grid{grid-template-columns:repeat(2,1fr);}}
@media (min-width:1024px){.mdi-grid .wp-block-post-template.is-layout-grid{grid-template-columns:repeat(3,1fr);}}

/* ===== 4. Hero ===== */
.mdi-hero{
  background:var(--bg-card);border:1px solid var(--border-theme);
  padding:0;overflow:hidden;
}
.mdi-hero:hover{border-color:var(--accent-cyan);}
.mdi-hero .wp-block-post-featured-image img{aspect-ratio:21/9;object-fit:cover;}
.mdi-hero__inner{padding:2rem;}
@media (min-width:1024px){.mdi-hero__inner{padding:2.5rem 3rem;}}
.mdi-hero .wp-block-post-title{font-size:clamp(1.6rem,1.1rem+2.2vw,2.75rem);line-height:1.12;}
.mdi-hero .wp-block-post-title a{color:var(--text-main);text-decoration:none;}

.mdi-section-title{
  display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem;
  font-family:Poppins,sans-serif;text-transform:none;
}
.mdi-section-title::after{content:"";flex:1;height:1px;background:var(--border-theme);}
.mdi-eyebrow{
  font-family:Poppins,sans-serif;font-size:.75rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent-teal);
}

/* Em Alta — lista numerada */
.mdi-trending .wp-block-post{
  background:var(--bg-card);border:1px solid var(--border-theme);
  padding:1rem 1.25rem;counter-increment:mdi;transition:all var(--t);
}
.mdi-trending .wp-block-post:hover{border-color:var(--accent-cyan);transform:translateY(-2px);}
.mdi-trending .wp-block-post::before{
  content:counter(mdi,decimal-leading-zero);
  font-family:Poppins,sans-serif;font-weight:800;font-size:1.5rem;color:var(--accent-teal);
}
.mdi-trending{counter-reset:mdi;}

/* ===== 5. Ferramentas ===== */
.mdi-tool{
  background:var(--bg-card);border:1px solid var(--border-theme);padding:1.5rem;
  display:flex;flex-direction:column;gap:.75rem;height:100%;transition:all var(--t);
}
.mdi-tool:hover{border-color:var(--accent-cyan);transform:translateY(-2px);box-shadow:0 0 28px var(--accent-glow);}
.mdi-tool__tag{
  align-self:flex-start;padding:.2rem .55rem;font-size:.6875rem;font-weight:600;
  border:1px solid var(--accent-teal);color:var(--accent-teal);text-transform:uppercase;letter-spacing:.06em;
}
.mdi-tool__prompt{
  background:var(--bg-input);border-left:2px solid var(--accent-cyan);
  padding:.85rem 1rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.8125rem;color:var(--text-muted);line-height:1.6;
}

/* ===== 6. Single ===== */
.mdi-single__content{max-width:720px;margin-inline:auto;}
.mdi-single__content p{color:var(--text-main);}
.mdi-keypoints{
  background:var(--bg-card);border:1px solid var(--border-theme);
  border-left:3px solid var(--accent-cyan);padding:1.5rem;
}
.mdi-keypoints ul{margin:0;padding-left:1.1rem;color:var(--text-muted);}
.mdi-actions{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;}
.mdi-like,.mdi-share{
  display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;
  background:transparent;color:var(--text-muted);border:1px solid var(--border-theme);
  padding:.6rem 1rem;font:inherit;font-size:.875rem;transition:all var(--t);
}
.mdi-like:hover,.mdi-share:hover{border-color:var(--accent-cyan);color:var(--accent-cyan);box-shadow:0 0 20px var(--accent-glow);}
.mdi-like.is-liked{border-color:var(--accent-cyan);color:var(--accent-cyan);}
.mdi-like.is-liked .mdi-like__icon{content:"";}

/* Comentários */
.wp-block-comment-template li{background:var(--bg-card);border:1px solid var(--border-theme);padding:1.25rem;margin-bottom:1rem;}
.wp-block-post-comments-form input:not([type=submit]),
.wp-block-post-comments-form textarea,
.mdi-form input,.mdi-form textarea,.mdi-form select,.mdi-ordem select{
  width:100%;background:var(--bg-input);color:var(--text-main);
  border:1px solid var(--border-theme);padding:.75rem .9rem;font:inherit;transition:all var(--t);
}
.mdi-form input:focus,.mdi-form textarea:focus,
.wp-block-post-comments-form input:focus,
.wp-block-post-comments-form textarea:focus{border-color:var(--accent-cyan);outline:none;box-shadow:0 0 0 3px var(--accent-glow);}

/* ===== 7. Filtros / chips ===== */
.mdi-filtros{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem;}
.mdi-chips{display:flex;gap:.5rem;flex-wrap:wrap;}
.mdi-chip{
  padding:.45rem .9rem;font-size:.8125rem;font-weight:500;text-decoration:none;
  color:var(--text-muted);background:var(--bg-card);border:1px solid var(--border-theme);transition:all var(--t);
}
.mdi-chip:hover{color:var(--accent-cyan);border-color:var(--accent-cyan);text-decoration:none;}
.mdi-chip.is-active{background:var(--accent-cyan);color:#0B0C10;border-color:var(--accent-cyan);}
.mdi-ordem select{width:auto;min-width:180px;}

/* ===== 8. Paginação ===== */
.wp-block-query-pagination{gap:.5rem;justify-content:center;margin-top:2.5rem;}
.wp-block-query-pagination a,.wp-block-query-pagination-numbers .current{
  padding:.5rem .85rem;border:1px solid var(--border-theme);color:var(--text-muted);text-decoration:none;transition:all var(--t);
}
.wp-block-query-pagination a:hover{border-color:var(--accent-cyan);color:var(--accent-cyan);text-decoration:none;}
.wp-block-query-pagination-numbers .current{background:var(--accent-cyan);color:#0B0C10;border-color:var(--accent-cyan);}

/* ===== 9. Newsletter ===== */
.mdi-newsletter{
  background:var(--bg-card);border:1px solid var(--border-theme);
  border-top:3px solid var(--accent-cyan);padding:2.5rem;text-align:center;
}
.mdi-newsletter form{display:flex;gap:.75rem;max-width:520px;margin:1.25rem auto 0;flex-wrap:wrap;}
.mdi-newsletter input[type=email]{flex:1;min-width:220px;background:var(--bg-input);color:var(--text-main);border:1px solid var(--border-theme);padding:.8rem 1rem;font:inherit;}
.mdi-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;
  padding:.8rem 1.5rem;font-family:Poppins,sans-serif;font-weight:600;font-size:.9375rem;
  background:var(--accent-cyan);color:#0B0C10;border:1px solid var(--accent-cyan);
  text-decoration:none;transition:all var(--t);
}
.mdi-btn:hover{background:var(--accent-teal);border-color:var(--accent-teal);text-decoration:none;}
.mdi-btn--outline{background:transparent;color:var(--accent-cyan);}
.mdi-btn--outline:hover{background:var(--accent-glow);color:var(--accent-cyan);}
.mdi-form__msg{margin-top:.75rem;font-size:.875rem;color:var(--accent-cyan);}
.mdi-form__msg[hidden]{display:none;}

/* ===== 10. Modal de busca ===== */
.mdi-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-start;justify-content:center;padding:8vh 1rem;}
.mdi-modal[hidden]{display:none;}
.mdi-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}
.mdi-modal__box{position:relative;width:100%;max-width:640px;background:var(--bg-card);border:1px solid var(--accent-cyan);box-shadow:0 0 40px var(--accent-glow);padding:1.25rem;}
.mdi-modal__input{width:100%;background:var(--bg-input);color:var(--text-main);border:1px solid var(--border-theme);padding:.9rem 1rem;font:inherit;font-size:1rem;}
.mdi-modal__results{list-style:none;margin:1rem 0 0;padding:0;max-height:50vh;overflow-y:auto;}
.mdi-modal__results li{border-bottom:1px solid var(--border-theme);}
.mdi-modal__results a{display:block;padding:.75rem .25rem;color:var(--text-main);text-decoration:none;transition:all var(--t);}
.mdi-modal__results a:hover,.mdi-modal__results a:focus{background:var(--accent-glow);color:var(--accent-cyan);text-decoration:none;padding-left:.75rem;}
.mdi-modal__empty{padding:.85rem .25rem;color:var(--text-muted);font-size:.9375rem;}
.mdi-modal__hint{margin:.85rem 0 0;font-size:.75rem;color:var(--text-muted);text-align:right;}

/* ===== 11. Rodapé + cookies ===== */
.mdi-footer{border-top:1px solid var(--border-theme);background:var(--bg-card);}
.mdi-footer a{color:var(--text-muted);text-decoration:none;transition:color var(--t);}
.mdi-footer a:hover{color:var(--accent-cyan);text-decoration:none;}
.mdi-footer__bottom{border-top:1px solid var(--border-theme);color:var(--text-muted);font-size:.8125rem;}

.mdi-cookies{
  position:fixed;left:0;right:0;bottom:0;z-index:150;
  display:flex;gap:1rem;align-items:center;justify-content:center;flex-wrap:wrap;
  background:var(--bg-card);border-top:1px solid var(--accent-cyan);padding:1rem 1.25rem;
  font-size:.875rem;color:var(--text-muted);
}
.mdi-cookies[hidden]{display:none;}

/* ===== 12. Estado vazio / 404 ===== */
.mdi-empty{text-align:center;padding:4rem 1rem;color:var(--text-muted);border:1px dashed var(--border-theme);}
.mdi-404__code{font-family:Poppins,sans-serif;font-weight:800;font-size:clamp(4rem,10vw,8rem);color:var(--accent-cyan);line-height:1;}

/* ===== 13. Mobile ===== */
@media (max-width:640px){
  .mdi-hero__inner{padding:1.5rem;}
  .mdi-newsletter{padding:1.5rem;}
  .mdi-filtros{flex-direction:column;align-items:stretch;}
  .mdi-ordem select{width:100%;}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;}
  html{scroll-behavior:auto;}
}
