/* common-admin.css - 管理画面共通スタイル */
:root{
  --green:#06C755;--green-dark:#00A040;--green-light:#E8FAF0;--green-mid:#04A844;
  --black:#111111;--gray-dark:#333;--gray:#666;--gray-light:#F5F7F5;
  --white:#FFFFFF;--border:#E0EDE4;--sidebar:#FFFFFF;--sidebar-hover:#F0FBF4;
  --font:"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:var(--font);background:var(--gray-light);display:flex;min-height:100vh;}
a{text-decoration:none;color:inherit;}
.sidebar{width:220px;flex-shrink:0;background:var(--sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;overflow-y:auto;z-index:50;}
.sidebar-logo{padding:20px 20px 16px;font-size:20px;font-weight:900;color:var(--green);border-bottom:1px solid var(--border);}
.sidebar-logo span{color:var(--black);}
.sidebar-server-time{padding:12px 16px 14px;border-bottom:1px solid var(--border);font-size:12px;color:var(--gray-dark);}
.sidebar-server-time-head{font-size:10px;font-weight:700;color:#aaa;letter-spacing:0.5px;text-transform:uppercase;margin-bottom:6px;}
.sidebar-server-time-val{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--black);letter-spacing:0.02em;}
.sidebar-server-time-tz{font-size:11px;color:var(--gray);margin-top:4px;}
.sidebar-server-time-hint{font-size:10px;color:#aaa;margin-top:6px;}
.s{padding:16px 12px 8px;font-size:10px;font-weight:700;color:#aaa;letter-spacing:1.5px;text-transform:uppercase;}
.i{display:flex;align-items:center;gap:10px;padding:10px 12px;margin:1px 8px;border-radius:8px;font-size:13px;font-weight:500;color:#555;cursor:pointer;transition:all 0.15s;}
.i:hover{background:var(--sidebar-hover);color:var(--green-dark);}.i.active{background:var(--green);color:#fff;font-weight:700;}
.ic{font-size:16px;width:20px;text-align:center;flex-shrink:0;}
.sb{margin-top:auto;padding:12px 8px;border-top:1px solid var(--border);}
.ua{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;}
.av{width:32px;height:32px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0;}
.un{font-size:12px;font-weight:600;color:var(--black);}.up{font-size:10px;color:var(--gray);}
.main{margin-left:220px;flex:1;display:flex;flex-direction:column;}
.topbar{background:#fff;border-bottom:1px solid var(--border);padding:0 32px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:40;}
.topbar-title{font-size:17px;font-weight:800;}
.content{padding:28px 32px;}
.btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;font-family:var(--font);border:none;transition:all 0.15s;}
.btn-p{background:var(--green);color:#fff;}.btn-p:hover{background:var(--green-dark);}
.btn-o{background:#fff;color:var(--green);border:1.5px solid var(--green);}.btn-o:hover{background:var(--green-light);}
.btn-sm{padding:6px 14px;font-size:12px;}
.card{background:#fff;border-radius:12px;border:1px solid var(--border);overflow:hidden;}
.card-h{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.card-title{font-size:14px;font-weight:700;}
.card-body{padding:20px;}
.badge{font-size:11px;font-weight:600;padding:3px 10px;border-radius:100px;}
.b-green{background:var(--green-light);color:var(--green-dark);}
.b-orange{background:#FFF3E0;color:#E65100;}
.b-blue{background:#E3F2FD;color:#1565C0;}
.b-gray{background:#F0F0F0;color:var(--gray);}
.b-red{background:#FFEBEE;color:#C62828;}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,0.45);z-index:200;display:none;align-items:center;justify-content:center;}
.modal-bg.show{display:flex;}
.modal{background:#fff;border-radius:16px;width:500px;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,0.2);}
.modal-h{padding:20px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.modal-h h3{font-size:16px;font-weight:800;}
.mc{font-size:20px;cursor:pointer;color:var(--gray);}
.modal-body{padding:24px;}
.modal-f{padding:16px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:12px;}
.fg{margin-bottom:16px;}
.fg label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;}
.fg input,.fg select,.fg textarea{width:100%;padding:10px 12px;border:1.5px solid var(--border);border-radius:8px;font-size:14px;font-family:var(--font);outline:none;}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--green);}
.tabs{display:flex;border-bottom:2px solid var(--border);margin-bottom:24px;}
.tab{padding:10px 20px;font-size:14px;font-weight:600;cursor:pointer;color:var(--gray);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all 0.15s;}
.tab.active{color:var(--green);border-bottom-color:var(--green);}
.grid-cards{display:grid;gap:20px;}
.grid-2{grid-template-columns:1fr 1fr;}
.grid-3{grid-template-columns:1fr 1fr 1fr;}
.tr{padding:13px 20px;border-bottom:1px solid var(--border);display:flex;gap:12px;font-size:13px;align-items:center;transition:background 0.15s;}
.tr:last-child{border-bottom:none;}.tr:hover{background:#FAFFF9;}
.th{padding:10px 20px;border-bottom:1px solid var(--border);display:flex;gap:12px;font-size:12px;font-weight:700;color:var(--gray);background:var(--gray-light);}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#111;color:#fff;padding:12px 24px;border-radius:8px;font-size:14px;opacity:0;transition:opacity 0.3s;z-index:999;pointer-events:none;white-space:nowrap;}
.toast.show{opacity:1;}
.app-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
.app-sbox{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--border);border-radius:8px;padding:8px 14px;flex:1;max-width:320px;}
.app-sbox input{border:none;outline:none;font-size:14px;width:100%;background:transparent;font-family:var(--font);}
.app-filter{padding:9px 14px;border:1.5px solid var(--border);border-radius:8px;font-size:13px;font-family:var(--font);background:#fff;outline:none;cursor:pointer;color:var(--gray-dark);}
.app-muted{font-size:13px;color:var(--gray);}
.app-pager{display:flex;gap:8px;align-items:center;margin-top:16px;}
.app-tag{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:100px;background:var(--green-light);color:var(--green-dark);}
