/* TMAX Italia Tuning — Archivio Manuali 2026-09-15 */
:root{
  --manual-red:#e10600;
  --manual-red2:#ff1a14;
  --manual-bg:#070a0d;
  --manual-panel:rgba(9,16,21,.82);
  --manual-panel2:rgba(12,20,26,.92);
  --manual-line:#303943;
  --manual-muted:#909ba7;
  --manual-text:#f5f7f9;
  --manual-green:#159447;
}

body.manuals-page{
  margin:0;
  background:
    linear-gradient(rgba(3,8,11,.72),rgba(3,8,11,.88)),
    url('/loghi/sfondo.png') center top/cover fixed no-repeat,
    #05080b;
  color:var(--manual-text);
  font-family:Barlow,Arial,sans-serif;
}

.manuals-shell{max-width:1420px;margin:0 auto;padding:28px 22px 76px}

.manuals-hero{
  position:relative;
  overflow:hidden;
  min-height:220px;
  border:1px solid #2c343d;
  border-radius:14px;
  padding:34px 38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:26px;
  background:
    linear-gradient(90deg,rgba(6,10,13,.96),rgba(7,12,16,.82) 52%,rgba(6,10,13,.38)),
    url('/loghi/sfondo.png') center 46%/cover no-repeat;
  box-shadow:0 18px 50px rgba(0,0,0,.28);
}
.manuals-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,#159447 0 33.333%,#fff 33.333% 66.666%,#e10600 66.666%)}
.manuals-hero>*{position:relative;z-index:1}
.manuals-kicker{color:#ff4a46;font:700 11px Oswald,sans-serif;text-transform:uppercase;letter-spacing:.12em}
.manuals-hero h1{margin:8px 0 8px;font:700 clamp(36px,5vw,54px) Oswald,sans-serif;text-transform:uppercase;line-height:.98}
.manuals-hero p{margin:0;max-width:760px;color:#b9c2cb;font-size:14px;line-height:1.65}
.manuals-hero-badge{
  flex:0 0 210px;
  min-height:142px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  border:1px solid rgba(225,6,0,.42);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(225,6,0,.13),rgba(11,16,21,.82));
  box-shadow:inset 0 1px rgba(255,255,255,.03);
}
.manuals-book-icon{font-size:44px;line-height:1;margin-bottom:8px;filter:drop-shadow(0 8px 18px rgba(225,6,0,.28))}
.manuals-hero-badge b{font:700 22px Oswald,sans-serif;text-transform:uppercase}
.manuals-hero-badge span{margin-top:4px;color:#96a1ac;font-size:11px}

.manuals-member-strip{
  margin-top:18px;
  min-height:70px;
  border:1px solid var(--manual-line);
  border-radius:11px;
  background:rgba(8,15,20,.72);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 18px;
  backdrop-filter:blur(6px);
}
.manuals-member-info{display:flex;align-items:center;gap:12px;min-width:0}
.manuals-member-icon{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:rgba(21,148,71,.13);border:1px solid rgba(21,148,71,.38);font-size:20px}
.manuals-member-info b{display:block;font:700 15px Oswald,sans-serif;text-transform:uppercase}
.manuals-member-info span{display:block;margin-top:3px;color:#8f9aa5;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:640px}
.manuals-back-forum{height:40px;padding:0 14px;border-radius:7px;border:1px solid #39434d;color:#fff;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font:700 11px Oswald,sans-serif;text-transform:uppercase;background:#10161c;white-space:nowrap}
.manuals-back-forum:hover{border-color:#5a6673;background:#151c23}

.manuals-lock{
  margin-top:18px;
  min-height:410px;
  border:1px solid var(--manual-line);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(9,16,21,.93),rgba(7,11,15,.86));
  display:none;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:34px;
  box-shadow:0 20px 60px rgba(0,0,0,.26);
}
.manuals-lock.show{display:flex}
.manuals-lock-inner{max-width:600px}
.manuals-lock-icon{width:82px;height:82px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font-size:36px;background:rgba(225,6,0,.10);border:1px solid rgba(225,6,0,.35);box-shadow:0 18px 40px rgba(225,6,0,.10)}
.manuals-lock h2{margin:0;font:700 32px Oswald,sans-serif;text-transform:uppercase}
.manuals-lock p{color:#9eabb6;line-height:1.65;margin:10px auto 22px}
.manuals-lock-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.manuals-lock-actions button,.manuals-lock-actions a{height:44px;padding:0 20px;border-radius:7px;border:1px solid #3d4752;color:#fff;background:#111820;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font:700 12px Oswald,sans-serif;text-transform:uppercase;cursor:pointer}
.manuals-lock-actions .primary{background:linear-gradient(180deg,#f01812,#d80600);border-color:#e10600}
.manuals-lock-note{display:block;margin-top:18px;color:#687580;font-size:10px;text-transform:uppercase;letter-spacing:.08em}

.manuals-app{display:none;margin-top:18px}
.manuals-app.show{display:block}
.manuals-toolbar{
  display:grid;
  grid-template-columns:1fr 220px 170px;
  gap:10px;
  padding:12px;
  border:1px solid var(--manual-line);
  border-radius:11px;
  background:rgba(8,15,20,.78);
  backdrop-filter:blur(6px);
}
.manuals-search,.manuals-select{height:46px;border-radius:7px;border:1px solid #35404b;background:#090d11;color:#fff;padding:0 13px;outline:none;font:13px Barlow,sans-serif}
.manuals-search:focus,.manuals-select:focus{border-color:#e10600;box-shadow:0 0 0 3px rgba(225,6,0,.10)}
.manuals-select{cursor:pointer}

.manuals-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0}
.manual-summary-card{border:1px solid var(--manual-line);border-radius:10px;background:rgba(9,16,21,.76);padding:14px 16px;min-height:72px}
.manual-summary-card b{display:block;font:700 22px Oswald,sans-serif}
.manual-summary-card span{display:block;margin-top:3px;color:#84909b;font-size:10px;text-transform:uppercase;letter-spacing:.04em}

.manuals-section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:24px 0 12px}
.manuals-section-head h2{margin:0;font:700 24px Oswald,sans-serif;text-transform:uppercase;padding-left:12px;position:relative}
.manuals-section-head h2:before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:3px;border-radius:4px;background:#e10600}
.manuals-section-head p{margin:4px 0 0;color:#8e99a5;font-size:12px}
.manuals-result-count{color:#8e99a5;font-size:11px;white-space:nowrap}

.manuals-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.manual-card{position:relative;overflow:hidden;border:1px solid #303943;border-radius:11px;background:linear-gradient(180deg,rgba(15,22,28,.96),rgba(8,13,18,.98));transition:.2s;box-shadow:0 14px 34px rgba(0,0,0,.18)}
.manual-card:hover{transform:translateY(-3px);border-color:#59636e;box-shadow:0 18px 42px rgba(0,0,0,.28)}
.manual-cover{position:relative;height:240px;background:radial-gradient(circle at 50% 30%,#25313b,#0b1015 72%);display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:1px solid #2a323b}
.manual-cover img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:.25s}
.manual-cover img.loaded{opacity:1}
.manual-cover-placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#75818c;font-size:38px;background:linear-gradient(135deg,#151d24,#090d11)}
.manual-cover img.loaded + .manual-cover-placeholder{display:none}
.manual-year{position:absolute;left:11px;top:11px;z-index:3;min-width:52px;height:28px;padding:0 9px;border-radius:5px;display:grid;place-items:center;background:#e10600;color:#fff;font:700 14px Oswald,sans-serif;box-shadow:0 8px 20px rgba(225,6,0,.22)}
.manual-lang{position:absolute;right:11px;top:11px;z-index:3;height:28px;padding:0 8px;border-radius:5px;display:grid;place-items:center;background:rgba(4,8,11,.82);border:1px solid rgba(255,255,255,.18);color:#fff;font:700 10px Oswald,sans-serif}
.manual-card-body{padding:15px}
.manual-model{font:700 20px Oswald,sans-serif;margin:0 0 3px}
.manual-type{color:#aab4be;font-size:11px;margin-bottom:10px}
.manual-meta{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}
.manual-meta span{padding:5px 7px;border-radius:5px;border:1px solid #2e3842;background:#0d1318;color:#8995a0;font-size:9px;text-transform:uppercase}
.manual-codes{min-height:30px;color:#77838f;font-size:10px;line-height:1.45;margin-bottom:14px}
.manual-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.manual-btn{height:39px;border-radius:6px;border:1px solid #39444f;background:#111820;color:#fff;display:flex;align-items:center;justify-content:center;gap:6px;font:700 11px Oswald,sans-serif;text-transform:uppercase;cursor:pointer}
.manual-btn:hover{background:#18212a;border-color:#596674}
.manual-btn.primary{background:linear-gradient(180deg,#f01812,#d80600);border-color:#e10600}
.manual-btn[disabled]{opacity:.45;cursor:wait}

.manuals-empty{grid-column:1/-1;padding:44px 20px;text-align:center;border:1px dashed #38424d;border-radius:10px;color:#85919c;background:rgba(9,15,20,.72)}

.manual-preview-modal{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.82);backdrop-filter:blur(4px)}
.manual-preview-modal.open{display:flex}
.manual-preview-box{width:min(1180px,98vw);height:min(860px,94vh);border:1px solid #3b4652;border-radius:13px;background:#0b1015;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 26px 80px rgba(0,0,0,.5)}
.manual-preview-head{min-height:62px;padding:10px 12px 10px 17px;border-bottom:1px solid #2e3842;display:flex;align-items:center;gap:14px;background:#10171d}
.manual-preview-title{min-width:0;flex:1}
.manual-preview-title b{display:block;font:700 18px Oswald,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.manual-preview-title span{display:block;color:#87939e;font-size:10px;margin-top:2px}
.manual-preview-actions{display:flex;gap:7px;align-items:center}
.manual-preview-actions button{height:38px;padding:0 12px;border-radius:6px;border:1px solid #39444f;background:#151c23;color:#fff;font:700 10px Oswald,sans-serif;text-transform:uppercase;cursor:pointer}
.manual-preview-actions button.primary{background:#e10600;border-color:#e10600}
.manual-preview-close{width:38px!important;padding:0!important;font-size:20px!important}
.manual-preview-frame-wrap{flex:1;min-height:0;position:relative;background:#20252a}
.manual-preview-frame{width:100%;height:100%;border:0;background:#fff}
.manual-preview-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#d4dbe2;background:#0d1318;font:600 13px Barlow,sans-serif;z-index:2}
.manual-preview-loading.hide{display:none}

.manuals-info-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}
.manuals-info-item{display:flex;align-items:center;gap:10px;padding:14px;border:1px solid #2f3943;border-radius:9px;background:rgba(9,16,21,.74)}
.manuals-info-item i{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-size:18px;background:#111a21;border:1px solid #33404a}
.manuals-info-item b{display:block;font:700 12px Oswald,sans-serif;text-transform:uppercase}
.manuals-info-item span{display:block;margin-top:2px;color:#7f8b96;font-size:9px}

@media(max-width:1180px){
  .manuals-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .manuals-summary,.manuals-info-strip{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .manuals-hero{align-items:flex-start;min-height:190px;padding:28px 24px}
  .manuals-hero-badge{display:none}
  .manuals-toolbar{grid-template-columns:1fr 1fr}
  .manuals-search{grid-column:1/-1}
  .manuals-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .manual-cover{height:220px}
  .manual-preview-box{height:94vh}
}
@media(max-width:600px){
  .manuals-shell{padding:18px 12px 55px}
  .manuals-hero{padding:24px 18px;min-height:170px}
  .manuals-hero h1{font-size:36px}
  .manuals-member-strip{align-items:flex-start;flex-direction:column}
  .manuals-back-forum{width:100%}
  .manuals-toolbar{grid-template-columns:1fr}
  .manuals-search{grid-column:auto}
  .manuals-summary{grid-template-columns:1fr 1fr}
  .manuals-grid{grid-template-columns:1fr}
  .manual-cover{height:280px}
  .manuals-info-strip{grid-template-columns:1fr}
  .manual-preview-modal{padding:0}
  .manual-preview-box{width:100vw;height:100vh;border:0;border-radius:0}
  .manual-preview-head{align-items:flex-start;flex-wrap:wrap;padding:10px}
  .manual-preview-actions{width:100%}
  .manual-preview-actions button{flex:1}
  .manual-preview-close{flex:0 0 38px!important}
}