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

/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/
.pagy {
  display: flex;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1.25rem;
  color: #6b7280;
}
.pagy > :not([hidden]) ~ :not([hidden]) {
  --space-reverse: 0;
  margin-right: calc(0.25rem * var(--space-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--space-reverse)));
}
.pagy a:not(.gap) {
  display: block;
  text-decoration: none;
  border-radius: 0.5rem;
  background-color: #e5e7eb;
  padding: 0.25rem 0.75rem;
  color: inherit;
}
.pagy a:not(.gap):hover {
  background-color: #d1d5db;
}
.pagy a:not(.gap):not([href]) { /* disabled links */
  cursor: default;
  background-color: #f3f4f6;
  color: #d1d5db;
}
.pagy a:not(.gap).current {
  background-color: #9ca3af;
  color: white;
}
.pagy label {
  white-space: nowrap;
  display: inline-block;
  border-radius: 0.5rem;
  background-color: #e5e7eb;
  padding: 0.125rem 0.75rem;
}
.pagy label input {
  line-height: 1.5rem;
  border-radius: 0.375rem;
  border-style: none;
  background-color: #f3f4f6;
}
/*



 */

.poppins-thin {
  font-family: "Poppins", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.poppins-extralight {
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.poppins-light {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.poppins-regular {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.poppins-medium {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.poppins-semibold {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.poppins-bold {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.poppins-extrabold {
  font-family: "Poppins", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.poppins-black {
  font-family: "Poppins", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.poppins-thin-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.poppins-extralight-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  font-style: italic;
}

.poppins-light-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.required-field::after {
  content: "*";
  color: red;
  margin-left:2px
}


/* direct_uploads.css */

.direct-upload {
  display: inline-block;
  position: relative;
  padding: 2px 4px;
  margin: 0 3px 3px 0;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  font-size: 11px;
  line-height: 13px;
}

.direct-upload--pending {
  opacity: 0.6;
}

.direct-upload__progress {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 0.2;
  background: #0076ff;
  transition: width 120ms ease-out, opacity 60ms 60ms ease-in;
  transform: translate3d(0, 0, 0);
}

.direct-upload--complete .direct-upload__progress {
  opacity: 0.4;
}

.direct-upload--error {
  border-color: red;
}

input[type=file][data-direct-upload-url][disabled] {
  display: none;
}

.field_with_errors {
  display: flex;
  width: 100%;
}

.fellowship_woman_img {
  background-image: linear-gradient(180deg, rgba(56, 80, 163, 0) 0%, #151E3D 100%), url(/assets/fellowship_woman_image-be20cbbed90d78f738f13b33bb4a0a1a20b1038c6f5f7340d1c9c55dae5d3605.png);
}

.announce_woman_img {
  background-image: linear-gradient(180deg, rgba(56, 80, 163, 0) 0%, #151E3D 100%), url(/assets/announce_woman_image-d4cc951acea9a1d80780efc18a0e273ac7d83f9d4882af235c93da4504fb110c.png);
}

.lms_img {
  background-image: linear-gradient(180deg, rgba(56, 80, 163, 0) 0%, #151E3D 100%), url(/assets/lms_image-0f35c04f59c1ddb15bf1c5a912827a082f39570abd95e6a697307b7f2f65d2da.png);
}

/* Devise Auth Background Doodle */
.devise-doodle-bg {
  background-color: #3850A3;
  background-image:
    radial-gradient(circle at 15% 25%, rgba(71, 102, 211, 0.3) 0%, transparent 40%),
    radial-gradient(circle at 85% 15%, rgba(255, 255, 255, 0.06) 0%, transparent 35%),
    radial-gradient(circle at 35% 75%, rgba(71, 102, 211, 0.25) 0%, transparent 38%),
    radial-gradient(circle at 90% 80%, rgba(255, 255, 255, 0.05) 0%, transparent 30%);
  position: relative;
}

.devise-doodle-bg::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  background-image:
    url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='25' fill='none' stroke='%23ffffff' stroke-width='2' opacity='0.12'/%3E%3Ccircle cx='170' cy='170' r='20' fill='none' stroke='%234766D3' stroke-width='2' opacity='0.15'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg width='180' height='180' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='20' y='20' width='35' height='40' rx='3' fill='none' stroke='%23ffffff' stroke-width='2.5' opacity='0.1'/%3E%3Cline x1='27' y1='32' x2='48' y2='32' stroke='%23ffffff' stroke-width='2' opacity='0.1'/%3E%3Cline x1='27' y1='42' x2='48' y2='42' stroke='%23ffffff' stroke-width='2' opacity='0.1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg width='160' height='160' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='80' cy='80' r='30' fill='none' stroke='%234766D3' stroke-width='3' opacity='0.13'/%3E%3Cpath d='M68 80 l8 8 16-18' stroke='%234766D3' stroke-width='3' fill='none' opacity='0.13'/%3E%3C/svg%3E");
  background-size: 200px 200px, 180px 180px, 160px 160px;
  background-position: 10% 20%, 75% 60%, 85% 10%;
  pointer-events: none;
}

.devise-doodle-bg > * {
  position: relative;
  z-index: 1;
}