@import "./login.css";
@import "./posts.css";
@import "./home.css";
@import "./perspective.css";

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .Btn-primary {
    @apply flex justify-center rounded-md bg-yellow-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-yellow-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-yellow-600 cursor-pointer;
  }

  .Btn-download {
    @apply flex justify-center rounded-md bg-orange-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-yellow-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-yellow-600 cursor-pointer;
  }

  .Btn-secondary {
    @apply flex justify-center rounded-md bg-gray-300 px-3 py-1.5 text-sm font-semibold leading-6 text-gray-700 shadow-sm hover:bg-gray-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400;
  }

  .Btn-delete {
    @apply flex justify-center rounded-md bg-red-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-600;
  }

  .Btn-google {
    @apply flex items-center w-full justify-center rounded-md bg-red-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-600;
  }

  .Container {
    @apply flex flex-col bg-gray-100 text-gray-200 border border-gray-300 p-6 shadow-lg max-w-2xl rounded-lg;
  }

  .Container2 {
    @apply bg-gray-100 text-gray-200 border border-gray-300 p-6 shadow-lg rounded-lg;
  }

  .HeaderContainer {
    @apply sm:mx-auto sm:w-full sm:max-w-sm flex items-center justify-center;
  }

  .ContainerHeaderText {
    @apply mt-10 text-2xl font-bold leading-9 tracking-tight text-gray-900;
  }

  .Sidebar {
    @apply bg-white text-gray-700 w-64 h-full shadow-lg flex flex-col;
  }

  .SidebarLink {
    @apply block py-2 px-4 hover:bg-yellow-400 transition flex items-center;
  }

  .SidebarIcon {
    @apply w-6 h-6;
  }

  .TableHeader {
    @apply px-4 py-4 text-left text-xs font-medium text-gray-700 uppercase tracking-wider bg-gray-300 border-b border-gray-200;
  }

  .TableEntry {
    @apply px-4 py-4 whitespace-nowrap text-sm text-gray-600 border-b border-gray-200;
  }

  .TableEntry2 {
    @apply px-4 py-4 text-sm text-gray-600 border-b border-gray-200;
  }

  .InputField {
    @apply block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-yellow-600 sm:text-sm sm:leading-6;
  }

  .InputField2 {
    @apply block rounded-md text-gray-900 shadow-sm border-0 py-1.5 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-yellow-600 sm:text-sm sm:leading-6;
  }

  .InputFieldReadOnly {
    @apply block w-full rounded-md border-0 py-1.5 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 sm:text-sm sm:leading-6 focus:outline-none;
    pointer-events: none;
  }
  .TextArea {
    @apply block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-yellow-600;
  }

  .Comment {
    @apply block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-yellow-600 bg-white pl-4 pr-4;
  }

  .GenericFormLabel {
    @apply block text-gray-700;
  }

  .FileSelectButton {
    @apply flex justify-center rounded-md bg-gray-300 px-3 py-1.5 text-sm font-semibold leading-6 text-gray-700 shadow-sm hover:bg-gray-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400 cursor-pointer;
  }

  .FileSelect {
    display: none;
  }

  #file-name {
    @apply text-gray-500;
  }

  .Separator {
    @apply my-1 h-px bg-gray-600;
  }
}

@layer utilities {
  .Bottom-left {
    @apply flex justify-start;
  }

  .Bottom-right {
    @apply flex justify-end;
  }

  .SmallText {
    @apply text-gray-500;
  }
}
.calendar-heading {
  display: none;
}

.posts-container {
  max-height: 6rem;
}

.calendar-box {
  height: 150px;
  width: 100%;
  box-sizing: border-box;
  border-width: 0;
}

.table {
  table-layout: fixed;
}

.simple-calendar th,
.simple-calendar td,
.simple-calendar table {
  border-width: 0 !important;
}
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .HomeSection {
    @apply flex items-center justify-center min-h-screen flex-col text-center space-y-8 bg-gray-50;
  }
  
  .LogoImage {
    @apply w-72 h-72 object-contain;
  }

  .WelcomeText {
    @apply text-3xl font-extrabold text-gray-900 tracking-wide;
  }

  .OrganizationText {
    @apply text-base text-gray-600;
  }

  .UserRole {
    @apply font-semibold text-blue-600;
  }
}
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities { 
    .LoginSection {
        @apply flex min-h-screen justify-center items-center;
    }
    .LoginContainer {
        @apply max-w-md w-full px-6 py-12 lg:px-2 bg-gray-100 rounded-lg shadow-lg;
    }
    .LoginFormContainer {
        @apply mt-10 sm:mx-auto sm:w-full sm:max-w-sm;
    }
    .LoginFormLabel {
        @apply block text-sm font-medium leading-6 text-gray-900;
    }
    .LoginFormInput {
        @apply block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-yellow-600 sm:text-sm sm:leading-6;
    }
    .ForgotPasswordContainer {
        @apply flex items-center justify-between;
    }
    .ForgotPasswordLink {
        @apply text-sm font-semibold text-yellow-600 hover:text-yellow-500;
    }
    .GoogleWarningText {
        @apply mt-2 text-sm text-red-600 text-center;
    }
    .SignupText {
        @apply mt-10 text-center text-sm text-gray-500;
    }
    .RememberMeLabel {
        @apply ml-2 block text-sm text-gray-900 font-medium;
    }
    .RememberMeCheckBox {
        @apply w-4 h-4 text-yellow-600 bg-gray-100 border-gray-300 rounded focus:ring-0 focus:outline-none;
    }
}
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .PerspectiveInputField {
    @apply bg-white border-0 p-2 w-full text-gray-900 ring-1 ring-inset focus:ring-2 focus:ring-inset focus:ring-yellow-600;
  }
  .PerspectiveDropdown {
    @apply w-32 bg-white border-0 border-gray-300 rounded-md p-2 text-gray-900 ring-1 ring-inset focus:ring-2 focus:ring-yellow-600 focus:border-yellow-600;
  }
  .PerspectiveDropdown option {
    @apply text-gray-900 bg-white;
  }
  .PerspectiveTextArea {
    @apply bg-white border-0 p-3 outline-none w-full text-gray-800 ring-1 ring-inset focus:ring-2 focus:ring-inset focus:ring-yellow-600;
  }

  .Bottom-left {
    @apply flex justify-start;
  }
  
  .Bottom-right {
    @apply flex justify-end;
  }
}
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .PostHeading {
    @apply text-center font-bold text-2xl m-5 text-gray-800;
  }
}
/*
 * 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.
 *









 */

select:has(option[value="draft"]:checked) {
  color: purple;
}
select:has(option[value="approved"]:checked) {
  color: #2fa458;
}
select:has(option[value="pending_review"]:checked) {
  color: #ca8a04;
}
select:has(option[value="in_analysis"]:checked) {
  color: #ca8a04;
}
select:has(option[value="rejected"]:checked) {
  color: #dd2626;
}
select:has(option[value="archived"]:checked) {
  color: #4B5563;
}
/* line 2, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar table {
  -webkit-border-horizontal-spacing: 0px;
  -webkit-border-vertical-spacing: 0px;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #dddddd;
  border-collapse: collapse;
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
}

/* line 13, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar tr {
  border-collapse: collapse;
}

/* line 17, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar th {
  padding: 6px;
  border-bottom: 2px solid #dddddd;
  border-collapse: collapse;
  border-left: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
  border-top: 0px none #333333;
  box-sizing: border-box;
  text-align: left;
}

/* line 28, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar td {
  padding: 6px;
  vertical-align: top;
  width: 14%;
  border: 1px solid #ddd;
  border-top-color: #dddddd;
  border-top-style: solid;
  border-top-width: 1px;
  border-right-color: #dddddd;
  border-right-style: solid;
  border-right-width: 1px;
  border-bottom-color: #dddddd;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-left-color: #dddddd;
  border-left-style: solid;
  border-left-width: 1px;
}

/* line 48, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar .day {
  height: 80px;
}

/* line 60, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar .today {
  background: #FFFFC0;
}

/* line 69, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar .prev-month {
  background: #DDD;
}

/* line 72, vendor/bundle/ruby/3.3.0/gems/simple_calendar-2.4.3/app/assets/stylesheets/simple_calendar.scss */
.simple-calendar .next-month {
  background: #DDD;
}
