/*******************************************************************************
  File Name: root/assets/css/base.css
  Purpose:   Reset, Base Elements, Typography, Cards & Utilities
*******************************************************************************/

/* =====================================================
   GLOBAL RESET
===================================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* =====================================================
   BODY
===================================================== */

body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    overflow-x: hidden;
    background: #ffffff;
    color: #212529;
}

/* =====================================================
   IMAGES
===================================================== */

img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 0;
}

/* =====================================================
   REMOVE ROUNDED CORNERS GLOBALLY
===================================================== */

*,
.card,
.btn,
.form-control,
.form-select,
.dropdown-menu,
.modal-content,
.badge,
img,
.rounded,
.rounded-1,
.rounded-2,
.rounded-3,
.rounded-4,
.rounded-5 {
    border-radius: 0 !important;
}

/* =====================================================
   LINKS
===================================================== */

a {
    text-decoration: none;
    transition: all .25s ease;
}

a:hover {
    text-decoration: none;
}

/* =====================================================
   HEADINGS
===================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: .75rem;
    font-weight: 700;
    line-height: 1.3;
    color: #111827;
}

/* =====================================================
   PARAGRAPHS
===================================================== */

p {
    margin: 0 0 20px;
    font-size: 16px;
    line-height: 1.75;
    color: #3a3a3a;
}

/* =====================================================
   LISTS
===================================================== */

ul,
ol {
    margin-bottom: 20px;
    padding-left: 20px;
}

li {
    line-height: 1.8;
}

/* =====================================================
   SECTION
===================================================== */

section {
    overflow: hidden;
}

/* =====================================================
   CARDS
===================================================== */

.card {
    border: 1px solid #e9ecef;
    border-radius: 0;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

/* =====================================================
   BUTTONS
===================================================== */

.btn {
    border-radius: 0;
    transition: all .25s ease;
}

/* =====================================================
   FORM ELEMENTS
===================================================== */

.form-control,
.form-select {
    border-radius: 0;
}

.form-control:focus,
.form-select:focus {
    box-shadow: none;
}

/* =====================================================
   TABLES
===================================================== */

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 12px;
    border: 1px solid #dee2e6;
}

/* =====================================================
   HORIZONTAL RULE
===================================================== */

hr {
    opacity: .15;
}

/* =====================================================
   SUBTLE FADE ANIMATION
===================================================== */

@keyframes fadeInUp {

    from {

        opacity: 0;

        transform: translateY(30px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}