/* DRIVEME_SIGNIN_COMPACT_V1 */

/*
 * Shared compact presentation for:
 * /companion/sign-in
 * /driver/sign-in
 * /backend/sign-in
 *
 * No authentication behavior is modified.
 */

html,
body{
  min-height:100%;
}

body{
  overflow-x:hidden;
}

/* Main auth composition */
.auth-shell,
.category-auth-shell,
.auth-layout,
.portal-auth,
main{
  min-height:auto !important;
}

/* Reduce large page paddings without depending on one exact historic class name. */
.auth-shell,
.category-auth-shell,
.auth-layout,
.auth-wrap,
.auth-container,
.portal-auth{
  padding-top:clamp(16px,2.4vh,28px) !important;
  padding-bottom:clamp(16px,2.4vh,28px) !important;
}

/* Compact principal card */
.auth-card,
.category-auth-card,
.signin-card,
.login-card,
.auth-panel,
.workspace-panel{
  max-width:960px;
}

.auth-card,
.category-auth-card,
.signin-card,
.login-card{
  padding:clamp(18px,2vw,26px) !important;
}

/* Intro / hero copy */
.auth-copy h1,
.auth-card h1,
.category-auth-card h1,
.signin-card h1,
main h1{
  margin-bottom:6px !important;
  font-size:clamp(26px,2.4vw,36px) !important;
  line-height:1.05 !important;
}

.auth-copy p,
.auth-card > p,
.category-auth-card > p,
.signin-card > p,
.auth-intro,
.auth-subtitle{
  margin-top:0 !important;
  margin-bottom:12px !important;
  line-height:1.4 !important;
}

/* Compact role/category eyebrow */
.eyebrow,
.auth-eyebrow,
.portal-label{
  margin-bottom:5px !important;
  font-size:11px !important;
  letter-spacing:.12em !important;
}

/* Form density */
form{
  margin-top:12px !important;
}

form label{
  display:block;
  margin-bottom:4px !important;
  font-size:13px !important;
  font-weight:700;
}

form input,
form select{
  min-height:42px !important;
  height:42px !important;
  padding:0 11px !important;
}

form button,
.auth-card button,
.category-auth-card button,
.signin-card button{
  min-height:42px !important;
  padding:9px 14px !important;
}

/* Reduce inter-field whitespace */
.workspace-field,
.auth-field,
.form-field,
.field,
.form-group{
  margin-bottom:10px !important;
}

form > * + *{
  margin-top:10px;
}

/* Keep password utilities close to the field */
.password-tools,
.auth-tools,
.form-tools,
.auth-links,
.signin-links{
  margin-top:8px !important;
  margin-bottom:8px !important;
}

/* Compact test/mock credential notice */
.mock-credentials,
.test-credentials,
.auth-test-note,
.auth-notice,
.workspace-safe-note,
#driveme-mock-signin-prefill-notice{
  padding:8px 10px !important;
  margin-top:10px !important;
  margin-bottom:10px !important;
  font-size:12px !important;
  line-height:1.35 !important;
}

/* Tighten ancillary text/footer */
.auth-footer,
.signin-footer,
.portal-footer,
footer{
  margin-top:12px !important;
  padding-top:10px !important;
  padding-bottom:10px !important;
  font-size:12px !important;
}

/* Avoid giant decorative areas on sign-in screens */
.auth-visual,
.auth-hero,
.signin-visual,
.portal-visual{
  min-height:0 !important;
  padding-top:18px !important;
  padding-bottom:18px !important;
}

/* If the auth page uses a two-column composition, keep it compact. */
.auth-grid,
.category-auth-grid,
.auth-layout{
  gap:clamp(18px,3vw,36px) !important;
  align-items:center !important;
}

/* Desktop: favor a compact centered card rather than tall full-screen spread. */
@media (min-width:769px){
  .auth-shell,
  .category-auth-shell,
  .auth-layout,
  .auth-wrap,
  .auth-container,
  .portal-auth{
    min-height:calc(100dvh - 90px) !important;
    display:flex;
    align-items:center;
  }

  .auth-card,
  .category-auth-card,
  .signin-card,
  .login-card{
    max-height:calc(100dvh - 120px);
    overflow:auto;
  }
}

/* Mobile: preserve readability but remove excess vertical spacing. */
@media (max-width:768px){
  .auth-shell,
  .category-auth-shell,
  .auth-layout,
  .auth-wrap,
  .auth-container,
  .portal-auth{
    padding:12px !important;
  }

  .auth-card,
  .category-auth-card,
  .signin-card,
  .login-card{
    padding:16px !important;
    border-radius:12px !important;
  }

  .auth-copy h1,
  .auth-card h1,
  .category-auth-card h1,
  .signin-card h1,
  main h1{
    font-size:26px !important;
  }

  form input,
  form select,
  form button{
    min-height:42px !important;
    height:auto !important;
  }
}