/* Custom overrides and additional styles */
body {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
}

/* Optional: custom background overlay similar to original app */
section[style*="background-image"]::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(128, 128, 128, 0.5);
  z-index: 1;
}

section[style*="background-image"] > * {
  position: relative;
  z-index: 2;
}

html[data-theme="dark"] {
    --p: 199 93% 77%;
    --pf: 240 100% 2%;
    --pc: 0 0% 100%; /* White text */
}

html[data-theme="light"] {
    --p: 45 100% 50%;
    --pf: 240 100% 2%; /* Dark navy for contrast */
    --pc: 0 0% 100%; /* White text for better visibility */
}

.text-primary-content {
  color: hsl(var(--pc));
}

.bg-primary-focus {
    background-color: hsl(var(--p) / 70%);
}

/* Ensure primary buttons have white text in light mode */
html[data-theme="light"] .btn-primary {
    color: white !important;
}

html[data-theme="light"] .btn-primary:hover {
    color: white !important;
}

/* Ensure all button variants have proper text color */
html[data-theme="light"] .btn {
    color: inherit;
}

html[data-theme="light"] .btn-primary,
html[data-theme="light"] .btn-primary:hover,
html[data-theme="light"] .btn-primary:focus,
html[data-theme="light"] .btn-primary:active {
    color: white !important;
}

/* Fix horizontal scrollbar in phone mockup */
.phone-mockup-content {
    width: 100%;
    overflow-x: hidden !important;
    overflow-y: auto;
}

.phone-mockup-content > * {
    max-width: 100%;
}

/* Force no horizontal scroll on phone screen */
.phone-screen {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

.phone-screen * {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Hide all scrollbars in phone mockup */
.phone-mockup-content::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

.phone-mockup-content {
    -ms-overflow-style: none !important;  /* IE and Edge */
    scrollbar-width: none !important;  /* Firefox */
}