/**
 * Avyukt Dental CRM — Standalone Page Styles
 * Applied when plugin outputs its own full HTML document (template_redirect takeover).
 * No WP theme present, so we just need app shell + login page layout.
 *
 * Author:  Arun Vats | Super Web Development LLP
 * Version: 2.0.0
 */

/* ── Base reset for standalone page ───────────────────────────────────────── */
html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #FDF0F6;
  font-family: 'DM Sans', 'Segoe UI', sans-serif;
}

body.adcrm-standalone {
  position: fixed;
  inset: 0;
  overflow: hidden;
  background: #FDF0F6;
}

/* ── App shell fills entire viewport ──────────────────────────────────────── */
body.adcrm-standalone #adcrm-app {
  position: fixed;
  inset: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  height: 100dvh; /* dynamic viewport — fixes iOS address bar gap */
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #FDF0F6;
  z-index: 1;
}

/* ── Login page fills entire viewport ─────────────────────────────────────── */
body.adcrm-standalone #adcrm-login-wrap {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #FCE4EC 0%, #F8BBD9 45%, #FCE4EC 100%);
  padding: 20px;
  z-index: 1;
}

/* ── Scrollable content area ───────────────────────────────────────────────── */
body.adcrm-standalone .adcrm-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
body.adcrm-standalone .adcrm-content::-webkit-scrollbar { display: none; }

/* ── Bottom nav sits at the bottom ────────────────────────────────────────── */
body.adcrm-standalone .adcrm-bottom-nav {
  flex-shrink: 0;
  width: 100%;
}

/* ── iOS safe area insets ──────────────────────────────────────────────────── */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  body.adcrm-standalone .adcrm-bottom-nav {
    padding-bottom: env(safe-area-inset-bottom);
    height: calc(64px + env(safe-area-inset-bottom));
  }
}

/* ── Centered on desktop (looks like a phone app on big screens) ──────────── */
@media (min-width: 520px) {
  body.adcrm-standalone {
    background: linear-gradient(145deg, #FCE4EC 0%, #F8BBD9 100%);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  body.adcrm-standalone #adcrm-app {
    position: relative;
    width: 480px;
    max-width: 480px;
    height: 100vh;
    height: 100dvh;
    border-radius: 0;
    box-shadow: 0 0 80px rgba(233, 30, 140, 0.25);
    overflow: hidden;
  }
  body.adcrm-standalone #adcrm-login-wrap {
    position: fixed;
  }
}

/* ── Canvas fix ────────────────────────────────────────────────────────────── */
body.adcrm-standalone canvas {
  max-width: 100% !important;
  display: block;
}

/* ── Toast positioned above bottom nav ────────────────────────────────────── */
body.adcrm-standalone #adcrm-toast {
  bottom: calc(64px + 12px + env(safe-area-inset-bottom, 0px));
}