/**
 * ClinicWP Public Styles
 * 
 * @package    ClinicWP
 * @subpackage ClinicWP/assets/css
 * @version    1.0.0
 */

/* ===========================
   Variables
   =========================== */
:root {
    --cwp-primary: #2563eb;
    --cwp-primary-hover: #1d4ed8;
    --cwp-primary-light: #dbeafe;
    --cwp-success: #10b981;
    --cwp-success-light: #d1fae5;
    --cwp-warning: #f59e0b;
    --cwp-warning-light: #fef3c7;
    --cwp-danger: #ef4444;
    --cwp-danger-light: #fee2e2;
    --cwp-purple: #8b5cf6;
    --cwp-purple-light: #ede9fe;
    --cwp-orange: #f97316;
    --cwp-orange-light: #ffedd5;
    --cwp-bg: #f9fafb;
    --cwp-white: #ffffff;
    --cwp-border: #e5e7eb;
    --cwp-text: #111827;
    --cwp-text-light: #6b7280;
    --cwp-text-lighter: #9ca3af;
    --cwp-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.1);
    --cwp-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    --cwp-shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.1);
    --cwp-radius: 8px;
    --cwp-radius-sm: 6px;
    --cwp-radius-lg: 12px;
    --cwp-transition: all 0.2s ease;
}

/* ===========================
   Base Styles
   =========================== */


/* ===========================
   Utility classes
   =========================== */
.text-center { text-align: center; }
.mr-10 { margin-right: 10px; }
.mb-10 { margin-bottom: 10px; }
.mt-10 { margin-top: 10px; }

/* ===========================
   Button Styles
   =========================== */
   .cwp-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    border-radius: var(--cwp-radius-sm);
    cursor: pointer;
    transition: var(--cwp-transition);
    text-decoration: none;
}

.cwp-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.cwp-btn-primary {
    background: var(--cwp-primary);
    color: var(--cwp-white);
}

.cwp-btn-primary:hover:not(:disabled) {
    background: var(--cwp-primary-hover);
    color:  var(--cwp-white);
}

.cwp-btn-primary:focus {
    color: var(--cwp-white);
}

.cwp-btn-secondary {
    background: var(--cwp-white);
    color: var(--cwp-text);
    border: 1px solid var(--cwp-border);
}

.cwp-btn-secondary:hover:not(:disabled) {
    background: var(--cwp-bg);
    color: var(--cwp-text);
    border: 1px solid var(--cwp-text);
}

.cwp-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--cwp-radius-sm);
    color: var(--cwp-text-light);
    cursor: pointer;
    transition: var(--cwp-transition);
}

.cwp-icon-btn:hover {
    background: var(--cwp-bg);
    color: var(--cwp-primary);
}

.cwp-icon-btn-danger:hover {
    background: var(--cwp-danger-light);
    color: var(--cwp-danger);
}