/* ================================================
   SL SEGUI Ferramentas — v5
   Reuses the native blog's CSS classes (bl-mast, bl-wrap,
   bl-layout, bl-side, bl-box, bl-cats, bl-card, bl-btn, ...).
   This file ONLY provides:
   1) the .well-container breakout (page needs full-width like blog)
   2) search bar + card grid + card inner layout + "em breve" badge
================================================ */

/* --- 1. Break out of the .well page container + remove parent top padding --- */
main.app-content:has(.bl-mast),
main.guest-content:has(.bl-mast){
  padding-top:0!important;
}
.guest-content .container,
.app-content .container{max-width:100%!important;width:100%!important;padding:0!important;}
.guest-content .row,
.app-content .row{margin:0!important;display:block!important;}
.guest-content .col-md-8,
.guest-content .col-md-8.col-md-offset-2,
.app-content .col-md-8,
.app-content .col-md-8.col-md-offset-2{
  width:100%!important;max-width:100%!important;
  margin:0!important;margin-left:0!important;padding:0!important;float:none!important;
}
.guest-content .well,
.app-content .well{
  background:none!important;border:none!important;
  padding:0!important;margin:0!important;
  border-radius:0!important;box-shadow:none!important;
  width:100%!important;max-width:100%!important;
}

/* --- 2. Search bar (styled to match blog aesthetic) --- */
.bl-search{
  max-width:440px;margin:18px auto 0;position:relative;
}
.bl-search input{
  width:100%;padding:11px 16px 11px 42px;border-radius:10px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
  color:#ecedf1;font-size:14px;outline:none;font-family:inherit;
  transition:border-color .2s;
}
.bl-search input:focus{border-color:rgba(47,111,237,.5);}
.bl-search input::placeholder{color:rgba(139,140,150,.6);}
.bl-search > i{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#7a7b85;font-size:14px;pointer-events:none;}

/* --- 3. Section headings --- */
.slt-sec{
  font-size:17px;font-weight:700;margin:0 0 14px;
  display:flex;align-items:center;gap:10px;color:#ecedf1;
}
.slt-sec__count{
  font-size:11.5px;font-weight:600;color:#7a7b85;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);
  padding:2px 9px;border-radius:999px;
}
.slt-sec--mt{margin-top:34px;}

/* --- 4. Card grid --- */
.slt-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:16px;margin-bottom:8px;
}

/* --- 5. Card inner layout (bl-card provides base styling) --- */
.slt-card{
  padding:20px!important;position:relative;display:block;
  text-decoration:none!important;
}
.slt-card__ico{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(47,111,237,.14);color:#93b4f6;font-size:19px;margin-bottom:13px;
}
.slt-card__kick{
  font-size:11px;font-weight:600;color:#5a8af6;
  text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;display:block;
}
.slt-card h3{font-size:15.5px;font-weight:700;margin:0 0 6px;color:#ecedf1;}
.slt-card p{font-size:13px;color:#8b8c96;margin:0 0 12px;line-height:1.5;}
.slt-card__cta{
  font-size:12.5px;font-weight:600;color:#5a8af6;
  display:inline-flex;align-items:center;gap:6px;
}
.slt-card__cta i{font-size:10px;transition:transform .2s;}
.slt-card:hover .slt-card__cta i{transform:translateX(3px);}

/* --- 6. "Em breve" badge --- */
.slt-card__soon{
  position:absolute;top:14px;right:14px;z-index:2;
  font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:#f2b431;background:rgba(242,180,49,.1);
  border:1px solid rgba(242,180,49,.25);
  padding:3px 9px;border-radius:999px;
}

/* --- 7. Empty state --- */
.slt-empty{
  display:none;text-align:center;padding:40px 20px;
  color:#7a7b85;font-size:14px;
}

/* ================= v6: tool pages ================= */
.slt-toolbox{padding:26px!important;}
.slt-toolhead{display:flex;align-items:center;gap:14px;margin-bottom:6px;}
.slt-toolhead .slt-card__ico{margin:0;flex:none;}
.slt-toolhead h1{font-size:24px;font-weight:800;margin:0;color:#ecedf1;line-height:1.2;}
.slt-lead{font-size:14px;color:#8b8c96;line-height:1.6;margin:8px 0 22px;}
.slt-back{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#5a8af6;text-decoration:none!important;margin-bottom:16px;}
.slt-back:hover{color:#93b4f6;}
.slt-grid-f{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px;}
.slt-f{display:flex;flex-direction:column;gap:7px;min-width:0;}
.slt-f--full{grid-column:1/-1;}
.slt-f label{font-size:12.5px;font-weight:600;color:#c3c4cc;margin:0;}
.slt-f small{font-size:11.5px;color:#7a7b85;}
.slt-f input[type=text],.slt-f input[type=number],.slt-f textarea,.slt-f select{
  width:100%;box-sizing:border-box;padding:11px 14px;border-radius:10px;
  background:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.1)!important;
  color:#ecedf1!important;font-size:14px;font-family:inherit;outline:none;box-shadow:none!important;
  transition:border-color .2s,background .2s;height:auto;
}
.slt-f textarea{resize:vertical;line-height:1.55;min-height:90px;}
.slt-f input::placeholder,.slt-f textarea::placeholder{color:rgba(139,140,150,.65);}
.slt-f input:focus,.slt-f textarea:focus,.slt-f select:focus{border-color:rgba(47,111,237,.65)!important;background:rgba(255,255,255,.07)!important;}
/* dark select */
.slt-sel{position:relative;}
.slt-sel select{
  -webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;padding-right:38px;
  background-color:#17181e!important;color-scheme:dark;
}
.slt-sel select option{background:#17181e;color:#ecedf1;}
.slt-sel:after{
  content:"";position:absolute;right:15px;top:50%;width:7px;height:7px;margin-top:-6px;
  border-right:2px solid #8b8c96;border-bottom:2px solid #8b8c96;transform:rotate(45deg);pointer-events:none;
}
.slt-checks{display:flex;flex-wrap:wrap;gap:12px 22px;}
.slt-chk{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;color:#c3c4cc;cursor:pointer;margin:0;font-weight:500;}
.slt-chk input{width:17px;height:17px;accent-color:#2f6fed;margin:0;}
.slt-go{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:20px;
  padding:13px 22px;border:0;border-radius:11px;cursor:pointer;
  background:linear-gradient(135deg,#2f6fed,#4f8bff);color:#fff!important;font-size:14.5px;font-weight:700;
  font-family:inherit;text-decoration:none!important;transition:transform .15s,box-shadow .2s,filter .2s;
  box-shadow:0 8px 22px -8px rgba(47,111,237,.6);
}
.slt-go:hover{transform:translateY(-1px);filter:brightness(1.07);}
.slt-go--sm{width:auto;margin-top:14px;padding:10px 20px;font-size:13.5px;}
.slt-out{display:none;margin-top:24px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);}
.slt-out.is-visible{display:block;}
.slt-res{display:flex;flex-direction:column;gap:12px;}
.slt-res__item{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);}
.slt-res__txt{flex:1;min-width:0;font-size:14px;line-height:1.6;color:#e3e4ea;word-break:break-word;}
.slt-lbl{display:block;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#5a8af6;margin-bottom:3px;}
.slt-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;}
.slt-pw{font-size:18px;letter-spacing:.04em;}
.slt-copy{flex:none;display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:9px;cursor:pointer;
  background:rgba(47,111,237,.14);border:1px solid rgba(47,111,237,.3);color:#93b4f6;font-size:12.5px;font-weight:600;font-family:inherit;transition:background .2s;}
.slt-copy:hover{background:rgba(47,111,237,.26);}
.slt-tags{display:flex;flex-wrap:wrap;gap:8px;}
.slt-tags span{padding:4px 11px;border-radius:999px;background:rgba(47,111,237,.14);color:#a8c2f8;font-size:13px;font-weight:500;}
.slt-note{font-size:12.5px;color:#7a7b85;margin:14px 0 0;line-height:1.5;}
.slt-lvl--weak{color:#f06a6a}.slt-lvl--mid{color:#f2b431}.slt-lvl--strong{color:#3ecf8e}
.slt-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.slt-stats div{padding:14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);text-align:center;}
.slt-stats b{display:block;font-size:24px;font-weight:800;color:#ecedf1;}
.slt-stats span{font-size:11.5px;color:#7a7b85;}
.slt-lims{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;}
.slt-lim__h{display:flex;justify-content:space-between;font-size:12px;color:#8b8c96;margin-bottom:5px;}
.slt-lim__h .is-over{color:#f06a6a;font-weight:700;}
.slt-lim__bar{height:6px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden;}
.slt-lim__bar i{display:block;height:100%;background:#2f6fed;border-radius:99px;transition:width .2s;}
.slt-lim__bar i.is-over{background:#f06a6a;}
.slt-qr{display:flex;flex-direction:column;align-items:center;gap:4px;}
.slt-qr img{background:#fff;border-radius:12px;padding:0;max-width:100%;height:auto;image-rendering:pixelated;}
.slt-toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:99999;
  padding:11px 20px;border-radius:11px;background:#1c1d25;border:1px solid rgba(255,255,255,.12);color:#ecedf1;font-size:13.5px;font-weight:600;box-shadow:0 14px 34px rgba(0,0,0,.45);transition:all .25s;}
.slt-toast.is-visible{opacity:1;transform:translate(-50%,0);}
.slt-about{margin-top:26px;}
.slt-about h2{font-size:17px;font-weight:700;color:#ecedf1;margin:0 0 8px;}
.slt-about p,.slt-about li{font-size:14px;color:#8b8c96;line-height:1.7;}
.slt-about ul{padding-left:20px;margin:8px 0 0;}
@media(max-width:640px){
  .slt-grid-f,.slt-lims{grid-template-columns:1fr;}
  .slt-stats{grid-template-columns:1fr 1fr;}
  .slt-toolbox{padding:18px!important;}
  .slt-res__item{flex-direction:column;}
  .slt-copy{align-self:flex-start;}
}
