/*
 * Destinos y atenciones internas.
 *
 * Mantiene separados los enlaces externos de las experiencias construidas en
 * megaproyecto. La interfaz usa tarjetas desplazables para escoger una
 * atención sin perder la URL externa almacenada.
 */

.panel-page .destination-mode-fieldset{
  display:grid;
  gap:9px;
  margin:18px 0 0;
  padding:0;
  border:0;
}

.panel-page .destination-mode-fieldset legend{
  padding:0;
  color:#523354;
  font:800 12px/1.2 Arial,sans-serif;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.panel-page .destination-mode-options{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.panel-page .destination-mode-choice{
  position:relative;
  display:inline-flex;
  min-width:0;
  margin:0;
  cursor:pointer;
}

.panel-page .destination-mode-choice input{
  position:absolute;
  inline-size:1px;
  block-size:1px;
  opacity:0;
  pointer-events:none;
}

.panel-page .destination-mode-choice > span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:36px;
  padding:8px 11px;
  color:#79637a;
  font:800 12px/1 Arial,sans-serif;
  background:#fff;
  border:1px solid #e6dbe6;
  border-radius:9px;
  transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease;
}

.panel-page .destination-mode-choice > span::before{
  inline-size:9px;
  block-size:9px;
  border:2px solid currentColor;
  border-radius:50%;
  content:"";
}

.panel-page .destination-mode-choice input:checked + span{
  color:#79066d;
  background:#fff2fb;
  border-color:#eaa7dc;
  box-shadow:0 0 0 3px #f7007610;
}

.panel-page .destination-mode-choice input:checked + span::before{
  border-color:#f70076;
  box-shadow:inset 0 0 0 2px #fff, inset 0 0 0 5px #f70076;
}

.panel-page .destination-mode-choice input:focus-visible + span{
  outline:3px solid #08c7bb45;
  outline-offset:2px;
}

.panel-page .destination-mode-panel{
  min-width:0;
  padding:13px;
  background:linear-gradient(135deg,#fffafd,#fff);
  border:1px solid #eee1ed;
  border-radius:12px;
}

.panel-page .destination-mode-panel[hidden]{display:none!important}

.panel-page .destination-mode-panel > p{
  margin:0 0 10px;
  color:#806d82;
  font-size:12px;
  line-height:1.4;
}

.panel-page .destination-mode-panel label{margin:0}

/* Carrusel horizontal: mouse/trackpad en escritorio, deslizamiento natural en móvil. */
.panel-page .internal-flow-slider{
  display:flex;
  gap:9px;
  max-width:100%;
  padding:2px 1px 8px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-padding-inline:2px;
  scroll-snap-type:x proximity;
  scrollbar-color:#dcb5d7 transparent;
  scrollbar-width:thin;
}

.panel-page .internal-flow-slider::-webkit-scrollbar{height:7px}
.panel-page .internal-flow-slider::-webkit-scrollbar-thumb{background:#e1bfdc;border-radius:99px}

.panel-page .internal-flow-choice{
  position:relative;
  display:block;
  flex:0 0 194px;
  margin:0;
  cursor:pointer;
  scroll-snap-align:start;
}

.panel-page .internal-flow-choice input{
  position:absolute;
  inline-size:1px;
  block-size:1px;
  opacity:0;
  pointer-events:none;
}

.panel-page .internal-flow-card{
  display:grid;
  min-height:116px;
  padding:13px;
  color:#3d2a44;
  background:#fff;
  border:1px solid #e8dce8;
  border-radius:11px;
  box-shadow:0 6px 16px #4b174007;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

.panel-page .internal-flow-choice:hover .internal-flow-card{transform:translateY(-1px);border-color:#d9a5d1}
.panel-page .internal-flow-choice input:checked + .internal-flow-card,.panel-page .internal-flow-choice.is-selected .internal-flow-card{border-color:#f50076;background:linear-gradient(145deg,#fff8fe,#fff);box-shadow:0 8px 19px #79066d17}
.panel-page .internal-flow-choice input:checked + .internal-flow-card::after,.panel-page .internal-flow-choice.is-selected .internal-flow-card::after{position:absolute;inset:9px 9px auto auto;display:grid;inline-size:19px;block-size:19px;place-items:center;color:#fff;font:800 13px/1 Arial,sans-serif;background:#f70076;border-radius:50%;content:"✓"}
.panel-page .internal-flow-choice input:focus-visible + .internal-flow-card{outline:3px solid #08c7bb45;outline-offset:2px}

.panel-page .internal-flow-card b{display:block;max-width:145px;overflow:hidden;color:#351a40;font-size:14px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
.panel-page .internal-flow-card small{display:block;margin-top:5px;color:#8b778e;font-size:11px;line-height:1.35}
.panel-page .internal-flow-meta{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:12px;color:#8b7489;font-size:10px;font-weight:700}

.panel-page .internal-flow-status{display:inline-flex;align-items:center;gap:5px;min-height:20px;padding:4px 7px;border-radius:99px;font:800 10px/1 Arial,sans-serif;white-space:nowrap}
.panel-page .internal-flow-status::before{inline-size:6px;block-size:6px;border-radius:50%;background:currentColor;content:""}
.panel-page .internal-flow-status.is-active{color:#087f75;background:#e8f9f6}
.panel-page .internal-flow-status.is-draft{color:#9a6100;background:#fff3dd}
.panel-page .internal-flow-status.is-inactive{color:#7d6d7d;background:#f2edf2}

.panel-page .internal-flow-create{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  margin-top:9px;
  color:#79066d;
  font:800 12px/1 Arial,sans-serif;
  text-decoration:none;
  background:#fff;
  border:1px dashed #d9a7d2;
  border-radius:9px;
}

.panel-page .internal-flow-create:hover{background:#fff4fc;border-color:#f70076}

/* Lista administrativa de atenciones internas. */
.panel-page .internal-flow-list{display:grid;gap:9px;margin-top:16px}
.panel-page .internal-flow-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 13px;background:#fff;border:1px solid #eee2ed;border-radius:11px}
.panel-page .internal-flow-row b,.panel-page .internal-flow-row small{display:block}
.panel-page .internal-flow-row b{color:#3b1f43;font-size:13px}
.panel-page .internal-flow-row small{margin-top:3px;color:#8c778d;font-size:11px}
.panel-page .internal-flow-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.panel-page .internal-flow-actions a,.panel-page .internal-flow-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:7px 9px;color:#79066d;font:800 11px/1 Arial,sans-serif;text-decoration:none;background:#f7edf6;border:1px solid #ead8e8;border-radius:8px}
.panel-page .internal-flow-actions a:hover,.panel-page .internal-flow-actions button:hover{background:#79066d;color:#fff}
.panel-page .internal-flow-empty{margin:15px 0 0;padding:17px;color:#88748a;font-size:12px;text-align:center;background:#fffafd;border:1px dashed #e4d6e2;border-radius:11px}

/* Vista independiente de configuración: reduce altura y preserva filas legibles. */
.panel-page .internal-settings-layout{align-items:start}
.panel-page .internal-flow-admin-card,.panel-page .internal-flow-edit-card,.panel-page .internal-destination-sheet{max-width:880px}
.panel-page .internal-flow-new{grid-template-columns:minmax(0,1fr) auto;align-items:end}
.panel-page .internal-flow-new label{margin:0}
.panel-page .internal-flow-new button{min-height:40px;white-space:nowrap}
.panel-page .internal-flow-edit-card{margin-top:14px}
.panel-page .internal-flow-edit-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.42fr);gap:12px}
.panel-page .internal-flow-edit-form .field-note,.panel-page .internal-flow-edit-form > div:last-child{grid-column:1/-1}
.panel-page .internal-destination-sheet .sheet-title{align-items:flex-start}
.panel-page .internal-destination-sheet .detail-add-office{margin-left:auto}
.panel-page .prefix-section-head{margin-top:18px}
.panel-page .prefix-section-head h3{margin:0;color:#28152f;font-size:16px}
.panel-page .prefix-section-head .section-copy{margin:4px 0 12px}
.panel-page .prefix-add-with-note{display:grid;grid-template-columns:minmax(132px,.65fr) minmax(0,1fr) auto;gap:8px;align-items:center}
.panel-page .prefix-add-with-note input{min-width:0}
.panel-page .prefix-add-with-note button{min-height:40px;white-space:nowrap}
.panel-page .prefix-list-clean{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:11px}
.panel-page .prefix-list-row{display:grid;grid-template-columns:minmax(116px,.42fr) minmax(0,1fr) auto;gap:8px;align-items:end;padding:9px 10px;background:#fff;border:1px solid #eee2ed;border-radius:10px}
.panel-page .prefix-list-row label{display:grid;gap:4px;margin:0;color:#8b748a;font:800 9px/1 Arial,sans-serif;letter-spacing:.07em;text-transform:uppercase}
.panel-page .prefix-list-row input{min-width:0;height:35px;padding:7px 9px;color:#34203c;font-size:13px;background:#fff}
.panel-page .prefix-list-row input[readonly]{color:#57465b;background:#fffcff;border-color:#eee1ed;cursor:default}
.panel-page .prefix-list-actions{display:flex;gap:5px;padding-bottom:1px}
.panel-page .prefix-list-actions .icon-button,.panel-page .prefix-delete-form .icon-button{min-width:35px;height:35px;padding:0}
.panel-page .prefix-delete-form{display:flex;align-items:end}
.panel-page .internal-destination-label{display:inline-flex;max-width:300px;padding:5px 8px;color:#087f75;font-size:11px;font-weight:800;background:#e8f9f6;border-radius:99px}
.panel-page .internal-office-list td:nth-child(2){max-width:420px;overflow-wrap:anywhere}

@media(max-width:760px){
  .panel-page .internal-flow-new{grid-template-columns:1fr}
  .panel-page .internal-flow-new button{width:100%}
  .panel-page .prefix-add-with-note{grid-template-columns:1fr 1fr}
  .panel-page .prefix-add-with-note button{grid-column:1/-1}
  .panel-page .prefix-list-clean{grid-template-columns:1fr}
  .panel-page .prefix-delete-form{justify-self:end;margin-top:-49px;margin-right:10px}
}

@media(max-width:620px){
  .panel-page .settings-menu{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panel-page .destination-mode-fieldset{margin-top:15px}
  .panel-page .destination-mode-options{display:grid;grid-template-columns:1fr 1fr}
  .panel-page .destination-mode-choice,.panel-page .destination-mode-choice > span{width:100%}
  .panel-page .destination-mode-choice > span{justify-content:center;padding-inline:8px}
  .panel-page .destination-mode-panel{padding:11px}
  .panel-page .internal-flow-slider{margin-right:-2px;padding-bottom:9px}
  .panel-page .internal-flow-choice{flex-basis:176px}
  .panel-page .internal-flow-card{min-height:108px;padding:12px}
  .panel-page .internal-flow-row{align-items:flex-start;gap:10px;padding:11px}
  .panel-page .internal-flow-actions{gap:5px}
  .panel-page .internal-flow-actions a,.panel-page .internal-flow-actions button{min-height:30px;padding:7px 8px}
  .panel-page .internal-destination-sheet .sheet-title{display:grid;gap:10px}
  .panel-page .internal-destination-sheet .detail-add-office{margin-left:0}
  .panel-page .internal-flow-edit-form{grid-template-columns:1fr}
  .panel-page .prefix-list-row{grid-template-columns:1fr;gap:8px;padding:10px}
  .panel-page .prefix-list-actions{justify-content:flex-end}
  .panel-page .prefix-list-clean{gap:8px}
}

@media(max-width:370px){
  .panel-page .destination-mode-options{grid-template-columns:1fr}
  .panel-page .internal-flow-choice{flex-basis:164px}
  .panel-page .internal-flow-row{display:grid}
  .panel-page .internal-flow-actions{width:100%}
}