/**
ThrivePath Main Stylesheet
Version: 1.0.0
*/
:root {
--tp-primary: #2563eb;
--tp-secondary: #7c3aed;
--tp-success: #10b981;
--tp-warning: #f59e0b;
--tp-danger: #ef4444;
--tp-light: #f3f4f6;
--tp-dark: #1f2937;
--tp-border: #e5e7eb;
--tp-radius: 8px;
--tp-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
}
.thrivepath-wrapper * {
box-sizing: border-box;
}
.tp-container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.tp-card {
background: white;
border-radius: var(--tp-radius);
box-shadow: var(--tp-shadow);
padding: 24px;
margin-bottom: 20px;
}
.tp-card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
padding-bottom: 16px;
border-bottom: 1px solid var(--tp-border);
}
.tp-card-title {
font-size: 1.5rem;
font-weight: 600;
color: var(--tp-dark);
margin: 0;
}
.tp-grid {
display: grid;
gap: 20px;
}
.tp-grid-2 {
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.tp-grid-3 {
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.tp-widget {
background: white;
border-radius: var(--tp-radius);
padding: 20px;
box-shadow: var(--tp-shadow);
}
.tp-widget-icon {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 12px;
}
.tp-widget-icon.primary {
background: rgba(37, 99, 235, 0.1);
color: var(--tp-primary);
}
.tp-widget-icon.success {
background: rgba(16, 185, 129, 0.1);
color: var(--tp-success);
}
.tp-widget-value {
font-size: 2rem;
font-weight: 700;
color: var(--tp-dark);
margin: 8px 0;
}
.tp-widget-label {
color: #6b7280;
font-size: 0.875rem;
}
.tp-btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 10px 20px;
border-radius: var(--tp-radius);
font-weight: 500;
cursor: pointer;
border: none;
transition: all 0.2s;
text-decoration: none;
}
.tp-btn-primary {
background: var(--tp-primary);
color: white;
}
.tp-btn-primary:hover {
background: #1d4ed8;
}
.tp-btn-secondary {
background: var(--tp-light);
color: var(--tp-dark);
}
.tp-form-group {
margin-bottom: 20px;
}
.tp-label {
display: block;
margin-bottom: 8px;
font-weight: 500;
color: var(--tp-dark);
}
.tp-input,
.tp-textarea,
.tp-select {
width: 100%;
padding: 10px 12px;
border: 1px solid var(--tp-border);
border-radius: var(--tp-radius);
font-size: 1rem;
}
.tp-input:focus {
outline: none;
border-color: var(--tp-primary);
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.tp-appointment-item {
padding: 12px;
border-left: 4px solid var(--tp-primary);
background: var(--tp-light);
border-radius: 4px;
margin-bottom: 8px;
}
.tp-appointment-time {
font-weight: 600;
color: var(--tp-dark);
margin-bottom: 4px;
}
@media (max-width: 768px) {
.tp-container {
padding: 12px;
}
    .tp-grid-2,
    .tp-grid-3 {
        grid-template-columns: 1fr;
    }
}