﻿/* ==========================================================
   ViyaBook branding.css  logo sizing & brand consistency
   Load order: after styles.css, layout.css, responsive.css
   Injected by shared-sidebar.js on all app pages;
   linked manually on auth pages (login, signup, etc.)
   ========================================================== */

/* ----------------------------------------------------------
   1. LOADING SCREEN LOGO
   ---------------------------------------------------------- */
.viya-loader-logo {
  width: auto !important;
  height: 72px !important;
  max-width: 180px !important;
  object-fit: contain !important;
}

/* ----------------------------------------------------------
   2. SIDEBAR BRAND  compact icon + text layout
   ---------------------------------------------------------- */
.sidebar-brand {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  overflow: hidden !important;
  min-width: 0 !important;
}

/* Icon mark */
.vb-brand-icon {
  display: block !important;
  height: 42px !important;
  width: auto !important;
  max-width: 64px !important;
  flex-shrink: 0 !important;
  object-fit: contain !important;
}

.brand img,
.sidebar .brand img,
.side .brand img {
  width: 42px !important;
  height: 42px !important;
  max-width: 64px !important;
  object-fit: contain !important;
}

/* Text column */
.vb-brand-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

/* "ViyaBook" */
.vb-brand-name {
  display: block !important;
  font-size: 15.5px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
}

/* "Business Made Easy" */
.vb-brand-tag {
  display: block !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.2 !important;
}

/* ----------------------------------------------------------
   3. MOBILE HEADER LOGO
   ---------------------------------------------------------- */
.viya-mobile-logo {
  height: 28px !important;
  width: auto !important;
  max-width: 110px !important;
  object-fit: contain !important;
}

/* ----------------------------------------------------------
   4. DESKTOP HEADER LOGO (shown at certain breakpoints)
   ---------------------------------------------------------- */
.viya-header-logo {
  height: 28px !important;
  width: auto !important;
  max-width: 130px !important;
  object-fit: contain !important;
}

.viya-svg-icon,
[data-viya-icon] svg {
  width: 1.15em;
  height: 1.15em;
  display: inline-block;
  vertical-align: -0.18em;
}

button > .viya-svg-icon:only-child {
  width: 1em;
  height: 1em;
  margin: 0 auto;
  display: block;
}

/* ----------------------------------------------------------
   5. RESPONSIVE
   ---------------------------------------------------------- */
@media (max-width: 1023px) {
  .vb-brand-icon  { height: 36px !important; max-width: 56px !important; }
  .vb-brand-name  { font-size: 14px !important; }
  .vb-brand-tag   { font-size: 10px !important; }
}

@media (max-width: 767px) {
  .viya-mobile-logo { height: 26px !important; }
}

@media (max-width: 430px) {
  .viya-mobile-logo { height: 24px !important; }
}
