/* Layout */
html.light body {
   background: white;
}
.hero {
   border: none;
   padding-top:60px;
}

/* Elements */
.pill {
   font-size: 11px;
   border-radius: 20px;
   padding: 1px 10px;
   border: 1px solid var(--color-border);
   background-color: var(--color-highlight);
   font-weight: 700;
}
.pill.red {
   background-color: rgba(246, 81, 29, 0.15);
   border-color: var(--color-red);
}
.result {
   font-size: 12px;
   display: flex;
   gap:7px;
   align-items: center;
   font-weight: 700;
}
.result::before {
   content:'';
   width: 7px;
   height: 7px;
   border-radius: 50%;
   background-color: var(--color-grey-40);
   display: block;
}
.result.red::before { background-color: var(--color-red); }
.result.green::before { background-color: var(--color-green); }

/* Tables & Carsds */
.table21>thead>tr>th, .table21>tbody>tr>th, .table21>tbody>tr>td {
   padding: 10px 15px;
}
.card1 {
   border: 1px solid var(--color-border);
   border-radius: 4px;
   box-shadow: none;
}
.card-header {
   padding: 12px 15px;
   display: flex;
   width: 100%;
   border-bottom: 1px solid var(--color-border);
   align-items: center;
   justify-content: center;
}
.card-header :first-child { flex: 1; }
.domain {
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 6px;
   border-bottom: 1px solid var(--color-border);
   padding: 20px 15px;
}
.table-checks .right { width: 90px; }

/* Search Box */
.search-box input {
   flex: 1;
   min-width: 0;
   border: none;
   background: transparent;
   outline: none;
   padding: 8px 10px;
}
.search-box {
   display: flex;
   align-items: center;
   border-radius: 100px;
   padding: 0 20px 0 10px;
   border: 1px solid var(--color-border);
   box-shadow: var(--shadow-primary);
   transition: border-color .2s, box-shadow .2s;
   background-color: white;
}
.search-box:focus-within {
   border-color: var(--color-grey-40);
   box-shadow: var(--shadow-big);
}



/* Common Styles - Should Move */
.shadow-smooth {
   box-shadow: 0px 103.306px 82.6446px rgba(0, 0, 0, 0.07),
   0px 43.1587px 34.527px rgba(0, 0, 0, 0.0503198),
   0px 23.0747px 18.4598px rgba(0, 0, 0, 0.0417275),
   0px 12.9355px 10.3484px rgba(0, 0, 0, 0.035),
   0px 6.86994px 5.49595px rgba(0, 0, 0, 0.0282725),
   0px 2.85874px 2.28699px rgba(0, 0, 0, 0.0196802);
}

.section-light-green {
   background: linear-gradient(284deg, #EDF5DF 0%, #F8FFEC 100%);
}
.up60 { transform: translate(0,-60px); }
.up30 { transform: translate(0,-30px); }

.obts {
   display: flex;
   align-items: center;
   gap: 2px;
   color: var(--color-text-60);
   font-size: 12px;
   font-weight: 500;
   flex-direction: column;
   margin-bottom: 20px;
}
.obts:hover { text-decoration: none; }

h1 { font-size: 36px; }
@media (min-width: 801px) {
   .hero h1.big { font-size: 50px; line-height: 1; margin-top: 60px; }
}
/*  */