@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#080b16;--panel:#111a2d;--panel2:#17243a;--text:#f7f8fc;--muted:#aab5ca;--accent:#ed1838;--line:#2b3850}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% 0%,#25223a 0,transparent 40%),radial-gradient(ellipse at 0% 65%,#24152c 0,transparent 35%),var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh}a{color:#c7d5ff;text-decoration:none}.top{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,20px);border-bottom:1px solid #252c40;background:#080b16ed;position:sticky;top:0;z-index:5}.brand{font:800 21px Manrope;letter-spacing:.5px;color:white}.brand .idmark{display:inline-block;background:linear-gradient(135deg,#ff334f,#c90027);border-radius:9px;padding:4px 7px;margin-right:5px}.top nav{display:flex;gap:22px;align-items:center}.top nav a{color:#dce3f2}.navbtn,.button{background:linear-gradient(110deg,#ff2949,#cf0028);color:white!important;border:0;border-radius:40px;padding:14px 25px;font-weight:700;display:inline-block;cursor:pointer;box-shadow:0 8px 25px #e5092f30}.wrap{width:min(1080px,92%);margin:0 auto;min-height:75vh;padding:45px 0}.hero{text-align:left;padding:90px 5% 100px;max-width:900px;margin:0 auto;position:relative}.eyebrow{letter-spacing:3px;color:#a8b9e5;font-size:12px;font-weight:700}.hero h1{font:800 clamp(42px,7vw,76px)/1.04 Manrope;margin:25px 0}.hero h1 em{font-style:normal;color:#ff3150}.hero p{font-size:20px;color:#c1cbe0;line-height:1.65;max-width:690px;margin:0 0 32px}.ghost{display:inline-block;margin-left:12px;padding:13px 24px;border:1px solid #63718e;border-radius:40px}.hero-note{margin-top:38px;color:#b7c2d7;letter-spacing:.5px;font-size:14px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:20px 0 65px}.features article,.panel,.mini,.stats>div,.closing{background:linear-gradient(145deg,#172139dd,#0e1628ee);border:1px solid var(--line);border-radius:22px;padding:25px}.features b{color:#ff3150}.features p,.mini p,small{color:var(--muted)}h1,h2{font-family:Manrope}h1{font-size:38px}h2{margin-top:38px}.closing{text-align:center;padding:42px;margin-bottom:45px}.closing h2{margin:0 0 10px}.closing p{color:var(--muted)}.closing small{display:block;margin-top:24px}.panel{max-width:760px;margin:25px auto}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:block;font-weight:700;margin:14px 0;color:#e8edfa}input,textarea,select{display:block;width:100%;margin-top:8px;padding:14px 15px;background:#080f20;border:1px solid #43506a;border-radius:12px;color:white;font:inherit}input[type=color]{height:52px;padding:5px}input[type=file]{font-size:13px}textarea{resize:vertical}.check{display:flex;align-items:center;gap:10px}.check input{width:auto}.button{font:700 16px 'DM Sans';margin-top:18px}.notice{background:#183b35;border:1px solid #276b5a;padding:13px 17px;border-radius:12px;margin-bottom:20px}.auth{max-width:480px}.auth .button{width:100%}.cardslist{display:grid;gap:14px;margin-top:25px}.mini{display:flex;justify-content:space-between;gap:20px;align-items:center}.mini h3{margin:0}.mini small{word-break:break-all}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.textbtn{background:none;border:0;color:#ff8195;cursor:pointer}.stats{display:flex;gap:15px}.stats>div{min-width:140px}.stats b{display:block;font-size:30px}.stats span{color:var(--muted)}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;background:#111a2d}td,th{text-align:left;padding:12px;border-bottom:1px solid var(--line)}.publiccard{--accent:#ed1838;width:min(560px,100%);margin:10px auto;background:radial-gradient(ellipse at 90% 0%,#263550,#0a1223 65%);border:1px solid #34435c;border-radius:28px;padding:35px 28px;text-align:center;box-shadow:0 25px 80px #0008}.avatar{width:116px;height:116px;border-radius:50%;object-fit:cover;border:4px solid var(--accent);margin:10px auto}.placeholder{display:grid;place-items:center;background:#253653;font-size:42px}.logo{max-width:150px;max-height:65px;object-fit:contain;margin:0 auto 18px;display:block}.publiccard h1{font-size:32px;margin:10px 0}.publiccard h3{color:#c5cee0;margin:0}.bio{color:#c1cbe0;line-height:1.6;margin:22px 0}.whatsapp{display:block;background:var(--accent);padding:17px;border-radius:14px;color:white;font-weight:700;margin:25px 0}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.linktile{padding:15px 5px;border:1px solid #43516a;border-radius:12px;background:#ffffff0b;color:white}.share{display:flex;gap:10px;margin-top:25px}.share a,.share button{flex:1;padding:13px;border:1px solid #43516a;border-radius:12px;background:transparent;color:white;font:inherit;cursor:pointer}.publiccard small{display:block;margin-top:28px}footer{text-align:center;color:#8491aa;padding:30px 15px;border-top:1px solid #202a40}@media(max-width:650px){.top{height:auto;padding:18px;align-items:flex-start}.top nav{gap:10px;font-size:13px}.navbtn{padding:9px 12px}.wrap{padding:32px 0}.features{grid-template-columns:1fr}.formgrid{grid-template-columns:1fr}.mini{display:block}.actions{margin-top:15px}.hero{padding:55px 3%}.hero p{font-size:17px}.publiccard{padding:25px 18px}.tiles{grid-template-columns:repeat(2,1fr)}.share{flex-direction:column}}


/* ID.Clicou — QR Code: apresentação uniforme em desktop e mobile */
.publiccard .qr-section{
  display:block !important;
  width:min(100%, 390px) !important;
  max-width:390px !important;
  margin:30px auto 8px !important;
  padding:22px 18px !important;
  box-sizing:border-box !important;
  border:1px solid #43516a !important;
  border-radius:20px !important;
  background:linear-gradient(145deg,#172139dd,#0e1628ee) !important;
  text-align:center !important;
}
.publiccard .qr-section h3{
  display:block !important;
  margin:0 0 10px !important;
  color:#f7f8fc !important;
  font:700 19px/1.35 'DM Sans',sans-serif !important;
}
.publiccard .qr-section p{
  margin:0 0 18px !important;
  color:#aab5ca !important;
  font:400 14px/1.5 'DM Sans',sans-serif !important;
}
.publiccard .qr-section .qr-code{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:240px !important;
  height:240px !important;
  min-height:0 !important;
  max-width:100% !important;
  margin:0 auto 16px !important;
  padding:10px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  background:#fff !important;
  border:0 !important;
  border-radius:14px !important;
}
.publiccard .qr-section .qr-code canvas,
.publiccard .qr-section .qr-code img{
  display:block !important;
  width:220px !important;
  height:220px !important;
  max-width:100% !important;
  max-height:100% !important;
  margin:0 !important;
  object-fit:contain !important;
}
.publiccard .qr-section .qr-download{
  display:block !important;
  width:100% !important;
  min-height:54px !important;
  margin:0 !important;
  padding:14px 18px !important;
  border:0 !important;
  border-radius:14px !important;
  background:#ed1838 !important;
  color:#fff !important;
  font:700 16px/1.3 'DM Sans',sans-serif !important;
  text-align:center !important;
  cursor:pointer !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  box-shadow:none !important;
}
@media(max-width:650px){
  .publiccard .qr-section{
    width:100% !important;
    max-width:390px !important;
    margin:26px auto 8px !important;
    padding:20px 16px !important;
  }
  .publiccard .qr-section .qr-code{
    width:240px !important;
    height:240px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .publiccard .qr-section .qr-code canvas,
  .publiccard .qr-section .qr-code img{
    width:220px !important;
    height:220px !important;
  }
}
/* Painel de administração: ações principais */
.admin-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:18px 0 24px}
.admin-actions .button{margin-top:0}
.admin-actions .secondary-button{background:linear-gradient(110deg,#263650,#17243a)!important;border:1px solid #52617a!important;box-shadow:none!important}
@media(max-width:650px){.admin-actions{display:grid;grid-template-columns:1fr}.admin-actions .button{width:100%;text-align:center}}


/* ID.Clicou — área A minha conta */
.account-form{max-width:520px}
.account-form h2{font-size:19px;margin:28px 0 8px}
.account-form .account-help{color:var(--muted);line-height:1.55;font-size:14px}
.account-form .button{width:100%}
@media(max-width:650px){
  .top{flex-wrap:wrap;gap:12px}
  .top nav{width:100%;justify-content:flex-end;flex-wrap:wrap}
}

/* ID.Clicou — painel de estatísticas */
.period-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 24px}
.period-tabs a{padding:10px 16px;border:1px solid var(--line);border-radius:30px;color:#cbd5e8;background:#111a2d}
.period-tabs a.active{background:#ed1838;border-color:#ed1838;color:#fff;font-weight:700}
.stats-intro{color:var(--muted)}
.stats-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:22px 0}
.stats-kpis>div{min-width:0}
.stats-panel{padding:24px;margin:26px 0;background:linear-gradient(145deg,#172139dd,#0e1628ee);border:1px solid var(--line);border-radius:22px}
.stats-panel h2{margin:0 0 6px}.stats-panel p,.stats-note{color:var(--muted);font-size:14px}
.chart-bars{height:220px;display:flex;align-items:stretch;gap:8px;padding:18px 4px 0;overflow:hidden}
.chart-col{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:7px}
.chart-col .bar-value{font-size:11px;color:#cbd5e8;min-height:14px}
.bar-track{height:145px;width:min(100%,34px);display:flex;align-items:flex-end;background:#202d43;border-radius:8px 8px 3px 3px;overflow:hidden}
.bar-track span{display:block;width:100%;min-height:2px;background:linear-gradient(180deg,#ff4964,#d90429);border-radius:7px 7px 2px 2px}
.chart-col small{font-size:10px;white-space:nowrap;color:#aab5ca}
.stats-note{margin-top:22px;line-height:1.6}
@media(max-width:650px){.stats-kpis{grid-template-columns:1fr;gap:10px}.stats-kpis>div{display:flex;justify-content:space-between;align-items:center}.chart-bars{gap:3px;height:195px}.bar-track{height:125px;width:min(100%,25px)}.chart-col small{font-size:9px}}

/* ID.Clicou — Kit de divulgação para redes sociais */
.promo-intro,.promo-help{color:var(--muted);line-height:1.6}.promo-layout{display:grid;grid-template-columns:minmax(280px,390px) minmax(0,1fr);gap:28px;align-items:start;margin:26px 0}.promo-controls,.promo-preview{background:linear-gradient(145deg,#172139dd,#0e1628ee);border:1px solid var(--line);border-radius:22px;padding:24px}.promo-controls h2{margin:0 0 16px;font-size:21px}.promo-formats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:22px}.promo-format{padding:13px 9px;border:1px solid #43516a;border-radius:13px;background:#080f20;color:#eaf0ff;font:600 14px 'DM Sans',sans-serif;cursor:pointer}.promo-format small{display:block;margin-top:5px;font-size:11px}.promo-format.active{border-color:#ed1838;background:#ed18381c;box-shadow:inset 0 0 0 1px #ed1838}.promo-controls .button{display:block;width:100%;text-align:center;margin:12px 0 0}.promo-controls .secondary-button{background:linear-gradient(110deg,#263650,#17243a)!important;border:1px solid #52617a!important;box-shadow:none!important}.promo-copy{display:block;margin:12px auto 0;background:transparent;color:#dce3f2;border:1px solid #63718e;border-radius:30px;padding:12px 18px;cursor:pointer}.promo-preview-head{display:flex;justify-content:space-between;gap:12px;color:#eaf0ff;margin-bottom:18px}.promo-preview-head span{color:var(--muted);font-size:12px}.promo-canvas-wrap{width:100%;display:flex;justify-content:center;align-items:flex-start;padding:16px;background:#080b16;border-radius:16px;overflow:hidden}.promo-canvas-wrap canvas{display:block;width:min(100%,420px);height:auto;max-height:75vh;object-fit:contain;box-shadow:0 12px 40px #0008;border-radius:5px}.promo-qr-source{position:absolute;left:-99999px;top:0;width:300px;height:300px;overflow:hidden}
@media(max-width:760px){.promo-layout{grid-template-columns:1fr}.promo-preview{order:-1}.promo-controls,.promo-preview{padding:18px}.promo-canvas-wrap canvas{width:min(100%,340px);max-height:65vh}.promo-preview-head{align-items:center}}

/* QR público: imagem estática compatível com browsers integrados, incluindo Facebook */
.publiccard .qr-code img{display:block;width:220px;height:220px;max-width:100%;object-fit:contain;background:#fff;border-radius:8px}
.publiccard .qr-download{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}

/* Pré-visualização adaptativa do Kit de Divulgação */
.promo-canvas-wrap{min-height:220px}.promo-canvas-wrap canvas{max-width:100%;height:auto;object-fit:contain}.promo-format{min-height:76px}.promo-format small{color:#aab7cc;font-weight:500}.promo-format.active small{color:#fff}

/* Editor visual com pré-visualização em tempo real */
.editor-intro{color:var(--muted);line-height:1.6;margin-top:-8px}.editor-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.85fr);gap:24px;align-items:start;margin-top:22px}.editor-form{max-width:none;width:100%;margin:0}.editor-preview{position:sticky;top:100px;padding:22px;background:linear-gradient(145deg,#172139dd,#0e1628ee);border:1px solid var(--line);border-radius:22px}.preview-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.preview-heading span:first-child{font-size:10px;letter-spacing:1.7px;color:#aab5ca;font-weight:800}.preview-heading h2{font-size:21px;margin:5px 0 0}.live-dot{font-size:10px;font-weight:800;letter-spacing:1px;color:#69e3ae;background:#69e3ae18;border:1px solid #69e3ae55;border-radius:20px;padding:7px 10px}.phone-frame{width:min(100%,340px);margin:0 auto;padding:10px;border-radius:38px;background:linear-gradient(145deg,#526079,#111827 30%,#05070d);border:1px solid #66738b;box-shadow:0 24px 55px #0008}.phone-notch{width:92px;height:17px;background:#05070d;border-radius:0 0 12px 12px;margin:-1px auto 8px;position:relative;z-index:2}.phone-screen{--preview-accent:#ed1838;min-height:525px;padding:24px 17px 20px;border-radius:27px;text-align:center;overflow:hidden;background:radial-gradient(ellipse at 90% 0%,#263550,#0a1223 65%);color:#f7f8fc}.preview-brand{text-align:left;font-size:11px;letter-spacing:1px;color:#dce3f2;margin-bottom:20px}.preview-brand b{display:inline-block;background:var(--preview-accent);padding:5px 6px;border-radius:5px;color:#fff}.preview-logo{display:block;max-width:105px;max-height:48px;object-fit:contain;margin:0 auto 12px}.preview-avatar-wrap{width:94px;height:94px;margin:10px auto 15px;border:4px solid var(--preview-accent);border-radius:50%;overflow:hidden;background:#253653;display:grid;place-items:center}.preview-avatar{width:100%;height:100%;object-fit:cover}.preview-avatar-placeholder{font-size:34px;font-weight:800;color:#fff}.phone-screen h3{font-size:21px;line-height:1.2;margin:8px 0}.preview-profession{font-size:13px;color:#c5cee0;margin:6px 0}.preview-company{font-size:12px;color:#aab5ca;margin:5px 0}.preview-rule{height:2px;background:var(--preview-accent);margin:19px 4px}.preview-description{font-size:11px;line-height:1.55;color:#c1cbe0;min-height:32px;white-space:pre-wrap;overflow-wrap:anywhere}.preview-contact{margin:19px 0 13px;padding:12px 8px;border-radius:11px;background:var(--preview-accent);font-size:12px;font-weight:800}.preview-social{display:flex;justify-content:center;gap:9px;margin:12px 0}.preview-social span{width:27px;height:27px;display:grid;place-items:center;border:1px solid #43516a;border-radius:8px;font-size:11px;color:#fff}.phone-screen>small{display:block;font-size:9px;color:#aab5ca;overflow-wrap:anywhere;margin-top:16px}.preview-note{font-size:11px;line-height:1.5;color:#8794aa;text-align:center;margin:15px 0 0}.editor-form .button{width:100%}

/* Editor v5 — correção dedicada para telemóveis; desktop preservado */
.editor-mobile-tabs{display:none}
.editor-layout{width:100%;min-width:0}
.editor-form,.editor-preview{min-width:0}
.preview-avatar-wrap{width:94px;height:94px;min-width:94px;max-width:94px;flex:0 0 94px}
.preview-avatar{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:cover;border-radius:50%}
.preview-logo{display:block;width:auto;height:auto;max-width:105px;max-height:48px;object-fit:contain}
@media(max-width:850px){
  .wrap{width:min(calc(100% - 28px),680px);padding:22px 0}
  .editor-intro{font-size:15px;line-height:1.55}
  .editor-mobile-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0 12px;padding:5px;background:#080f20;border:1px solid var(--line);border-radius:15px}
  .editor-tab{min-height:46px;padding:11px 12px;border:1px solid transparent;border-radius:11px;background:transparent;color:#cbd5e8;font:700 14px 'DM Sans',sans-serif}
  .editor-tab.active{background:linear-gradient(110deg,#ff2949,#cf0028);color:#fff;box-shadow:0 5px 18px #e5092f30}
  .editor-layout{display:block;margin-top:10px}
  .editor-form,.editor-preview{width:100%;max-width:none;margin:0;padding:18px;border-radius:18px}
  .editor-form label{font-size:14px;margin:13px 0}
  .editor-form input,.editor-form textarea,.editor-form select{width:100%;min-width:0;min-height:48px;font-size:16px;padding:13px}
  .editor-form input[type=color]{height:54px}
  .editor-form input[type=file]{font-size:13px;min-height:48px}
  .editor-form .formgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
  .editor-form .button{width:100%;min-height:50px}
  .editor-preview{position:static;top:auto}
  .preview-heading{gap:8px}
  .preview-heading h2{font-size:20px}
  .phone-frame{width:min(100%,330px);max-width:330px;margin:0 auto;padding:9px;border-radius:32px}
  .phone-screen{width:100%;min-width:0;min-height:0;padding:22px 16px 20px;border-radius:24px}
  .preview-avatar-wrap{width:94px;height:94px;min-width:94px;max-width:94px;margin:10px auto 15px}
  .preview-avatar{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important}
  .preview-logo{width:auto!important;height:auto!important;max-width:105px!important;max-height:48px!important;object-fit:contain!important;margin:0 auto 12px}
  .phone-screen h3{font-size:20px;overflow-wrap:anywhere}
  .preview-description{overflow-wrap:anywhere}
  .preview-note{font-size:11px}
  .editor-preview[hidden],.editor-form[hidden]{display:none!important}
}
@media(max-width:420px){
  .wrap{width:calc(100% - 22px)}
  .editor-form,.editor-preview{padding:15px}
  .phone-frame{width:min(100%,310px)}
  .phone-screen{padding:20px 13px 18px}
}


/* ID.Clicou v6 — modelos visuais */
.template-picker{margin:28px 0 8px;padding:20px;border:1px solid var(--line);border-radius:18px;background:#080f20}
.template-picker-head h2{font-size:21px;margin:7px 0 4px}
.template-picker-head p{margin:0;color:var(--muted);font-size:13px}
.template-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
.template-option{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:10px;border:1px solid #43516a;border-radius:13px;background:#111a2d;color:#f7f8fc;text-align:left;cursor:pointer}
.template-option b{font-size:14px}
.template-option small{font-size:11px;color:#aab5ca}
.template-option.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:#ed18381c}
.template-swatch{display:block;width:100%;height:48px;border-radius:8px;border:1px solid #53617a}
.executive-swatch{background:linear-gradient(110deg,#101827 0 48%,#c8a96b 48% 51%,#f4f0e8 51%)}
.minimal-swatch{background:linear-gradient(110deg,#f8fafc 0 70%,#dce4ee 70%);border-color:#b9c5d4}
.premium-swatch{background:radial-gradient(circle at 70% 20%,#34435d,#080b16 70%)}
.creative-swatch{background:linear-gradient(120deg,#3a145d,#ed1838 55%,#ffb347)}
/* Public card template variants */
.publiccard.template-executive{background:linear-gradient(155deg,#111827,#0b1220 72%);border-color:#b99b61}
.publiccard.template-executive .avatar{border-color:#c8a96b}
.publiccard.template-executive .whatsapp{background:#c8a96b;color:#101827}
.publiccard.template-executive .linktile{border-color:#8d784f;background:#c8a96b12}
.publiccard.template-minimal{background:#f8fafc;color:#172033;border-color:#d9e1eb;box-shadow:0 18px 55px #0002}
.publiccard.template-minimal h1,.publiccard.template-minimal h3,.publiccard.template-minimal .linktile{color:#172033}
.publiccard.template-minimal p,.publiccard.template-minimal small{color:#526176}
.publiccard.template-minimal .avatar{border-color:#172033}
.publiccard.template-minimal .linktile{background:#fff;border-color:#d5deea}
.publiccard.template-minimal .share a,.publiccard.template-minimal .share button{color:#172033;border-color:#c7d2e1}
.publiccard.template-creative{background:radial-gradient(ellipse at 0% 0%,#5a236e,#17102b 55%,#090b18);border-color:#a64bd0}
.publiccard.template-creative .avatar{border-color:#ff4b75}
.publiccard.template-creative .whatsapp{background:linear-gradient(100deg,#ed1838,#9d35c7)}
/* Editor mockup mirrors the selected public design */
.phone-screen.template-executive{background:linear-gradient(155deg,#111827,#0b1220 72%);border:1px solid #b99b61}
.phone-screen.template-executive .preview-avatar-wrap{border-color:#c8a96b}
.phone-screen.template-executive .preview-contact{background:#c8a96b;color:#101827}
.phone-screen.template-minimal{background:#f8fafc;color:#172033}
.phone-screen.template-minimal h3{color:#172033}
.phone-screen.template-minimal .preview-profession,.phone-screen.template-minimal .preview-company,.phone-screen.template-minimal .preview-description,.phone-screen.template-minimal>small{color:#526176}
.phone-screen.template-minimal .preview-avatar-wrap{border-color:#172033}
.phone-screen.template-minimal .preview-social span{color:#172033;border-color:#c7d2e1}
.phone-screen.template-minimal .preview-contact{background:#172033;color:#fff}
.phone-screen.template-creative{background:radial-gradient(ellipse at 0% 0%,#5a236e,#17102b 55%,#090b18);border:1px solid #a64bd0}
.phone-screen.template-creative .preview-avatar-wrap{border-color:#ff4b75}
.phone-screen.template-creative .preview-contact{background:linear-gradient(100deg,#ed1838,#9d35c7)}
@media(max-width:850px){.template-picker{padding:15px}.template-options{gap:8px}.template-option{padding:9px}.template-swatch{height:42px}}

/* v6.2 — seletor de modelos junto da pré-visualização */
.editor-preview .template-picker{margin:22px 0 0;padding:16px;background:#080f20;border:1px solid var(--line);border-radius:16px}
.editor-preview .template-picker-head h2{font-size:17px;margin:5px 0}
.editor-preview .template-picker-head p{font-size:12px;line-height:1.45}
.editor-preview .template-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:13px}
.editor-preview .template-option{min-width:0;padding:9px;gap:5px;transition:border-color .18s,background .18s,transform .18s}
.editor-preview .template-option:active{transform:scale(.98)}
.editor-preview .template-option b{font-size:13px}
.editor-preview .template-option small{font-size:10px;line-height:1.35}
.editor-preview .template-swatch{height:38px}
@media(max-width:850px){
  .editor-preview .template-picker{margin-top:18px;padding:14px}
  .editor-preview .template-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .editor-preview .template-option{min-height:86px}
  .editor-preview .template-swatch{height:34px}
}

/* v6.5 — guardar junto aos modelos e suporte PWA */
.editor-save-design{display:block;width:100%;margin:14px 0 0;min-height:50px}
@media(max-width:850px){.editor-save-design{position:sticky;bottom:10px;z-index:5;box-shadow:0 8px 28px #0008}}


/* v6.6 — instalação simples da aplicação no painel do cliente */
.install-app-card{display:flex;align-items:center;gap:20px;margin:24px 0;padding:22px;border:1px solid #34435c;border-radius:20px;background:linear-gradient(125deg,#111d32,#0b1221 72%);box-shadow:0 16px 40px #0002}
.install-app-icon{display:flex;align-items:center;justify-content:center;flex:0 0 68px;width:68px;height:68px;border-radius:19px;background:linear-gradient(145deg,#ed1838,#a80f2b);box-shadow:0 8px 22px #ed183844;color:#fff;font-size:23px;font-weight:900;letter-spacing:-2px}
.install-app-copy{min-width:0;flex:1}
.install-app-copy h2{margin:5px 0 6px;font-size:22px}
.install-app-copy>p{margin:0 0 14px;color:var(--muted);font-size:14px;line-height:1.55}
.install-app-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.install-app-actions .button{margin:0;cursor:pointer}
.install-app-actions button:disabled{opacity:.65;cursor:default}
.install-help-toggle{border:0;background:transparent;color:#dce5f4;cursor:pointer;font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:3px}
.install-app-help{margin-top:14px;padding:13px 15px;border:1px solid #34435c;border-radius:12px;background:#080f20}
.install-app-help p{margin:0;color:#e6ebf5;font-size:13px;line-height:1.65}
.install-app-status{min-height:0;margin:9px 0 0!important;color:#b9c8dc!important;font-size:12px!important}
@media(max-width:600px){.install-app-card{align-items:flex-start;gap:13px;padding:16px;margin:19px 0}.install-app-icon{flex-basis:52px;width:52px;height:52px;border-radius:15px;font-size:19px}.install-app-copy h2{font-size:19px}.install-app-copy>p{font-size:13px}.install-app-actions{align-items:stretch;flex-direction:column;gap:8px}.install-app-actions .button{width:100%;text-align:center}.install-help-toggle{padding:8px}}

/* ID.Clicou v6.8 — estado de aplicação instalada */
.install-app-card.is-installed .install-app-actions { display:none !important; }
.install-app-card.is-installed .install-app-status { margin-top:14px; }
.install-app-card.is-installed .install-app-status::before { content:"✓  "; color:#35c98a; font-weight:800; }
.install-app-card .install-app-actions button:disabled { opacity:.72; cursor:default; }

/* v6.9 — ícones sociais vetoriais no estilo dos templates */
.social-icons{display:flex;justify-content:center;align-items:center;gap:12px;margin:22px 0 16px}
.social-icon-link{width:46px;height:46px;display:grid;place-items:center;border:1px solid #46536a;border-radius:13px;color:inherit;background:transparent;text-decoration:none;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.social-icon-link svg,.preview-social svg{width:19px;height:19px;display:block;fill:currentColor}
.social-icon-link:hover{transform:translateY(-2px);border-color:var(--accent);background:#ffffff08}
.preview-social span{width:36px;height:36px;display:grid;place-items:center;border:1px solid #43516a;border-radius:10px;color:#fff}
.preview-social svg{width:17px;height:17px}
.publiccard.template-minimal .social-icon-link{color:#172033;border-color:#c7d2e1}
.publiccard.template-executive .social-icon-link{border-color:#8d784f}
.publiccard.template-creative .social-icon-link{border-color:#a64bd0}
.phone-screen.template-minimal .preview-social span{color:#172033;border-color:#c7d2e1}

/* v7.0 — ícones de contacto e redes; apenas campos preenchidos */
.social-icons{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin:22px 0 16px}
.social-icon-link{box-sizing:border-box;width:46px;height:46px;flex:0 0 46px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #46536a;border-radius:13px;color:inherit;background:transparent;text-decoration:none;line-height:1}
.social-icon-link svg{display:block!important;width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important;min-height:20px!important;max-height:20px!important;flex:0 0 20px!important;fill:currentColor;overflow:visible}
.social-icon-link:hover{transform:translateY(-2px);border-color:var(--accent);background:#ffffff08}
.publiccard.template-minimal .social-icon-link{color:#172033;border-color:#c7d2e1}
.publiccard.template-executive .social-icon-link{border-color:#8d784f}
.publiccard.template-creative .social-icon-link{border-color:#a64bd0}
.preview-social{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:9px;margin:12px 0}
.preview-social[hidden],.preview-social span[hidden]{display:none!important}
.preview-social span{box-sizing:border-box;width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;overflow:hidden;border:1px solid #43516a;border-radius:10px;color:#fff}
.preview-social svg{display:block!important;width:17px!important;height:17px!important;min-width:17px!important;max-width:17px!important;min-height:17px!important;max-height:17px!important;fill:currentColor}
.phone-screen.template-minimal .preview-social span{color:#172033;border-color:#c7d2e1}

/* v7.1 — correção definitiva dos ícones: tamanho, cor e cache */
.social-icons{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;align-items:center!important;gap:12px!important;margin:22px 0 16px!important}
.social-icons .social-icon-link{box-sizing:border-box!important;width:46px!important;height:46px!important;min-width:46px!important;max-width:46px!important;flex:0 0 46px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;border:1px solid #8d784f!important;border-radius:13px!important;color:#e8edf7!important;background:transparent!important;line-height:1!important;padding:0!important}
.social-icons .social-icon-link svg{display:block!important;width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important;min-height:20px!important;max-height:20px!important;flex:0 0 20px!important;color:inherit!important;fill:currentColor!important}

/* v7.2 — contactos e redes sociais em duas linhas fixas e ordenadas */
.card-contact-groups{display:flex;flex-direction:column;align-items:center;gap:18px;margin:22px 0 18px}
.card-contact-groups .social-icons{display:flex!important;flex-wrap:nowrap!important;justify-content:center!important;align-items:center!important;gap:12px!important;margin:0!important;width:100%}
.card-contact-groups .social-icon-row{padding-top:16px;border-top:1px solid color-mix(in srgb,currentColor 16%,transparent)}
.card-contact-groups .social-icon-link{width:46px!important;height:46px!important;flex:0 0 46px!important}
.preview-contact-groups{display:flex;flex-direction:column;align-items:center;gap:10px;margin:12px 0}
.preview-contact-groups[hidden],.preview-contact-row[hidden]{display:none!important}
.preview-contact-row{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:9px;width:100%}
.preview-contact-row.preview-social-row{padding-top:9px;border-top:1px solid #43516a}
.preview-contact-row span{box-sizing:border-box;width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;overflow:hidden;border:1px solid #43516a;border-radius:10px;color:#fff}
.preview-contact-row span[hidden]{display:none!important}
.preview-contact-row svg{display:block!important;width:17px!important;height:17px!important;max-width:17px!important;max-height:17px!important;fill:currentColor}
.phone-screen.template-minimal .preview-contact-row span{color:#172033;border-color:#c7d2e1}
@media(max-width:380px){.card-contact-groups .social-icons{gap:8px!important}.card-contact-groups .social-icon-link{width:42px!important;height:42px!important;flex-basis:42px!important}}