/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

body {
  font-family: "Roboto", sans-serif;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

html {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

@media (prefers-color-scheme: dark) {
  body,
  i {
    background-color: black;
    color: white;
  }
}

.base-color {
  color: #661813 !important;
}

.primary-color {
  color: #ce3328 !important;
}

@media (prefers-color-scheme: light) {
  body,
  i {
    background-color: white;
  }
}

.bg-red-500 {
  background-color: #ce3328 !important;
}

.text-center {
  text-align: center;
}

.bottom {
  position: fixed;
  bottom: 0;
  background-color: white;
  width: 100%;
  height: 12%;
  border-top-color: lightgrey;
  border-top-width: 1px;
}

:root {
  color-scheme: light only !important;
}

.cover-img {
  margin: 0 auto;
  border-radius: 10px;
  max-width: 700px;
  width: 100%;
}

@media (prefers-color-scheme: dark) {
  body, i {
     background-color: white;
     color: black;
  }
}

.fill {
  height: 100vh;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Registration form styles */
input {
  display: flex;
  display: -webkit-flex;
  flex: 1 0 0;
  -webkit-flex: 1 0 0;
}

.input-container {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  background-color: white;
  padding: 0.25rem;
}

.country-code {
  padding: 1rem;
  background-color: #f3f4f6;
  border-right: 1px solid #d1d5db;
  color: #4b5563;
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}

.phone-input {
  flex: 1;
  padding: 1rem;
  border: none;
  outline: none;
  color: #4b5563;
  background-color: white;
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}