*{margin:0;padding:0;box-sizing:border-box;}
:root{--teal:#5AADAA;--teal-dark:#4a9694;--teal-bg:#E8F2F1;--black:#111;--gray-900:#1F2937;--gray-700:#374151;--gray-500:#6B7280;--gray-300:#D1D5DB;--gray-100:#F3F4F6;--gray-50:#F9FAFB;--white:#fff;--green:#10B981;--green-bg:#D1FAE5;--red:#EF4444;--red-bg:#FEE2E2;--yellow:#F59E0B;--yellow-bg:#FEF3C7;--blue:#3B82F6;--blue-bg:#DBEAFE;}
body{font-family:'Inter',sans-serif;background:var(--gray-50);color:var(--gray-900);font-size:14px;line-height:1.5;}
.app{display:flex;min-height:100vh;}
.sidebar{width:260px;background:var(--black);color:#fff;padding:24px 16px;position:fixed;height:100vh;display:flex;flex-direction:column;}
.sidebar .logo{display:flex;align-items:center;gap:12px;padding:0 12px 24px;border-bottom:1px solid #2a2a2a;margin-bottom:20px;}
.sidebar .logo svg{width:44px;height:44px;}
.sidebar .logo span{font-weight:700;font-size:18px;}
.sidebar nav{flex:1;}
.sidebar nav a{display:flex;align-items:center;gap:12px;padding:12px 14px;color:#aaa;text-decoration:none;border-radius:8px;margin-bottom:4px;font-weight:500;transition:.2s;}
.sidebar nav a:hover{background:#1f1f1f;color:#fff;}
.sidebar nav a.active{background:var(--teal);color:#fff;}
.sidebar nav a .icon{font-size:18px;}
.sidebar .user{padding:14px;background:#1f1f1f;border-radius:10px;display:flex;align-items:center;gap:10px;}
.user-avatar{width:36px;height:36px;background:var(--teal);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;}
.user-info{flex:1;}
.user-info .name{font-size:13px;font-weight:600;color:#fff;}
.user-info .role{font-size:11px;color:#888;}
.main{flex:1;margin-left:260px;padding:32px 40px;}
.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;}
.page-header h1{font-size:28px;font-weight:800;}
.page-header p{color:var(--gray-500);margin-top:4px;}
.btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:.2s;text-decoration:none;}
.btn-primary{background:var(--teal);color:#fff;}
.btn-primary:hover{background:var(--teal-dark);}
.btn-secondary{background:#fff;color:var(--gray-900);border:1px solid var(--gray-300);}
.btn-secondary:hover{border-color:var(--teal);color:var(--teal);}
.btn-sm{padding:6px 12px;font-size:12px;}
.card{background:#fff;border-radius:12px;padding:24px;border:1px solid var(--gray-100);}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:28px;}
.stat-card{background:#fff;border-radius:12px;padding:20px;border:1px solid var(--gray-100);}
.stat-card .label{font-size:13px;color:var(--gray-500);margin-bottom:8px;}
.stat-card .value{font-size:28px;font-weight:800;margin-bottom:4px;}
.stat-card .change{font-size:12px;}
.stat-card.green .value{color:var(--green);}
.stat-card.red .value{color:var(--red);}
.stat-card.yellow .value{color:var(--yellow);}
.stat-card.teal .value{color:var(--teal);}
.table-container{background:#fff;border-radius:12px;overflow:hidden;border:1px solid var(--gray-100);}
.table-header{padding:20px 24px;border-bottom:1px solid var(--gray-100);display:flex;justify-content:space-between;align-items:center;}
.table-header h3{font-size:16px;font-weight:700;}
table{width:100%;border-collapse:collapse;}
table th{text-align:left;padding:12px 24px;font-size:12px;font-weight:600;color:var(--gray-500);text-transform:uppercase;background:var(--gray-50);border-bottom:1px solid var(--gray-100);}
table td{padding:14px 24px;font-size:14px;border-bottom:1px solid var(--gray-100);}
table tr:hover{background:var(--gray-50);}
.badge{display:inline-block;padding:4px 10px;border-radius:50px;font-size:11px;font-weight:600;}
.badge-green{background:var(--green-bg);color:#065F46;}
.badge-red{background:var(--red-bg);color:#991B1B;}
.badge-yellow{background:var(--yellow-bg);color:#92400E;}
.badge-blue{background:var(--blue-bg);color:#1E40AF;}
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;}
.form-control{width:100%;padding:10px 14px;border:1px solid var(--gray-300);border-radius:8px;font-size:14px;font-family:inherit;}
.form-control:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(90,173,170,.1);}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--teal-bg),var(--gray-50));padding:20px;}
.login-card{background:#fff;padding:40px;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.1);width:100%;max-width:420px;}
.login-card .logo{text-align:center;margin-bottom:24px;}
.login-card .logo svg{width:80px;height:80px;}
.login-card h2{text-align:center;margin-bottom:8px;font-size:22px;}
.login-card p.subtitle{text-align:center;color:var(--gray-500);margin-bottom:24px;}
.upload-area{border:2px dashed var(--gray-300);border-radius:12px;padding:40px;text-align:center;cursor:pointer;transition:.2s;background:var(--gray-50);}
.upload-area:hover{border-color:var(--teal);background:var(--teal-bg);}
.upload-area .icon{font-size:48px;margin-bottom:12px;}
.upload-area h4{font-size:16px;margin-bottom:6px;}
.upload-area p{color:var(--gray-500);font-size:13px;}
.integrations-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.integration-card{background:#fff;padding:20px;border-radius:12px;border:1px solid var(--gray-100);display:flex;align-items:center;gap:14px;}
.integration-logo{width:50px;height:50px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;color:#fff;}
.integration-card .info{flex:1;}
.integration-card h4{font-size:15px;margin-bottom:2px;}
.integration-card .status{font-size:12px;color:var(--gray-500);}
@media(max-width:968px){.sidebar{width:70px;padding:16px 8px;}.sidebar .logo span,.sidebar nav a span:not(.icon),.sidebar .user-info{display:none;}.main{margin-left:70px;padding:20px;}.stats-grid{grid-template-columns:repeat(2,1fr);}.integrations-grid{grid-template-columns:1fr;}}

/* === ÍCONES PROFISSIONAIS === */
.ico {
  width: 20px;
  height: 20px;
  stroke-width: 2;
  flex-shrink: 0;
}
.ico-sm { width: 16px; height: 16px; }
.ico-lg { width: 24px; height: 24px; }
.ico-xl { width: 32px; height: 32px; }

.sidebar nav a svg {
  width: 20px;
  height: 20px;
  stroke-width: 2;
  flex-shrink: 0;
}

/* Logos de plataformas - mais profissional */
.integration-logo {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.5px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  position: relative;
}

.integration-card {
  transition: all 0.2s;
  cursor: pointer;
}
.integration-card:hover {
  border-color: var(--teal);
  box-shadow: 0 4px 16px rgba(90,173,170,0.12);
  transform: translateY(-2px);
}

/* Badge de conexão */
.conn-dot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
}
.conn-dot::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gray-300);
}
.conn-dot.active::before {
  background: var(--green);
  box-shadow: 0 0 0 3px rgba(16,185,129,0.2);
}

/* Stat cards mais clean */
.stat-card {
  position: relative;
  overflow: hidden;
}
.stat-card .stat-icon {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gray-50);
}
.stat-card.teal .stat-icon { background: var(--teal-bg); color: var(--teal); }
.stat-card.green .stat-icon { background: var(--green-bg); color: var(--green); }
.stat-card.red .stat-icon { background: var(--red-bg); color: var(--red); }
.stat-card.yellow .stat-icon { background: var(--yellow-bg); color: var(--yellow); }

/* Sobrescreve regras antigas L-* */
.sidebar nav a.active {
  background: var(--teal) !important;
  color: #fff !important;
}
.sidebar nav a.active svg {
  stroke: #fff;
}


/* === FIX: Ícones do sidebar === */
.sidebar nav a svg {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  stroke: currentColor !important;
  fill: none !important;
}

.sidebar nav a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}


/* === LOGOS DAS PLATAFORMAS === */
.platform-logo {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 22px;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  overflow: hidden;
}

.platform-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}

/* Cores oficiais */
.platform-hotmart    { background: #EF4E23; }
.platform-kiwify     { background: #04BF7B; }
.platform-eduzz      { background: #FFB400; color: #1a1a1a; }
.platform-monetizze  { background: #1E88E5; }
.platform-braip      { background: #6B2FB3; }
.platform-perfectpay { background: #00C2A8; }
.platform-cakto      { background: #FF3366; }
.platform-greenn     { background: #00A86B; }
.platform-doppus     { background: #2D3748; }
.platform-nfeio      { background: #0066FF; }
.platform-enotas     { background: #FF6B35; }
.platform-focusnfe   { background: #1976D2; }


/* Logos como imagem dentro do integration-logo */
.integration-logo.platform-logo-img {
  background: transparent !important;
  padding: 0 !important;
  overflow: hidden;
}
.integration-logo.platform-logo-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}


/* Logos PNG de favicon — fundo branco com padding */
.integration-logo.platform-logo-img {
  background: #ffffff !important;
  padding: 6px !important;
  border: 1px solid var(--gray-200, #e5e7eb);
}
.integration-logo.platform-logo-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* === FIX: Perfectpay logo pequeno === */
.platform-logo-img img[alt="Perfectpay"] {
  width: 180% !important;
  height: 180% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  transform: scale(1.8);
}

/* === FIX: Monetizze logo arredondado === */
.platform-logo-img:has(img[alt="Monetizze"]) {
  border-radius: 50% !important;
  overflow: hidden !important;
}

.platform-logo-img img[alt="Monetizze"] {
  border-radius: 50% !important;
  object-fit: cover !important;
}

/* === FIX: Padronizar TODOS os logos === */
.platform-logo-img,
.emissor-logo-img,
...

/* === FIX UNIVERSAL: Forçar TODOS os logos arredondados === */

/* Pega QUALQUER div que contenha uma img dentro dos cards */
.card > div:first-child,
.integration-card > div:first-child,
[class*="card"] > div:has(> img),
[class*="card"] > div:has(> svg) {
  border-radius: 50% !important;
  overflow: hidden !important;
  background: #fff !important;
}

/* Pega QUALQUER imagem dentro de cards */
[class*="card"] img,
.integration-card img,
.platform-card img,
.emissor-card img {
  border-radius: 50% !important;
  background: #fff !important;
  object-fit: contain !important;
}

/* Específico: força o container pai do logo */
.card img,
.card svg {
  border-radius: 50% !important;
}

.card > div:first-child {
  background: #fff !important;
  border-radius: 50% !important;
  border: 1px solid #e5e7eb !important;
  overflow: hidden !important;
}


/* === LOGO SIDEBAR === */
.sidebar-logo-text {
  font-family: 'Nunito', Inter, sans-serif;
  font-size: 24px;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 0;
}
.sidebar-logo-text .fatur {
  font-weight: 300;
  color: #ffffff;
}
.sidebar-logo-text .up-wrap {
  background: #5AADAA;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
}
.sidebar-logo-text .up {
  font-weight: 900;
  color: #ffffff;
  font-size: 16px;
  line-height: 1;
}

/* === FONTE EASTMAN ALTERNATE WOFF2 === */
@font-face {
  font-family: 'Eastman';
  src: url('../fonts/eastman-light.woff2') format('woff2');
  font-weight: 300;
}
@font-face {
  font-family: 'Eastman';
  src: url('../fonts/eastman-bold.woff2') format('woff2');
  font-weight: 700;
}

/* === LOGO SIDEBAR EASTMAN === */
.sidebar-logo-text {
  font-family: 'Eastman', sans-serif !important;
  font-size: 24px;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 0;
}
.sidebar-logo-text .fatur {
  font-weight: 300;
  color: #ffffff;
}
.sidebar-logo-text .up-wrap {
  background: #5AADAA;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
}
.sidebar-logo-text .up {
  font-weight: 700;
  color: #ffffff;
  font-size: 16px;
  line-height: 1;
}

/* === FIX LOGO === */
.sidebar-logo-text {
  gap: 0 !important;
  letter-spacing: -0.5px;
}
.sidebar-logo-text .fatur {
  font-weight: 300 !important;
  margin-right: -2px;
}
.sidebar-logo-text .up-wrap {
  margin-left: 2px !important;
}
.sidebar-logo-text .up {
  font-weight: 700 !important;
}