/* ═══════════════════════════════════════════
   UreTech CRM Demo Widget - External Styles
   Responsive overrides (animations are inline via JS)
   ═══════════════════════════════════════════ */

.uretech-crm-demo-root {
    font-family: 'Outfit', sans-serif;
    position: relative;
    overflow: hidden;
}

/* Tablet */
@media (max-width: 1024px) and (min-width: 769px) {
  .ure-crm-demo { padding: 32px 24px; }
  .ure-crm-demo__sidebar { min-width: 200px; }
}

@media (max-width: 768px) {
    .uretech-crm-demo-root .crm-tabs-nav button {
        font-size: 10px !important;
        padding: 6px 8px !important;
    }
    .uretech-crm-demo-root .crm-tabs-nav button svg {
        display: none !important;
    }
    .uretech-crm-demo-root .crm-kpi-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .uretech-crm-demo-root .crm-contacts-wrap {
        flex-direction: column !important;
    }
    .uretech-crm-demo-root .crm-contacts-wrap > div:last-child {
        max-height: 180px !important;
        flex: none !important;
    }
    .uretech-crm-demo-root .crm-pipe-cols {
        gap: 6px !important;
    }
    .uretech-crm-demo-root .crm-pipe-cols > div {
        min-width: 110px !important;
    }
    .uretech-crm-demo-root .crm-hero-h1 {
        font-size: 26px !important;
    }
    .uretech-crm-demo-root .crm-hero-p {
        font-size: 13px !important;
    }
    .uretech-crm-demo-root .crm-hero-btns {
        flex-direction: column !important;
        align-items: center !important;
    }
    .uretech-crm-demo-root .crm-hero-btns a {
        width: 100% !important;
        max-width: 260px !important;
        justify-content: center !important;
    }
    .uretech-crm-demo-root .crm-bottom-stats {
        gap: 20px !important;
    }
    .uretech-crm-demo-root .crm-bottom-stats .crm-stat-num {
        font-size: 18px !important;
    }
}