/* ===============================
CLICK2PAY GLOBAL THEME
=============================== */

*{
box-sizing:border-box;
}

html,body{
margin:0;
padding:0;
min-height:100%;
background:#f8fafc;
color:#0f172a;
transition:.3s;
font-family:Inter,Arial,sans-serif;
}

/* DARK GLOBAL */

html.dark,
html.dark body{
background:#020617;
color:#e2e8f0;
}

/* CONTAINER */

html.dark .container,
html.dark main{
color:#e2e8f0;
}

/* CARD */

.card,
.box,
.dash-card,
.dash-box,
.link-card,
.report-card,
.stats-box,
.empty{
background:#fff;
color:#0f172a;
border:1px solid #e2e8f0;
transition:.3s;
}

html.dark .card,
html.dark .box,
html.dark .dash-card,
html.dark .dash-box,
html.dark .link-card,
html.dark .report-card,
html.dark .stats-box,
html.dark .empty{
background:#0f172a;
color:#f8fafc;
border-color:#1e293b;
}

/* TEXT */

html.dark h1,
html.dark h2,
html.dark h3,
html.dark h4,
html.dark p,
html.dark span,
html.dark label,
html.dark small{
color:#e2e8f0;
}

html.dark .link-info p,
html.dark .stats-note,
html.dark .create-note{
color:#94a3b8;
}

/* NAVBAR */

html.dark .c2p-navbar{
background:#0f172a;
color:#fff;
border-color:#1e293b;
}

html.dark .c2p-logo{
color:#fff;
}

html.dark .c2p-sidebar{
background:#0f172a;
color:#fff;
}

html.dark .c2p-sidebar a,
html.dark .c2p-parent{
color:#cbd5e1;
}

html.dark .c2p-sidebar a:hover,
html.dark .c2p-parent:hover{
background:#1e293b;
}

/* DROPDOWN */

html.dark .c2p-dropdown{
background:#0f172a;
color:#fff;
border-color:#1e293b;
}

/* INPUT */

input,
select,
textarea{
background:#fff;
color:#0f172a;
border:1px solid #cbd5e1;
transition:.3s;
}

html.dark input,
html.dark select,
html.dark textarea{
background:#020617;
color:#fff;
border-color:#334155;
}

/* BUTTON */

button{
transition:.3s;
}

html.dark button{
color:#fff;
}

/* TABLE */

table{
width:100%;
}

html.dark table{
background:#0f172a;
color:#e2e8f0;
}

html.dark th{
background:#162033;
color:#fff;
}

html.dark td{
background:#0f172a;
color:#e2e8f0;
border-color:#334155;
}

/* FOOTER */

html.dark footer,
html.dark .footer{
background:#0f172a;
color:#cbd5e1;
border-color:#1e293b;
}

/* MOBILE */

@media(max-width:768px){

body{
font-size:14px;
}

.card,
.box,
.link-card{
border-radius:16px;
}

}

/* DESKTOP */

@media(min-width:769px){

body{
font-size:15px;
}

}