.tp-portal-wrap { max-width: 980px; margin: 0 auto; padding: 10px; }
.tp-portal-card { border:1px solid #eee; border-radius:16px; padding:18px; background:#fff; }
.tp-portal-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.tp-portal-title { font-size:20px; font-weight:700; }
.tp-portal-sub { color:#555; font-size:13px; }

.tp-portal-card-title { font-size:16px; font-weight:700; margin-bottom:12px; }

.tp-tabs { display:flex; gap:8px; margin-bottom:12px; }
.tp-tab { flex:1; padding:10px; border-radius:12px; border:1px solid #eee; background:#f8f8f8; cursor:pointer; }
.tp-tab.is-active { background:#111; color:#fff; border-color:#111; }

.tp-panel { display:none; }
.tp-panel.is-active { display:block; }

.tp-form { display:grid; gap:10px; }
.tp-form input, .tp-form button { padding:10px 12px; border-radius:10px; border:1px solid #ddd; }
.tp-form button { cursor:pointer; border-color:#111; background:#111; color:#fff; }

.tp-portal-btn { padding:10px 12px; border-radius:10px; border:1px solid #ddd; background:#f7f7f7; cursor:pointer; }
.tp-portal-btn--primary { background:#111; border-color:#111; color:#fff; }

.tp-hint { font-size:12px; color:#666; margin-top:-4px; }

.tp-msg { font-size:13px; }
.tp-msg.is-success { color:#0a7a2f; }
.tp-msg.is-error { color:#b00020; }

.tp-empty { padding:10px 0; color:#555; }

.tp-table-wrap { overflow:auto; }
.tp-table { width:100%; border-collapse:collapse; font-size:14px; }
.tp-table th, .tp-table td { padding:10px; border-bottom:1px solid #eee; text-align:left; vertical-align:top; white-space:nowrap; }
.tp-table td:nth-child(4), .tp-table td:nth-child(5) { white-space:normal; min-width:220px; }

.tp-status { display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; border:1px solid #ddd; background:#fafafa; }
.tp-status--booked { border-color:#dbeafe; background:#eff6ff; }
.tp-status--cancelled { border-color:#fee2e2; background:#fef2f2; }
.tp-status--done { border-color:#dcfce7; background:#f0fdf4; }
.tp-portal-flash{
  margin: 10px 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #eee;
  background: #fafafa;
  display:none;
}
.tp-portal-flash.is-success{ border-color:#dcfce7; background:#f0fdf4; color:#0a7a2f; }
.tp-portal-flash.is-error{ border-color:#fee2e2; background:#fef2f2; color:#b00020; }
.tp-grid-2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
@media (max-width: 700px){
  .tp-grid-2{ grid-template-columns:1fr; }
}
.tp-sep{ height:1px; background:#eee; margin:12px 0; }
.tp-portal-btn--secondary{ background:#f5f5f5; border:1px solid #ddd; }
.tp-portal-btn--secondary {
    background: #1accbf;
    border: 1px solid #192273;
    font-weight: 900;
}

button.tp-portal-btn.tp-portal-btn--primary {
    background: #3a4abf;
    border-color: #3949be;
    font-weight: 900;
}
button.tp-link.tp-forgot-btn {
    color: red;
}
button.tp-portal-btn.tp-portal-btn--secondary {
    background: #1accbf;
}

.tp-menu-portal{display:flex;gap:10px;align-items:center}
.tp-menu-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:10px;text-decoration:none;font-weight:600}
.tp-menu-btn--login,.tp-menu-btn--profile{background:#0b5fff;color:#fff}
.tp-menu-btn--logout{background:#f3f4f6;color:#111}
.tp-logout-icon{font-size:18px;line-height:1}


#tp-doctor-calendar{ width:100%; min-height:520px; }

/* Modal */
.tp-modal{ display:none; position:fixed; inset:0; z-index:9999; }
.tp-modal.is-open{ display:block; }
.tp-modal__overlay{ position:absolute; inset:0; background:rgba(0,0,0,.55); }
.tp-modal__dialog{
  position:relative;
  width:min(560px, calc(100% - 24px));
  margin:8vh auto;
  background:#fff;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.tp-modal__head{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 16px; border-bottom:1px solid #eee;
}
.tp-modal__title{ font-weight:700; }
.tp-modal__close{
  border:none; background:transparent; font-size:26px; line-height:1; cursor:pointer;
}
.tp-modal__body{ padding:14px 16px; }
.tp-modal__row{ display:flex; gap:10px; padding:6px 0; }
.tp-modal__row span{ min-width:90px; opacity:.75; }
.tp-modal__row--block{ flex-direction:column; gap:6px; }
.tp-modal__foot{ padding:12px 16px; border-top:1px solid #eee; display:flex; justify-content:flex-end; }
body.tp-modal-open{ overflow:hidden; }