/* ==========================================
   ECONOMIC CALENDAR
========================================== */

.economic-calendar-page{

    padding:60px 0;

    background:var(--light);

}

.economic-calendar-page h1{

    font-size:34px;

    color:var(--primary);

    margin-bottom:10px;

    font-weight:700;

}

.economic-calendar-page h1 i{

    color:var(--secondary);

    margin-right:10px;

}

.calendar-subtitle{

    color:var(--grey);

    margin-bottom:35px;

    font-size:16px;

}

/* ==========================================
   TABLE
========================================== */

.calendar-table{

    width:100%;

    border-collapse:collapse;

    background:var(--white);

    border-radius:var(--radius);

    overflow:hidden;

    box-shadow:var(--shadow);

}

.calendar-table thead{

    background:var(--primary);

    color:var(--white);

}

.calendar-table th{

    padding:18px 15px;

    text-align:left;

    font-size:14px;

    font-weight:600;

    white-space:nowrap;

}

.calendar-table td{

    padding:16px 15px;

    border-bottom:1px solid var(--border);

    font-size:14px;

    color:var(--dark);

    vertical-align:middle;

}

.calendar-table tbody tr{

    transition:.25s;

}

.calendar-table tbody tr:hover{

    background:#eef4fb;

}

/* ==========================================
   IMPORTANCE BADGES
========================================== */

.importance{

    display:inline-block;

    padding:6px 12px;

    border-radius:30px;

    font-size:13px;

    font-weight:600;

    color:#fff;

}

.importance.high{

    background:#b42318;

}

.importance.medium{

    background:#ba6b00;

}

.importance.low{

    background:var(--green);

}

/* ==========================================
   POSITIVE / NEGATIVE VALUES
========================================== */

.positive{

    color:var(--green);

    font-weight:600;

}

.negative{

    color:#b42318;

    font-weight:600;

}

/* ==========================================
   RESPONSIVE
========================================== */

@media(max-width:992px){

.calendar-table{

    display:block;

    overflow-x:auto;

}

}

@media(max-width:768px){

.economic-calendar-page{

    padding:40px 0;

}

.economic-calendar-page h1{

    font-size:28px;

}

.calendar-table th,

.calendar-table td{

    padding:12px 10px;

    font-size:13px;

}

}

/* ==============================
   TOOLBAR
============================== */

.calendar-toolbar{

display:flex;

gap:15px;

margin-bottom:25px;

flex-wrap:wrap;

}

.calendar-toolbar input,

.calendar-toolbar select{

padding:12px 16px;

border:1px solid var(--border);

border-radius:var(--radius);

font-size:14px;

font-family:Poppins,sans-serif;

}

.calendar-toolbar input{

flex:1;

min-width:260px;

}

/* ==============================
   TODAY EVENT
============================== */

.today-event{

background:#fff8e5 !important;

font-weight:600;

}

/* ==============================
   COUNTRY FLAGS
============================== */

.country-flag{

font-size:20px;

margin-right:8px;

}