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





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

    .bxtn {
        @apply bg-green-200 py-2 rounded-md border flex items-center px-3;
    }
    .link {
        @apply hover:border-b hover:border-solid hover:border-purple-800 hover:text-purple-800;
    }
    .title {
        @apply font-semibold tracking-wide my-2;

    }
    .heading-1 {
        @apply  font-bold text-2xl ;
    }
    .heading-2 {
        @apply  heading-1 text-xl ;
    }
    .simple_form .input input, .simple_form .input textarea {
        @apply py-2 px-2 bg-gray-100 mx-2 rounded-md;
    }

    input[type="submit"] {
        @apply p-1 text-sm my-1 font-semibold border border-black rounded-md;
    }
    a {
        @apply cursor-pointer;
    }
}
/* Pagination */
.pagy {
    @apply flex space-x-1 font-semibold text-sm text-gray-500;
    a:not(.gap) {
        @apply block rounded-lg px-3 py-1 bg-gray-200 cursor-pointer;
        &:hover {
            @apply bg-gray-300;
        }
        &:not([href]) { /* disabled links */
            @apply text-gray-300 bg-gray-100 cursor-default;
        }
        &.current {
            @apply text-white bg-gray-400;
        }
    }
    label {
        @apply inline-block whitespace-nowrap bg-gray-200 rounded-lg px-3 py-0.5;
        input {
            @apply bg-gray-100 border-none rounded-md;
        }
    }
}
/*
 * 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.
 *


 */
* {
    font-family: "Manrope", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}